/* ============================================================
   assets/css/ios.css — visual "iOS" do sistema inteiro
   Carregado por último no <head> de todas as telas, então
   sobrescreve o Bootstrap e o <style> de cada página.
   - Fonte Poppins
   - Superfícies de vidro (blur), cantos arredondados contínuos
   - Botões em pílula, campos preenchidos, switches estilo iPhone
   - Modais com o fundo desfocado (vidro)
   ============================================================ */

:root {
    --ios-bg:          #f2f2f7;
    --ios-card:        #ffffff;
    --ios-fill:        rgba(118,118,128,.12);
    --ios-fill-2:      rgba(118,118,128,.20);
    --ios-separador:   rgba(60,60,67,.12);
    --ios-texto-2:     rgba(60,60,67,.62);
    --ios-vidro:       rgba(255,255,255,.72);
    --ios-vidro-borda: rgba(255,255,255,.65);
    --ios-blur:        saturate(180%) blur(24px);
    --ios-verde:       #34c759;
    --ios-vermelho:    #ff3b30;
    --ios-laranja:     #ff9500;
    --ios-amarelo:     #ffcc00;
    --ios-azul:        #007aff;
    /* Cantos arredondados do sistema inteiro (sempre os mesmos 3 tamanhos):
       grande  → barras laterais, cartões, modais
       médio   → itens de menu, linhas de lista, avisos, sanfonas
       pequeno → botões, campos, ícones */
    --raio-g:          24px;
    --raio-m:          14px;
    --raio-p:          12px;
    --ios-raio:        var(--raio-g);
    --ios-raio-sm:     var(--raio-m);
    --ios-sombra:      0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.05);
    --ios-mola:        cubic-bezier(.32,.72,0,1);

    --bs-body-font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --bs-border-radius:    var(--raio-p);
    --bs-border-radius-sm: 10px;
    --bs-border-radius-lg: var(--raio-m);
    --bs-border-radius-xl: var(--raio-g);
    --bs-border-color:     var(--ios-separador);
    --bs-success:          #34c759;
    --bs-danger:           #ff3b30;
    --bs-warning:          #ff9500;
}

/* ── Base ───────────────────────────────────────────────── */
html { background-color: var(--ios-bg); }

