@section('title', __('general.page_dashboard_title'))
@section('head')
@endsection
@include('includes/header')
@include('includes/topDash')

        <div class="content">


            <div class="row mt-4">
			
			@if (session('serverID') == '333')
				<div class="row">
		<div class="col-md-12">
			<div class="alert alert-warning">{{ __('general.dash_network_notice') }} <br>{{ __('general.dash_network_notice_2') }}</div>
		</div>
		</div>
			@endif
			
                <div class="col-md-6 col-xl-8">
                    <div class="block block-rounded block-link-shadow">
                        <div class="head-block-bg"></div>
                        <div class="block-content block-content-full d-flex align-items-center pb-3">

                            <div class="me-3">
                                <div class="inner-image options-container">

                                    <img class="img-avatar-thumb options-item" src="{{ ($siteData->avatar ? env('APP_URL').$siteData->avatar : '/assets/media/avatars/noimage.jpg') }}" alt="">
                                    <a href="{{ route('settings.r') }}" class="options-overlay bg-black-75">
                                        <div class="options-overlay-content">
                                            <span class="h6 text-white fw-normal mb-3">{{ __('general.action_change') }}</span>
                                        </div>
                                    </a>

                                </div>
                            </div>

                            <div class="overflow-hidden">
                                <p class="fs-lg fw-semibold h-sh mb-0 overflow-hidden text-truncate">
                                    {{ $siteData->name }}
                                </p>
                                <p class="text-muted pt-1 mb-0 overflow-hidden text-truncate">
                                    {{ $siteData->domain }}
                                </p>
                            </div>
                        </div>


                        <div class="block-content block-content-full border-top p-0">
                            <div class="row g-sm">

                                <div class="col-xl-6 col-md-12 col-sm-12">
                                    <div class="d-flex justify-content-between align-items-center p-3">
                                        <div class="overflow-hidden fl50 pe-3">
                                            <div class="fs-6 fw-semibold mb-3">{{ __('general.dash_settings_title') }}</div>
                                            <div class="fs-sm fw-bold text-muted">{{ __('general.label_timezone') }}</div>
                                            <p class="fs-sm mb-2">{{ ($siteData->timezone == 'America/Sao_Paulo' ? __('general.timezone_brasilia') : $siteData->timezone) }}</p>
                                            <div class="fs-sm fw-bold text-muted">{{ __('general.label_address') }}</div>
                                            <p class="fs-sm mb-0 sche-prog me-3">{{ (isset($contactData->contact_address) ? $contactData->contact_address : __('general.value_not_set')) }}</p>
                                        </div>
                                        <div class="mb-0 mt-5 overflow-hidden fl50">
                                            <div class="fs-sm fw-bold text-muted">{{ __('general.label_contact_email') }}</div>
                                            <p class="fs-sm mb-2 sche-prog me-2 overflow-hidden text-truncate">{{ (isset($contactData->contact_email) ? $contactData->contact_email : $userLogged->email) }}</p>
                                            <div class="fs-sm fw-bold text-muted mb-1">{{ __('general.label_social') }}</div>
                                            <p class="fs-sm mb-0">
                                                @if($socialData->social_facebook)
                                                <a @if(!Config::get('constants.IS_APP')) href="{{ $socialData->social_facebook }}" target="_blank" @else href="javascript:void(0);" @endif class="btn btn-sm rounded-6 btn-alt-secondary">
                                                    <i class="fab fa-facebook"></i>
                                                </a>
                                                @endif
                                                @if($socialData->social_instagram)
													@php
														$instaValue = $socialData->social_instagram;
														
														// Verifica se já é uma URL (funciona em PHP antigo e novo)
														if (strpos($instaValue, 'http') === 0) {
															$urlFinal = $instaValue;
														} else {
															// Remove o @ se existir e monta a URL
															$handle = ltrim($instaValue, '@');
															$urlFinal = "https://instagram.com/" . $handle;
														}
													@endphp

													<a @if(!Config::get('constants.IS_APP')) 
															href="{{ $urlFinal }}" 
															target="_blank" 
													   @else 
															href="javascript:void(0);" 
													   @endif 
													   class="btn btn-sm rounded-6 btn-alt-secondary">
														<i class="fab fa-instagram"></i>
													</a>
												@endif
                                                @if($socialData->social_twitter)
                                                <a href="{{ $socialData->social_twitter }}" class="btn btn-sm rounded-6 btn-alt-secondary" target="_blank">
                                                    <i class="fab fa-twitter"></i>
                                                </a>
                                                @endif
                                                @if($socialData->social_youtube)
                                                <a href="{{ $socialData->social_youtube }}" class="btn btn-sm rounded-6 btn-alt-secondary" target="_blank">
                                                    <i class="fab fa-youtube"></i>
                                                </a>
                                                @endif
                                                @if($socialData->social_tiktok)
                                                <a href="{{ $socialData->social_tiktok }}" class="btn btn-sm rounded-6 btn-alt-secondary" target="_blank">
                                                    <i class="fab fa-tiktok"></i>
                                                </a>
                                                @endif
                                                @if($socialData->social_telegram)
                                                <a href="{{ $socialData->social_telegram }}" class="btn btn-sm rounded-6 btn-alt-secondary" target="_blank">
                                                    <i class="fab fa-telegram"></i>
                                                </a>
                                                @endif
                                                    @if($socialData->social_whatsapp)
														@php
															// 1. Remove tudo que não for número (parênteses, traços, espaços, +)
															$onlyNumbers = preg_replace('/\D/', '', $socialData->social_whatsapp);

															// 2. Se o número não começar com 55 (Brasil) e tiver tamanho de celular (10 ou 11 dígitos)
															// Adicionamos o 55 automaticamente.
															if (strlen($onlyNumbers) <= 11 && strpos($onlyNumbers, '55') !== 0) {
																$onlyNumbers = '55' . $onlyNumbers;
															}

															// 3. Monta a URL final (wa.me é o padrão oficial e mais curto)
															$whatsappUrl = "https://wa.me/" . $onlyNumbers;
														@endphp

														<a href="{{ $whatsappUrl }}" class="btn btn-sm rounded-6 btn-alt-secondary" target="_blank">
															<i class="fab fa-whatsapp"></i>
														</a>
													@endif
                                                    @if($socialData->social_twitch)
                                                        <a href="{{ $socialData->social_twitch }}" class="btn btn-sm rounded-6 btn-alt-secondary" target="_blank">
                                                            <i class="fab fa-twitch"></i>
                                                        </a>
                                                    @endif
                                                    @if($socialData->social_linkedin)
                                                        <a href="{{ $socialData->social_linkedin }}" class="btn btn-sm rounded-6 btn-alt-secondary" target="_blank">
                                                            <i class="fab fa-linkedin-in"></i>
                                                        </a>
                                                    @endif
                                                    @if($socialData->social_soundcloud)
                                                        <a href="{{ $socialData->social_soundcloud }}" class="btn btn-sm rounded-6 btn-alt-secondary" target="_blank">
                                                            <i class="fab fa-soundcloud"></i>
                                                        </a>
                                                    @endif
                                                    @if($socialData->social_pinterest)
                                                        <a href="{{ $socialData->social_pinterest }}" class="btn btn-sm rounded-6 btn-alt-secondary" target="_blank">
                                                            <i class="fab fa-pinterest"></i>
                                                        </a>
                                                    @endif
                                                    @if($socialData->social_lastfm)
                                                        <a href="{{ $socialData->social_lastfm }}" class="btn btn-sm rounded-6 btn-alt-secondary" target="_blank">
                                                            <i class="fab fa-lastfm"></i>
                                                        </a>
                                                    @endif
                                                    @if($socialData->social_snapchat)
                                                        <a href="{{ $socialData->social_snapchat }}" class="btn btn-sm rounded-6 btn-alt-secondary" target="_blank">
                                                            <i class="fab fa-snapchat"></i>
                                                        </a>
                                                    @endif
                                            </p>
                                        </div>
                                    </div>

                                    <div class="ms-3">
                                        <a href="{{ route('settings.r') }}" class="btn btn-sm btn-alt-secondary mb-3">
                                            <i class="fa fa-gears"></i>
                                            <span class="ms-1">{{ __('general.dash_settings_action') }}</span>
                                        </a>
                                    </div>

                                </div>
                                <div class="col-xl-6 col-md-12 col-sm-12">
                                    @if(count($onAir) == 0 && count($nextAir) == 0)
                                        <div class="d-flex flex-column p-3">
                                            <div class="fs-6 fw-semibold mb-3">{{ __('general.dash_schedule_title') }}</div>
                                            <div class="d-flex py-4 mt-1 mb-1 align-items-center text-muted">
                                                <div class="flex-shrink-0 overlay-container overlay-bottom me-2">
                                                    <i class="fa fa-info-circle fs-1"></i>
                                                </div>
                                                <div class="overflow-hidden">
                                                    <h5 class="mb-0">{{ __('general.dash_schedule_empty') }}</h5>
                                                    <div class="fw-normal me-3">{{ __('general.dash_schedule_empty_desc') }}</div>
                                                </div>
                                            </div>
                                        </div>
                                    @else
                                    <div class="d-flex justify-content-between align-items-center p-3">
                                        @if(count($onAir))
                                            @php
                                                $onairProgram = DB::connection('mysql_site_' . session('serverID'))->table('schedules_programs')->where('id','=',$onAir[0]->program_id)->get()->first();
                                                $onairUser = DB::connection('mysql_site_' . session('serverID'))->table('schedules_users')->where('id','=',(isset($onairProgram->user_id) ? $onairProgram->user_id : 0))->get()->first();
                                            @endphp
                                            <div class="fl50">
                                                <div class="fs-6 fw-semibold mb-3">{{ __('general.dash_schedule_title') }}</div>
                                                <div class="fs-sm fw-bold text-muted">{{ __('general.dash_on_air') }}</div>
                                                <div class="d-flex py-2 align-items-center">
                                                    <div class="flex-shrink-0 overlay-container overlay-bottom me-2" style="border: 1px solid #ccc; border-radius:5px">
                                                        <img class="img-avatar img-avatar-rounded img-avatar48" src="{{ (isset($onairProgram->img) ? 'https://'.$serverData->name.'/contents/'.$siteData->id.'/avatar/'.$onairProgram->img : (isset($onairUser->avatar) ? 'https://'.$serverData->name.'/contents/'.$siteData->id.'/avatar/'.$onairUser->avatar : 'assets/media/avatars/avatar.jpg')) }}" alt="">
                                                    </div>
                                                    <div class="flex-grow-1 overflow-hidden">
                                                        <small class="text-muted">{{ date('H:i',strtotime($onAir[0]->start_time)) }} - {{ date('H:i',strtotime($onAir[0]->end_time)) }}</small>
                                                        <div class="fw-semibold sche-prog me-3">{{ (isset($onairProgram) ? $onairProgram->name : '---') }}</div>
                                                    </div>
                                                </div>
                                            </div>
                                        @endif
                                            @if(count($nextAir))
                                                @php
                                                    $nextairProgram = DB::connection('mysql_site_' . session('serverID'))->table('schedules_programs')->where('id','=',$nextAir[0]->program_id)->get()->first();
                                                    $nextairUser = DB::connection('mysql_site_' . session('serverID'))->table('schedules_users')->where('id','=',(isset($nextairProgram->user_id) ? $nextairProgram->user_id : 0))->get()->first();
                                                @endphp
                                                <div class="mb-0 mt-5 fl50">
                                                    <div class="fs-sm fw-bold text-muted">{{ __('general.dash_next_program') }}</div>
                                                    <div class="d-flex py-2 align-items-center">
                                                        <div class="flex-shrink-0 overlay-container overlay-bottom me-2" style="border: 1px solid #ccc; border-radius:5px">
                                                            <img class="img-avatar img-avatar-rounded img-avatar48" src="{{ (isset($nextairProgram->img) ? 'https://'.$serverData->name.'/contents/'.$siteData->id.'/avatar/'.$nextairProgram->img : (isset($nextairUser->avatar) ? 'https://'.$serverData->name.'/contents/'.$siteData->id.'/avatar/'.$nextairUser->avatar : 'assets/media/avatars/avatar.jpg')) }}" alt="">
                                                        </div>
                                                        <div class="flex-grow-1 overflow-hidden">
                                                            <small class="text-muted">{{ date('H:i',strtotime($nextAir[0]->start_time)) }} - {{ date('H:i',strtotime($nextAir[0]->end_time)) }}</small>
                                                            <div class="fw-semibold sche-prog me-3">{{ (isset($nextairProgram) ? $nextairProgram->name : '---') }}</div>
                                                        </div>
                                                    </div>
                                                </div>
                                            @endif
                                        </div>
                                            @endif
                                    <div class="ms-3">
                                    <a href="{{ route('site.scheduling.r') }}" class="btn btn-sm btn-alt-secondary mb-3 mt-2">
                                        <i class="fa fa-edit"></i>
                                        <span class="ms-1">{{ __('general.dash_schedule_action') }}</span>
                                    </a>
                                    </div>
                                </div>

                            </div>

                        </div>


                    </div>




                    <div class="row">
                        <div class="col-md-6 col-xl-4">
                            <a class="block block-rounded block-link-shadow bg-primary" href="{{ route('site.music-requests.r') }}">
                                <div class="block-content block-content-full d-flex align-items-center justify-content-between">
                                    <div class="ms-1 text-end">
                                        <p class="text-white text-uppercase fw-medium mb-0">
                                           {{ __('general.dash_card_requests') }}
                                        </p>
                                        <p class="text-white-75 mb-0 fs-3 text-start">
                                            {{ $pendReq }}
                                        </p>
                                    </div>
                                    <div>
                                        <i class="fa fa-envelope-open-text fa-3x text-xinspire text-white"></i>
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="col-md-6 col-xl-4">
                            <a class="block block-rounded block-link-shadow bg-info" href="{{ route('site.messages.r') }}">
                                <div class="block-content block-content-full d-flex align-items-center justify-content-between">
                                    <div class="ms-1 text-end">
                                        <p class="text-white text-uppercase fw-medium mb-0">
                                            {{ __('general.dash_card_messages') }}
                                        </p>
                                        <p class="text-white-75 mb-0 fs-3 text-start">
                                            {{ $pendMes }}
                                        </p>
                                    </div>
                                    <div>
                                        <i class="fa fa-list-check fa-3x text-xinspire text-white"></i>
                                    </div>
                                </div>
                            </a>
                        </div>
                        <div class="col-md-6 col-xl-4">
                            <a class="block block-rounded block-link-shadow bg-modern-dark-op" href="{{ route('site.comments.r') }}">
                                <div class="block-content block-content-full d-flex align-items-center justify-content-between">
                                    <div class="ms-1 text-end">
                                        <p class="text-white text-uppercase fw-medium mb-0">
                                            {{ __('general.dash_card_comments') }}
                                        </p>
                                        <p class="text-white-75 mb-0 fs-3 text-start">
                                            {{ $pendCom }}
                                        </p>
                                    </div>
                                    <div>
                                        <i class="fa fa-comments fa-3x text-xinspire text-white"></i>
                                    </div>
                                </div>
                            </a>
                        </div>
                    </div>

                    


                </div>


            <!-- Sidebar -->
                <div class="col-md-6 col-xl-4">
                    <!--div class="block block-rounded">
                        <div class="block-header">
                            <h3 class="block-title hupper"><i class="fa fa-lightbulb"></i> Seu progresso até agora </h3>
                            <div class="block-options">
                                <div class="progress mb-0 justify-content-center" style="width:70px; height: 30px">
                                    <div class="progress-bar me-auto" role="progressbar" style="width: 30%;" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100"></div>
                                    <span class="fs-sm fw-semibold position-absolute text-black pt-1">30%</span>
                                </div>
                            </div>
                        </div>
                        <div class="block-content p-0">


                            <div id="accordion" role="tablist" aria-multiselectable="true">
                                <div class="block block-rounded mb-0">
                                    <a class="block-header block-header-default collapsed" role="tab" id="accordion_h1" data-bs-toggle="collapse" data-bs-parent="#accordion" href="#accordion_q1" aria-expanded="false" aria-controls="accordion_q1">
                                        <b class="fw-semibold">Primeiros passos</b>
                                    </a>
                                    <div id="accordion_q1" class="collapse show" role="tabpanel" aria-labelledby="accordion_h1" data-bs-parent="#accordion" style="">
                                        <div class="block-content p-0">
                                            <table class="table table-borderless table-vcenter mb-0">
                                                <tbody>
                                                <tr>
                                                    <td class="table-primary text-center">
                                                        <i class="fa fa-fw fa-check-circle text-white"></i>
                                                    </td>
                                                    <td colspan="2">
                                                        <b class="fw-medium text-primary">Definir informações da Rádio</b>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td class="table-warning text-center">
                                                        <i class="fa fa-fw fa-clock text-warning"></i>
                                                    </td>
                                                    <td>
                                                        <a class="fw-medium" href="javascript:void(0)">Definir contatos e redes sociais</a>
                                                    </td>
                                                </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                                <div class="block block-rounded mb-1">
                                    <a class="block-header block-header-default collapsed" role="tab" id="accordion_h2" data-bs-toggle="collapse" data-bs-parent="#accordion" href="#accordion_q2" aria-expanded="false" aria-controls="accordion_q2">
                                        <b class="fw-semibold">Definir configurações iniciais</b>
                                    </a>
                                    <div id="accordion_q2" class="collapse" role="tabpanel" aria-labelledby="accordion_h2" data-bs-parent="#accordion" style="">
                                        <div class="block-content">

                                        </div>
                                    </div>
                                </div>
                            </div>






                        </div>
                    </div-->

                    @if($userLogged->type == '1')
                    <div class="block block-rounded">
                        <div class="block-header block-header-default">
                            <h3 class="block-title hupper"><i class="fa fa-id-badge"></i> {{ __('general.page_users_h1') }}</h3>
                            <div class="block-options">
                                <a href="{{ route('users.c') }}" class="btn btn-sm btn-primary"><i class="fa fa-user-plus"></i> {{ __('general.dash_admins_invite') }}</a>
                            </div>
                        </div>
                        <div class="block-content p-0">

                            <div class="d-flex align-items-center flex-grow-1 p-3">
                                <div class="item me-3">
                                    <img class="img-avatar" src="assets/media/avatars/avatar.jpg" alt="">
                                </div>
                                <div class="me-3 overflow-hidden">
                                    <h5 class=" fw-bold mb-0 sche-prog">
                                        {{ $userLogged->name }}
                                    </h5>
                                    <div class="d-inline-block px-2 py-0 rounded-3 fs-xs fw-semibold text-white bg-primary-light">
                                        {{ __('general.role_owner') }}
                                    </div>
                                </div>
                                <div class="ml-auto text-center">
                                    <p class="mb-0 fs-6">{{ DateShort($userLogged->last_login)}}</p>
                                </div>
                            </div>

                            @php
                            foreach($logsData as $log){
								$admin = DB::table('users')->where('id','=',$log->user_id)->get()->first();
                             $userLogData = DB::connection('mysql_site_'.session('serverID'))->table('administrators')
                             ->where('user_id','=',$log->user_id)->where('site_id','=',session('siteID'))->get()->first();
                                if(isset($administrator->active) && isset($admin->last_login)){
                            @endphp
                            <div class="d-flex align-items-center flex-grow-1 p-3">
                                <div class="item me-3">
                                    <img class="img-avatar" src="assets/media/avatars/avatar.jpg" alt="">
                                </div>
                                <div class="me-3 overflow-hidden">
                                    <h5 class=" fw-bold mb-0 sche-prog">
                                        {{ $userLogData->name }}
                                    </h5>
                                    @if($userLogData->active)
                                        <div class="d-inline-block px-2 py-0 rounded-3 fs-xs fw-semibold text-white bg-gray-dark">
                                            {{ __('general.role_admin') }}
                                        </div>
                                    @else
                                        <div class="d-inline-block px-2 py-0 rounded-3 fs-xs fw-semibold text-white bg-gray-dark">
                                            {{ __('general.dash_admins_invited') }}
                                        </div>
                                    @endif
                                </div>
                                <div class="ml-auto text-center">
                                    <p class="mb-0 fs-6">{{ DateShort($userLogData->last_login) }}</p>
                                </div>
                            </div>
                            @php } } @endphp

                        </div>
                        <div class="block-content block-content-full block-content-sm bg-body-light fs-sm text-center">
                            <a class="fw-medium" href="{{ route('users.r') }}">
                                <i class="fa fa-edit ms-1"></i> {{ __('general.dash_admins_manage') }}
                            </a>
                        </div>
                    </div>
                    @endif



                </div>


            </div>






        </div>

