/* =============================================================
   QuemLeva – visual "amigável": cantos arredondados, cartões com
   sombra suave, botões em pílula. Paleta Gladius Tech (logo).
   Contraste: texto sobre laranja é azul-marinho; textos auxiliares
   usam cinza escuro (o cinza da logo não passa em texto pequeno).
   ============================================================= */

@font-face {
    font-family: 'Nunito';
    font-style: normal;
    font-weight: 400 900;
    font-display: swap;
    src: url('../fonts/nunito-latin-variable.woff2') format('woff2');
}

:root {
    --ql-dark-blue: #143F70;
    --ql-mid-blue: #0386B9;
    --ql-mid-blue-strong: #02719C; /* azul-médio com contraste AA para texto/botão */
    --ql-light-blue: #77CCF5;
    --ql-orange: #F58F28;
    --ql-orange-text: #C25E00;     /* laranja legível como texto */
    --ql-gray: #999898;
    --ql-muted: #5F6B76;
    --ql-bg: #F2F7FB;
    --ql-sky: #E3F4FD;
    --ql-peach: #FFF1E3;
    --ql-radius: 22px;
    --ql-radius-sm: 16px;
    --ql-shadow: 0 6px 20px rgba(20, 63, 112, .08);

    --bs-primary: var(--ql-dark-blue);
    --bs-primary-rgb: 20, 63, 112;
    --bs-link-color: var(--ql-mid-blue-strong);
    --bs-link-color-rgb: 2, 113, 156;
    --bs-link-hover-color: var(--ql-dark-blue);
    --bs-body-color: var(--ql-dark-blue);
    /* Fundo dos componentes (cartões, campos, listas) fica branco; o da página é definido no body. */
    --bs-body-bg: #fff;
    --bs-body-font-family: 'Nunito', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --bs-border-radius: var(--ql-radius-sm);
    --bs-border-radius-lg: var(--ql-radius);
    --bs-secondary-color: var(--ql-muted);
}

body { font-size: 1rem; font-weight: 500; background: var(--ql-bg); }

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { color: var(--ql-dark-blue); font-weight: 900; letter-spacing: -.01em; }

a { font-weight: 700; }

.text-ql-orange { color: var(--ql-orange-text) !important; }
.text-ql-gray, .text-muted, .form-text { color: var(--ql-muted) !important; }
.text-ql-mid { color: var(--ql-mid-blue-strong) !important; }
.bg-ql-light { background-color: var(--ql-sky) !important; }
.fw-black { font-weight: 900 !important; }