body {
    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    background: var(--ios-bg);
    color: #1c1c1e;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: -.005em;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.btn, .form-control, .form-select, .badge, .nav-link, .modal-title, .table,
input, textarea, select, button {
    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-weight: 600; letter-spacing: -.02em; }

.text-muted { color: var(--ios-texto-2) !important; }
a { -webkit-tap-highlight-color: transparent; }
::selection { background: color-mix(in srgb, var(--cor-p, #1a3a5c) 22%, transparent); }

/* ── Cartões ────────────────────────────────────────────── */
.card {
    border: none;
    border-radius: var(--ios-raio);
    box-shadow: var(--ios-sombra);
    background: var(--ios-card);
}
.card-header {
    background: transparent;
    border-bottom: 1px solid var(--ios-separador);
    border-radius: var(--ios-raio) var(--ios-raio) 0 0 !important;
    padding: 1rem 1.25rem;
    font-weight: 600;
}
.card-footer {
    background: transparent;
    border-top: 1px solid var(--ios-separador);
    border-radius: 0 0 var(--ios-raio) var(--ios-raio) !important;
}
.stat-card, .freq-card { border-radius: var(--ios-raio) !important; }

/* ── Botões ─────────────────────────────────────────────── */
.btn {
    border-radius: var(--raio-p);
    font-weight: 500;
    padding-left: 1.1rem;
    padding-right: 1.1rem;
    transition: transform .25s var(--ios-mola), background-color .2s, opacity .2s, box-shadow .2s;
}
.btn-sm { padding-left: .8rem; padding-right: .8rem; }
.btn:active, .btn-primario:active, .btn-secundario:active, .btn-download:active { transform: scale(.96); }
.btn:focus-visible { box-shadow: 0 0 0 4px color-mix(in srgb, var(--cor-p, #1a3a5c) 22%, transparent); }

.btn-primary {
    --bs-btn-bg: var(--cor-p, #1a3a5c);
    --bs-btn-border-color: var(--cor-p, #1a3a5c);
    --bs-btn-hover-bg: color-mix(in srgb, var(--cor-p, #1a3a5c) 88%, #000);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-bg: color-mix(in srgb, var(--cor-p, #1a3a5c) 80%, #000);
    --bs-btn-active-border-color: transparent;
}
.btn-success {
    --bs-btn-bg: var(--ios-verde); --bs-btn-border-color: var(--ios-verde);
    --bs-btn-hover-bg: #2fb350; --bs-btn-hover-border-color: #2fb350;
    --bs-btn-active-bg: #29a147; --bs-btn-active-border-color: #29a147;
}
.btn-danger {
    --bs-btn-bg: var(--ios-vermelho); --bs-btn-border-color: var(--ios-vermelho);
    --bs-btn-hover-bg: #e6352b; --bs-btn-hover-border-color: #e6352b;
    --bs-btn-active-bg: #cc2f26; --bs-btn-active-border-color: #cc2f26;
}
.btn-warning {
    --bs-btn-bg: var(--ios-laranja); --bs-btn-border-color: var(--ios-laranja); --bs-btn-color: #fff;
    --bs-btn-hover-bg: #e68600; --bs-btn-hover-border-color: #e68600; --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: #cc7700; --bs-btn-active-border-color: #cc7700; --bs-btn-active-color: #fff;
}
/* Botão "cinza" do iOS: fundo translúcido, sem borda */
.btn-secondary, .btn-light {
    --bs-btn-bg: var(--ios-fill); --bs-btn-border-color: transparent; --bs-btn-color: #1c1c1e;
    --bs-btn-hover-bg: var(--ios-fill-2); --bs-btn-hover-border-color: transparent; --bs-btn-hover-color: #1c1c1e;
    --bs-btn-active-bg: var(--ios-fill-2); --bs-btn-active-border-color: transparent; --bs-btn-active-color: #1c1c1e;
}
/* Botões "outline" viram botões tonais (fundo clarinho da própria cor) */
[class*="btn-outline-"] { border-color: transparent !important; }
.btn-outline-primary   { --bs-btn-color: var(--cor-p, #1a3a5c); --bs-btn-bg: color-mix(in srgb, var(--cor-p, #1a3a5c) 10%, transparent); --bs-btn-hover-bg: var(--cor-p, #1a3a5c); --bs-btn-hover-color: #fff; --bs-btn-active-bg: var(--cor-p, #1a3a5c); }
.btn-outline-secondary { --bs-btn-color: #3a3a3c; --bs-btn-bg: var(--ios-fill); --bs-btn-hover-bg: var(--ios-fill-2); --bs-btn-hover-color: #1c1c1e; --bs-btn-active-bg: var(--ios-fill-2); --bs-btn-active-color: #1c1c1e; }
.btn-outline-success   { --bs-btn-color: #248a3d; --bs-btn-bg: rgba(52,199,89,.13); --bs-btn-hover-bg: var(--ios-verde); --bs-btn-hover-color: #fff; --bs-btn-active-bg: var(--ios-verde); }
.btn-outline-danger    { --bs-btn-color: #d70015; --bs-btn-bg: rgba(255,59,48,.11); --bs-btn-hover-bg: var(--ios-vermelho); --bs-btn-hover-color: #fff; --bs-btn-active-bg: var(--ios-vermelho); }
.btn-outline-warning   { --bs-btn-color: #c93400; --bs-btn-bg: rgba(255,149,0,.14); --bs-btn-hover-bg: var(--ios-laranja); --bs-btn-hover-color: #fff; --bs-btn-active-bg: var(--ios-laranja); }
.btn-outline-info      { --bs-btn-color: #0071a4; --bs-btn-bg: rgba(90,200,250,.18); --bs-btn-hover-bg: #32ade6; --bs-btn-hover-color: #fff; --bs-btn-active-bg: #32ade6; }
.btn-outline-dark      { --bs-btn-color: #1c1c1e; --bs-btn-bg: var(--ios-fill); --bs-btn-hover-bg: #1c1c1e; --bs-btn-hover-color: #fff; --bs-btn-active-bg: #1c1c1e; }
.btn-outline-light     { --bs-btn-color: #fff; --bs-btn-bg: rgba(255,255,255,.16); --bs-btn-hover-bg: rgba(255,255,255,.28); --bs-btn-hover-color: #fff; }
.btn-link { border-radius: var(--raio-p); text-decoration: none; }

/* Botões próprios do sistema */
.btn-primario, .btn-secundario { border-radius: var(--raio-p) !important; font-weight: 600; }
.btn-primario:hover { transform: none; }
.btn-secundario { border: none !important; background: color-mix(in srgb, var(--cor-p, #1a3a5c) 10%, transparent); padding: .5rem 1.25rem !important; }
.btn-download { border-radius: var(--raio-p) !important; }

/* ── Campos de formulário (preenchidos, sem borda) ──────── */
.form-control, .form-select {
    background-color: var(--ios-fill);
    border: 1px solid transparent;
    border-radius: var(--raio-p);
    padding: .6rem .9rem;
    color: #1c1c1e;
    transition: background-color .2s, box-shadow .2s, border-color .2s;
}
.form-control::placeholder { color: rgba(60,60,67,.45); }
.form-control:focus, .form-select:focus {
    background-color: #fff;
    border-color: color-mix(in srgb, var(--cor-p, #1a3a5c) 45%, transparent);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--cor-p, #1a3a5c) 14%, transparent);
}
.form-control:disabled, .form-control[readonly], .form-select:disabled { background-color: rgba(118,118,128,.08); color: var(--ios-texto-2); }
.form-control-sm, .form-select-sm { border-radius: 10px; padding: .4rem .7rem; }
.form-control-color { padding: .25rem; }
.form-label { font-weight: 500; font-size: .85rem; color: #3a3a3c; margin-bottom: .35rem; }
.input-group-text { background: var(--ios-fill); border: none; border-radius: var(--raio-p); color: var(--ios-texto-2); }
.input-group > .form-control, .input-group > .form-select { border-radius: var(--raio-p); }

/* Checkbox redondinho e switch estilo iPhone */
.form-check-input { border-color: rgba(60,60,67,.3); }
.form-check-input:checked { background-color: var(--cor-p, #1a3a5c); border-color: var(--cor-p, #1a3a5c); }
.form-check-input:focus { box-shadow: 0 0 0 4px color-mix(in srgb, var(--cor-p, #1a3a5c) 16%, transparent); border-color: rgba(60,60,67,.3); }
.form-check-input[type=checkbox] { border-radius: 6px; }
.form-switch .form-check-input {
    width: 2.6em; height: 1.55em; margin-top: 0;
    border: none; border-radius: 2em;
    background-color: rgba(120,120,128,.24);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3.4' fill='%23fff'/%3e%3c/svg%3e");
    background-position: left center;
    filter: drop-shadow(0 1px 1px rgba(0,0,0,.08));
    transition: background-position .3s var(--ios-mola), background-color .25s;
    cursor: pointer;
}
.form-switch .form-check-input:focus {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3.4' fill='%23fff'/%3e%3c/svg%3e");
}
.form-switch .form-check-input:checked { background-color: var(--ios-verde); background-position: right center; }
.form-switch { padding-left: 3.2em; }
.form-switch .form-check-input { margin-left: -3.2em; }
.form-switch .form-check-label { padding-top: .1em; }

/* ── Tabelas (lista agrupada) ───────────────────────────── */
.table { --bs-table-border-color: var(--ios-separador); --bs-table-hover-bg: rgba(118,118,128,.06); --bs-table-striped-bg: rgba(118,118,128,.04); }
.table > :not(caption) > * > * { padding: .75rem .9rem; }
.table th, .table thead th {
    font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em;
    color: var(--ios-texto-2); border-top: none;
}
.table-light, .table > thead.table-light { --bs-table-bg: rgba(118,118,128,.06); }
.table-responsive { border-radius: var(--ios-raio-sm); }

/* ── Badges, alertas, listas, paginação ─────────────────── */
.badge { border-radius: 8px; font-weight: 600; padding: .38em .7em; letter-spacing: 0; }
.bg-success { background-color: var(--ios-verde) !important; }
.bg-danger  { background-color: var(--ios-vermelho) !important; }
.bg-warning { background-color: var(--ios-amarelo) !important; }

.alert {
    border: none; border-radius: var(--ios-raio-sm);
    padding: .9rem 1.1rem;
}
.alert-success { background: rgba(52,199,89,.13);  color: #1e6b34; }
.alert-danger  { background: rgba(255,59,48,.11);  color: #b4170e; }
.alert-warning { background: rgba(255,204,0,.18);  color: #7a5200; }
.alert-info    { background: rgba(0,122,255,.10);  color: #0a4fa3; }
.alert-secondary, .alert-light { background: var(--ios-fill); color: #3a3a3c; }

.list-group { border-radius: var(--ios-raio-sm); }
.list-group-item { border-color: var(--ios-separador); }

.pagination { gap: .3rem; }
.page-link { border: none; border-radius: var(--raio-p) !important; background: var(--ios-fill); color: #1c1c1e; }
.page-item.active .page-link { background: var(--cor-p, #1a3a5c); }

.progress { border-radius: 999px; background: var(--ios-fill); }
.progress-bar { border-radius: 999px; }

/* Abas do Bootstrap em formato de "segmented control" */
.nav-tabs { border-bottom: none; gap: .25rem; background: var(--ios-fill); border-radius: var(--raio-m); padding: 3px; display: inline-flex; flex-wrap: wrap; }
.nav-tabs .nav-link { border: none !important; border-radius: 9px; color: #3a3a3c; font-weight: 500; padding: .4rem .9rem; }
.nav-tabs .nav-link.active { background: #fff; color: #1c1c1e; box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 1px rgba(0,0,0,.04); }
.nav-pills .nav-link { border-radius: var(--raio-p); }
.nav-pills .nav-link.active { background: var(--cor-p, #1a3a5c); }

/* Accordion */
.accordion { --bs-accordion-border-color: var(--ios-separador); --bs-accordion-border-radius: var(--ios-raio-sm); --bs-accordion-inner-border-radius: var(--ios-raio-sm); --bs-accordion-active-bg: rgba(118,118,128,.06); --bs-accordion-active-color: #1c1c1e; --bs-accordion-btn-focus-box-shadow: none; }

/* Menus suspensos e toasts em vidro */
.dropdown-menu {
    border: 1px solid var(--ios-vidro-borda);
    border-radius: var(--raio-m);
    padding: .35rem;
    background: rgba(255,255,255,.8);
    -webkit-backdrop-filter: var(--ios-blur);
    backdrop-filter: var(--ios-blur);
    box-shadow: 0 10px 40px rgba(0,0,0,.14);
}
.dropdown-item { border-radius: var(--raio-p); padding: .5rem .8rem; }
.toast { border-radius: var(--raio-m); border: 1px solid var(--ios-vidro-borda); background: rgba(255,255,255,.8); -webkit-backdrop-filter: var(--ios-blur); backdrop-filter: var(--ios-blur); }

/* ── MODAIS: fundo desfocado (vidro) + cartão de vidro ──── */
.modal-backdrop {
    --bs-backdrop-bg: rgba(10,14,22,.28);
    --bs-backdrop-opacity: 1;
    background-color: rgba(10,14,22,.28);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    backdrop-filter: blur(14px) saturate(140%);
}
.modal-backdrop.fade { transition: opacity .3s ease; }

/* Modal aberto direto pelo PHP (sem o backdrop do Bootstrap) */
.modal.show.d-block,
.overlay-mobile {
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    backdrop-filter: blur(14px) saturate(140%);
}

.modal-content {
    border: 1px solid var(--ios-vidro-borda);
    border-radius: var(--raio-g);
    background: rgba(255,255,255,.86);
    -webkit-backdrop-filter: saturate(180%) blur(30px);
    backdrop-filter: saturate(180%) blur(30px);
    box-shadow: 0 24px 70px rgba(0,0,0,.22), 0 2px 8px rgba(0,0,0,.06);
    overflow: hidden;
}
.modal-header { border-bottom: none; padding: 1.25rem 1.5rem .5rem; }
.modal-body   { padding: .75rem 1.5rem 1rem; }
.modal-footer { border-top: none; padding: .5rem 1.5rem 1.25rem; gap: .5rem; }
.modal-footer > * { margin: 0; }
.modal-title  { font-weight: 600; font-size: 1.1rem; }
/* Cabeçalhos coloridos (bg-*) dentro do modal mantêm a cor, mas arredondados */
.modal-header[class*="bg-"] { border-radius: 0; padding-bottom: 1rem; }

/* Botão fechar redondinho */
.btn-close {
    width: 30px; height: 30px; padding: 0; opacity: 1;
    border-radius: 50%;
    background: var(--ios-fill) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%233c3c43'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/11px auto no-repeat;
    transition: background-color .2s, transform .25s var(--ios-mola);
}
.btn-close:hover { background-color: var(--ios-fill-2); opacity: 1; }
.alert-dismissible { padding-right: 3.25rem; }
.alert-dismissible .btn-close { padding: 0; top: 50%; right: .75rem; margin-top: -15px; }
.btn-close:active { transform: scale(.9); }
.btn-close-white { filter: none; background-color: rgba(255,255,255,.2); background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e"); }

/* Animação de entrada com "mola", subindo de baixo como no iPhone */
.modal.fade .modal-dialog {
    transform: translateY(48px) scale(.97);
    transition: transform .5s var(--ios-mola), opacity .3s ease;
    opacity: 0;
}
.modal.show .modal-dialog { transform: none; opacity: 1; }
.modal.modal-static .modal-dialog { transform: scale(1.02); }

/* Modal de vídeo continua preto */
.modal-content.bg-black { background: #000 !important; border: none; -webkit-backdrop-filter: none; backdrop-filter: none; }

@media (max-width: 575.98px) {
    .modal-dialog { margin: .75rem; }
}

/* Navegadores sem backdrop-filter: escurece um pouco mais o fundo */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .modal-backdrop { background-color: rgba(10,14,22,.5); }
    .modal-content  { background: #fff; }
}

/* ── Barras com vidro (navbars genéricas) ───────────────── */
.navbar.fixed-top, .navbar.sticky-top {
    -webkit-backdrop-filter: var(--ios-blur);
    backdrop-filter: var(--ios-blur);
}

/* Barra de rolagem discreta */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: rgba(60,60,67,.22); border-radius: 8px; border: 2px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-track { background: transparent; }

@media (prefers-reduced-motion: reduce) {
    .modal.fade .modal-dialog, .btn, .form-switch .form-check-input { transition: none; }
}

/* Utilitários de canto do Bootstrap seguem a mesma escala */
.rounded    { border-radius: var(--raio-p) !important; }
.rounded-3  { border-radius: var(--raio-m) !important; }
.rounded-4, .rounded-5 { border-radius: var(--raio-g) !important; }
.img-thumbnail { border-radius: var(--raio-m); }