</main>





<!--div class="modal fade" id="modal-alert" tabindex="-1" role="dialog" data-bs-backdrop="static" data-bs-keyboard="false">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="block block-rounded block-transparent mb-0">
                <div class="block-header block-header-default bg-warning text-white">
                    <h3 class="block-title hupper"><i class="fa fa-triangle-exclamation me-1"></i> Aviso importante</h3>
                </div>
                <div class="block-content bg-warning text-white">
                    <p class="mb-2">Visando melhorias nos serviços prestados pela BRASCAST, estaremos realizando uma manutenção na plataforma, na madrugada do dia 21/12 iniciando às 00:01h. 
					<br>O intuito da manutenção é implementar melhorias e tem previsão de 2 horas.</p>
                </div>
                <div class="block-content block-content-full text-end bg-warning">
                    <button type="button" class="btn btn-warning" data-bs-dismiss="modal">Entendi</button>
                </div>
            </div>
        </div>
    </div>
</div-->

<div class="modal fade" id="modal-search" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="block block-rounded block-transparent mb-0">
                <div class="block-content mb-0">

                    <div class="alert alert-danger d-flex align-items-center alSea h5 d-none" role="alert">
                        <div class="flex-shrink-0">
                            <i class="fa fa-fw fa-exclamation-triangle"></i>
                        </div>
                        <div class="flex-grow-1 ms-1">
                            <p class="mb-0">
                                {{ __('general.survey_select_option') }}
                            </p>
                        </div>
                    </div>

                    <div class="h4 mb-2">
                        <label class="form-label mb-4 fw-bold">{{ __('general.survey_social_question') }}</label>
                        <div class="space-y-2 fw-normal">
                            <div class="form-check">
                                <input class="form-check-input" type="radio" id="opt_tiktok" name="seaOpt" value="tiktok">
                                <label class="form-check-label align-middle" for="opt_tiktok">Tiktok</label>
                            </div>
                            <div class="form-check">
                                <input class="form-check-input" type="radio" id="opt_instagram" name="seaOpt" value="instagram">
                                <label class="form-check-label align-middle" for="opt_instagram">Instagram</label>
                            </div>
                            <div class="form-check">
                                <input class="form-check-input" type="radio" id="opt_xtwitter" name="seaOpt" value="xtwitter">
                                <label class="form-check-label align-middle" for="opt_xtwitter">X (Twitter)</label>
                            </div>
                            <div class="form-check">
                                <input class="form-check-input" type="radio" id="opt_facebook" name="seaOpt" value="facebook">
                                <label class="form-check-label align-middle" for="opt_facebook">Facebook</label>
                            </div>
                            <div class="form-check">
                                <input class="form-check-input" type="radio" id="opt_other" name="seaOpt" value="outra">
                                <label class="form-check-label align-middle" for="opt_other">{{ __('general.survey_option_other_f') }}</label>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="block-content block-content-full">
                    <button type="button" class="btn btn-primary submSea">{{ __('general.survey_save_close') }}</button>
                </div>
            </div>
        </div>
    </div>