.ql-brand { font-weight: 900; font-size: 1.25rem; color: #fff; letter-spacing: -.01em; }
.ql-brand span { color: var(--ql-orange); }

/* ---------- Navegação ---------- */
.ql-navbar { background-color: var(--ql-dark-blue); }
.ql-navbar .nav-link { font-weight: 700; color: rgba(255, 255, 255, .85); }
.ql-navbar .nav-link:hover, .ql-navbar .nav-link:focus { color: #fff; }

/* Página com herói: a barra e o herói formam um bloco azul só, com base curva. */
.ql-hero {
    background: var(--ql-dark-blue);
    color: #fff;
    border-radius: 0 0 36px 36px;
    position: relative;
    overflow: hidden;
}
.ql-hero h1, .ql-hero h2 { color: #fff; }
.ql-hero .ql-hero-text { color: #D6ECFA; }
.ql-hero-inner { position: relative; padding-top: .75rem; padding-bottom: 2rem; }
.ql-hero.ql-hero-overlap .ql-hero-inner { padding-bottom: 4.5rem; }
.ql-hero-overlap + .ql-overlap { margin-top: -3rem; position: relative; }

.ql-bubble { position: absolute; border-radius: 50%; pointer-events: none; }
.ql-bubble-1 { width: 220px; height: 220px; background: var(--ql-mid-blue); opacity: .45; right: -70px; top: -70px; }
.ql-bubble-2 { width: 96px; height: 96px; background: var(--ql-orange); right: 6%; top: 110px; }
.ql-bubble-3 { width: 42px; height: 42px; background: var(--ql-light-blue); right: calc(6% + 120px); top: 190px; }

.ql-chip {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    background: rgba(255, 255, 255, .1);
    color: #fff;
    padding: .45rem .8rem;
    border-radius: 999px;
    font-size: .85rem;
    font-weight: 700;
}
.ql-chip svg { flex-shrink: 0; }
.ql-chip-code { background: rgba(119, 204, 245, .18); color: #CDEBFB; font-size: .78rem; }

.ql-hero-progress { background: rgba(255, 255, 255, .08); border-radius: 18px; padding: .75rem .9rem; }
.ql-hero-progress .progress { height: 10px; background: rgba(119, 204, 245, .25); }
.ql-hero-progress .progress-bar { background: var(--ql-light-blue); }

/* ---------- Cartões ---------- */
.card { border: 0; border-radius: var(--ql-radius); box-shadow: var(--ql-shadow); }
.card-header { border-radius: var(--ql-radius) var(--ql-radius) 0 0 !important; font-weight: 800; }
.card-header.ql { background: var(--ql-dark-blue); color: #fff; }
.ql-card-elevated { box-shadow: 0 12px 30px rgba(20, 63, 112, .14); }
a.card { transition: transform .12s ease, box-shadow .12s ease; }
a.card:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(20, 63, 112, .12); }

.ql-icon-tile {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: var(--ql-peach);
    color: var(--ql-orange-text);
}
.ql-icon-tile.blue { background: var(--ql-sky); color: var(--ql-mid-blue-strong); }

.ql-date-tile {
    width: 58px;
    height: 62px;
    border-radius: 16px;
    background: var(--ql-sky);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
}
.ql-date-tile .day { font-size: 1.4rem; font-weight: 900; }
.ql-date-tile .month { font-size: .75rem; font-weight: 800; color: var(--ql-mid-blue-strong); text-transform: uppercase; margin-top: 2px; }

.ql-step {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    flex-shrink: 0;
    color: #fff;
}

/* ---------- Botões: pílula; laranja = ação principal (texto azul-marinho) ---------- */
.btn { border-radius: 999px; font-weight: 800; padding: .6rem 1.15rem; }
.btn-sm { padding: .4rem .85rem; font-size: .85rem; }
.btn-lg { padding: .85rem 1.5rem; font-size: 1.1rem; font-weight: 900; }
.btn-link { font-weight: 700; }

.btn-primary, .btn-ql {
    --bs-btn-bg: var(--ql-orange);
    --bs-btn-border-color: var(--ql-orange);
    --bs-btn-color: var(--ql-dark-blue);
    --bs-btn-hover-bg: #F7A04A;
    --bs-btn-hover-border-color: #F7A04A;
    --bs-btn-hover-color: var(--ql-dark-blue);
    --bs-btn-active-bg: #E07E1A;
    --bs-btn-active-border-color: #E07E1A;
    --bs-btn-active-color: var(--ql-dark-blue);
    --bs-btn-disabled-bg: var(--ql-orange);
    --bs-btn-disabled-border-color: var(--ql-orange);
    --bs-btn-disabled-color: var(--ql-dark-blue);
    --bs-btn-focus-shadow-rgb: 245, 143, 40;
}

.btn-secondary {
    --bs-btn-bg: var(--ql-mid-blue-strong);
    --bs-btn-border-color: var(--ql-mid-blue-strong);
    --bs-btn-hover-bg: #025F83;
    --bs-btn-hover-border-color: #025F83;
    --bs-btn-active-bg: #01516F;
    --bs-btn-active-border-color: #01516F;
}

.btn-outline-primary {
    --bs-btn-color: var(--ql-mid-blue-strong);
    --bs-btn-border-color: #B9DFF3;
    --bs-btn-bg: #fff;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--ql-mid-blue-strong);
    --bs-btn-hover-border-color: var(--ql-mid-blue-strong);
    --bs-btn-active-bg: var(--ql-mid-blue-strong);
    --bs-btn-active-border-color: var(--ql-mid-blue-strong);
    border-width: 2px;
}

.btn-light { --bs-btn-bg: var(--ql-sky); --bs-btn-border-color: var(--ql-sky); }

/* Botão flutuante (celular): "Novo evento" */
.ql-fab {
    position: fixed;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    z-index: 1030;
    box-shadow: 0 10px 24px rgba(245, 143, 40, .35);
}
@media (min-width: 768px) { .ql-fab { position: static; box-shadow: none; } }

/* ---------- Formulários ---------- */
.form-control, .form-select {
    border: 2px solid #CFE7F6;
    border-radius: var(--ql-radius-sm);
    padding: .7rem 1rem;
    color: var(--ql-dark-blue);
    font-weight: 600;
}
.form-control-sm { padding: .4rem .75rem; border-radius: 12px; }
.form-control::placeholder { color: #8A96A1; font-weight: 500; }
.form-control:focus, .form-select:focus, .form-check-input:focus {
    border-color: var(--ql-light-blue);
    box-shadow: 0 0 0 .25rem rgba(119, 204, 245, .35);
}
.form-label { font-weight: 800; }
.form-check-input:checked { background-color: var(--ql-mid-blue-strong); border-color: var(--ql-mid-blue-strong); }
.input-group > .form-control { border-radius: var(--ql-radius-sm); }
.input-group > .btn { border-radius: 999px !important; margin-left: .5rem !important; }

.ql-code-input {
    font-size: 1.6rem;
    font-weight: 900;
    letter-spacing: .35em;
    text-align: center;
    text-transform: uppercase;
    border: 2px dashed var(--ql-light-blue);
    background: #F2F9FE;
}
.ql-code-input::placeholder { letter-spacing: .2em; }

/* ---------- Listas e itens ---------- */
.list-group { gap: .6rem; }
.list-group-item {
    border: 0 !important;
    border-radius: 20px !important;
    box-shadow: 0 4px 14px rgba(20, 63, 112, .06);
    padding: .8rem .9rem;
}
.ql-item.selected { background: #fff; }
.ql-item.selected .ql-item-name { color: var(--ql-muted); text-decoration: line-through; }
.ql-item.mine { box-shadow: inset 0 0 0 2px var(--ql-light-blue), 0 4px 14px rgba(20, 63, 112, .06); }

.ql-taken summary { font-weight: 800; color: var(--ql-mid-blue-strong); cursor: pointer; }

.badge { border-radius: 999px; font-weight: 800; padding: .4em .75em; }
.badge-pending { background-color: var(--ql-orange); color: var(--ql-dark-blue); }
.badge-selected { background-color: var(--ql-sky); color: var(--ql-mid-blue-strong); }

.progress { background-color: var(--ql-sky); border-radius: 999px; height: 10px; }
.progress-bar { background-color: var(--ql-mid-blue); border-radius: 999px; }

/* Anel de progresso do painel */
.ql-summary-card { background: var(--ql-dark-blue); color: #fff; border-radius: 26px; }
.ql-summary-card .ql-chip { font-size: .8rem; }
.ql-ring-track { stroke: rgba(119, 204, 245, .25); }
.ql-ring-value { stroke: var(--ql-light-blue); transition: stroke-dasharray .4s ease; }

.ql-stat { font-size: 2rem; font-weight: 900; line-height: 1; }

/* ---------- Alertas ---------- */
.alert { border: 0; border-radius: var(--ql-radius-sm); font-weight: 600; }
.alert-success { background: #E2F6EA; color: #135C33; }
.alert-danger { background: #FDE7E5; color: #8A1C12; }
.alert-info { background: var(--ql-sky); color: var(--ql-dark-blue); }
.alert-warning { background: var(--ql-peach); color: #6B3A00; }

.dropdown-menu { border: 0; border-radius: var(--ql-radius-sm); box-shadow: 0 10px 30px rgba(20, 63, 112, .16); }

/* ---------- Rodapé ---------- */
.ql-footer { background-color: #fff; border-radius: 28px 28px 0 0; }
.ql-footer a { color: var(--ql-mid-blue-strong); }

/* Espaço para o botão flutuante não cobrir o conteúdo no celular */
@media (max-width: 767.98px) { .has-fab { padding-bottom: 5.5rem; } }

/* ---------- Anúncios ---------- */
.ql-ad {
    min-height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px dashed #CFE7F6;
    border-radius: var(--ql-radius);
    color: var(--ql-muted);
    font-size: .8rem;
    background: #fff;
}

/* ---------- Aviso de cookies ---------- */
.ql-cookie {
    position: fixed;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    z-index: 1080;
    max-width: 560px;
    margin: 0 auto;
    background: #fff;
    border-radius: var(--ql-radius);
    padding: .85rem 1rem;
    display: flex;
    gap: .75rem;
    align-items: center;
    justify-content: space-between;
}
.ql-cookie.d-none { display: none !important; }

/* ---------- Resumo para print/imagem ---------- */
.ql-summary { max-width: 480px; background: #fff; }
.ql-summary .section-title { color: #fff; padding: .35rem .75rem; border-radius: 12px; font-weight: 800; }

@media print {
    .ql-navbar, .ql-footer, .ql-ad, .no-print, .ql-fab { display: none !important; }
    body { background: #fff; }
}