</div>

@if(isset($surveyCategories) && $surveyCategories->count() > 0)
<style>
    #modal-search-cat .modal-content { border: none; border-radius: 15px; box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
    #modal-search-cat .form-select-lg { border-radius: 10px; border: 2px solid #e9ecef; font-size: 1rem; padding: 0.8rem 1rem; cursor: pointer; }
    #modal-search-cat .form-select-lg:focus { border-color: var(--bs-primary, #0d6efd); box-shadow: 0 0 0 0.25 margin-top: rgba(13, 110, 253, 0.25); }
    #modal-search-cat .btn-primary { border-radius: 10px; padding: 0.8rem 2rem; font-weight: 600; }
    #modal-search-cat .form-control-lg:focus { border-color: var(--bs-primary, #0d6efd); box-shadow: none; }
	.icon-survey {  opacity: 0.5;  color: var(--bs-primary, #0d6efd);  }
</style>

<div class="modal fade" id="modal-search-cat" tabindex="-1" role="dialog" data-bs-backdrop="static" data-bs-keyboard="false">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-body p-4 p-md-5">
                
                <div class="text-center mb-4">
                    <div class="mb-3">
                        <i class="fa fa-microphone-alt fa-3x icon-survey"></i>
                    </div>
                    <h3 class="fw-bold mb-2">{{ __('general.survey_type_question') }}</h3>
                    <p class="text-muted">{{ __('general.survey_type_desc') }}</p>
                </div>

                <div class="alert alert-danger d-none alSea mb-3" role="alert">
                    <i class="fa fa-exclamation-circle me-1"></i> <span class="alSeaText"></span>
                </div>

                <div class="mb-4">
                    <select class="form-select form-select-lg" id="seaOptSelect">
                        <option value="" selected disabled>{{ __('general.survey_select_placeholder') }}</option>
                        
                        @foreach($surveyCategories as $cat)
                            @if($cat->id != 0 && $cat->id != 1)
                                <option value="{{ $cat->id }}">{{ $cat->name }}</option>
                            @endif
                        @endforeach

                        <option value="1">{{ __('general.survey_option_other_m') }}</option>
                    </select>

                    <div class="mt-3 d-none" id="div_outros_texto">
                        <label class="form-label fw-bold small text-muted text-uppercase">{{ __('general.survey_type_which') }}</label>
                        <input type="text" class="form-control form-control-lg" id="outros_texto" placeholder="{{ __('general.survey_type_placeholder') }}">
                    </div>
                </div>

                <div class="d-grid">
                    <button type="button" class="btn btn-primary submSea">{{ __('general.survey_confirm_continue') }}</button>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    document.addEventListener("DOMContentLoaded", function() {
        var modalSea = new bootstrap.Modal(document.getElementById("modal-search-cat"), {
            backdrop: 'static',
            keyboard: false
        });
        
        modalSea.show();

        $('#seaOptSelect').on('change', function() {
            $('.alSea').addClass('d-none');
            
            if ($(this).val() === "1") {
                $('#div_outros_texto').hide().removeClass('d-none').fadeIn(300);
                $('#outros_texto').focus();
            } else {
                $('#div_outros_texto').fadeOut(200);
            }
        });

       $('body').on('click', '.submSea', function() {
			let seaval = $("#seaOptSelect").val();
			let textoval = $('#outros_texto').val().trim();
			
			if (!seaval) {
				$('.alSeaText').text('Por favor, escolha uma opção na lista.');
				$('.alSea').removeClass('d-none');
				return;
			} 
			
			if (seaval === "1" && textoval === '') {
				$('.alSeaText').text('Por favor, descreva o tipo da sua rádio.');
				$('.alSea').removeClass('d-none');
				$('#outros_texto').focus();
				return;
			}

			$('.alSea').addClass('d-none');
			$('.alSeaText').text('');
			
			let btn = $(this);
			btn.prop('disabled', true).html('<i class="fa fa-circle-notch fa-spin"></i> Quase lá...');

			$.post("{{ route('homeCatAjax') }}", { 
				_token: "{{ csrf_token() }}",
				sea_opt: seaval,
				sea_text: (seaval === "1" ? textoval : "")
			})
			.done(function(data) {
				modalSea.hide();
			})
			.fail(function() {
				$('.alSeaText').text('Erro ao salvar. Tente novamente.');
				$('.alSea').removeClass('d-none');
				btn.prop('disabled', false).text('Confirmar e Continuar');
			});
		});
    });
</script>
@endif



    @include('includes/footer')

</div>
<script src="/assets/js/lib/jquery.min.js"></script>
<script src="/assets/js/main.min.js"></script>
@if(!$siteData->first_vote)
<script>
    /*var modalSea = new bootstrap.Modal(document.getElementById("modal-search"), {});
    modalSea.show();
    $('body').on('click', '.submSea', function() {
        let seaval = $("input[name='seaOpt']:checked").val();
        if (!seaval) {
            $('.alSea').removeClass('d-none');
        }
        else {
            $('.alSea').addClass('d-none');

            $.post( "{{ route('homeAjax') }}", { sea_opt: seaval })
                .done(function(data) {
                    modalSea.hide();
                }, "json");
        }
    });*/
</script>
@endif
</body>
</html>