/* ==========================================================================
   Lojafy — paleta aplicada aos componentes de terceiros.
   Bootstrap, smoke.js, loading do ironbug e Tempus Dominus trazem o azul
   de fábrica (#0d6efd / #0dcaf0 / #4db2ff) compilado no CSS deles; aqui tudo
   passa a usar os tokens do lojafy.css. Carregado depois dele no bundle.
   ========================================================================== */

:root {
    --bs-primary-rgb: 201, 67, 31;
    --bs-primary-text-emphasis: var(--accent-texto);
    --bs-primary-bg-subtle: var(--accent-tint);
    --bs-primary-border-subtle: #F2BFA9;

    /* "info" não existe na marca: vira o neutro (tinta sobre papel). */
    --bs-info: var(--ink);
    --bs-info-rgb: 29, 25, 22;
    --bs-info-text-emphasis: var(--ink);
    --bs-info-bg-subtle: var(--paper);
    --bs-info-border-subtle: var(--line);

    --bs-success: var(--success);
    --bs-success-rgb: 34, 104, 63;
    --bs-success-text-emphasis: var(--success);
    --bs-success-bg-subtle: var(--success-tint);
    --bs-success-border-subtle: #B9DEC5;

    --bs-warning: var(--warning);
    --bs-warning-rgb: 138, 90, 18;
    --bs-warning-text-emphasis: var(--warning);
    --bs-warning-bg-subtle: var(--warning-tint);
    --bs-warning-border-subtle: #EED3A3;

    --bs-danger: var(--danger);
    --bs-danger-rgb: 163, 38, 28;
    --bs-danger-text-emphasis: var(--danger);
    --bs-danger-bg-subtle: var(--danger-tint);
    --bs-danger-border-subtle: #EDB8B1;

    --bs-link-color-rgb: 168, 55, 26;
    --bs-link-hover-color-rgb: 29, 25, 22;
    --bs-focus-ring-color: rgba(201, 67, 31, .3);
    --bs-highlight-bg: var(--warning-tint);

    /* Controles nativos (checkbox, radio, range, progress) sem classe do Bootstrap. */
    accent-color: var(--accent-forte);
}

::selection {
    background: var(--accent-tint);
    color: var(--ink);
}

/* ======================= Checkbox, radio e switch ========================= */
.form-check-input {
    border-color: var(--input-border);
}

.form-check-input:checked,
.form-check-input[type="checkbox"]:indeterminate {
    background-color: var(--accent-forte);
    border-color: var(--accent-forte);
}

.form-check-input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color);
}

/* O botão do switch em foco vem com um SVG azul embutido. */
.form-switch .form-check-input:focus:not(:checked) {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23E5562E'/%3e%3c/svg%3e");
}

.form-check-label {
    cursor: pointer;
}

/* ======================= Range e progress ================================= */
.form-range:focus::-webkit-slider-thumb { box-shadow: 0 0 0 1px var(--app-bg), 0 0 0 .25rem var(--bs-focus-ring-color); }
.form-range:focus::-moz-range-thumb { box-shadow: 0 0 0 1px var(--app-bg), 0 0 0 .25rem var(--bs-focus-ring-color); }
.form-range::-webkit-slider-thumb { background-color: var(--accent-forte); }
.form-range::-webkit-slider-thumb:active { background-color: var(--accent-tint); }
.form-range::-moz-range-thumb { background-color: var(--accent-forte); }
.form-range::-moz-range-thumb:active { background-color: var(--accent-tint); }

.progress,
.progress-stacked {
    --bs-progress-bg: var(--line-soft);
    --bs-progress-bar-bg: var(--accent-forte);
}

/* ======================= Botões =========================================== */
.btn {
    --bs-btn-focus-box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color);
}

.btn-primary {
    --bs-btn-bg: var(--accent-forte);
    --bs-btn-border-color: var(--accent-forte);
    --bs-btn-hover-bg: var(--accent-texto);
    --bs-btn-hover-border-color: var(--accent-texto);
    --bs-btn-active-bg: var(--accent-texto);
    --bs-btn-active-border-color: var(--accent-texto);
    --bs-btn-disabled-bg: var(--accent-forte);
    --bs-btn-disabled-border-color: var(--accent-forte);
    --bs-btn-focus-shadow-rgb: 201, 67, 31;
}

.btn-outline-primary {
    --bs-btn-color: var(--accent-texto);
    --bs-btn-border-color: var(--accent-forte);
    --bs-btn-hover-bg: var(--accent-forte);
    --bs-btn-hover-border-color: var(--accent-forte);
    --bs-btn-active-bg: var(--accent-texto);
    --bs-btn-active-border-color: var(--accent-texto);
    --bs-btn-disabled-color: var(--accent-texto);
    --bs-btn-disabled-border-color: var(--accent-forte);
    --bs-btn-focus-shadow-rgb: 201, 67, 31;
}

/* "info" (usado pelo smoke e pelo uploader do ironbug) vira o botão neutro de tinta. */
.btn-info {
    --bs-btn-color: var(--paper);
    --bs-btn-bg: var(--ink);
    --bs-btn-border-color: var(--ink);
    --bs-btn-hover-color: var(--paper);
    --bs-btn-hover-bg: var(--text-2);
    --bs-btn-hover-border-color: var(--text-2);
    --bs-btn-active-color: var(--paper);
    --bs-btn-active-bg: var(--text-2);
    --bs-btn-active-border-color: var(--text-2);
    --bs-btn-focus-shadow-rgb: 29, 25, 22;
}

.btn-outline-info {
    --bs-btn-color: var(--ink);
    --bs-btn-border-color: var(--ink);
    --bs-btn-hover-color: var(--paper);
    --bs-btn-hover-bg: var(--ink);
    --bs-btn-hover-border-color: var(--ink);
    --bs-btn-active-color: var(--paper);
    --bs-btn-active-bg: var(--ink);
    --bs-btn-active-border-color: var(--ink);
    --bs-btn-disabled-color: var(--ink);
    --bs-btn-disabled-border-color: var(--ink);
    --bs-btn-focus-shadow-rgb: 29, 25, 22;
}

.btn-link {
    --bs-btn-color: var(--accent-texto);
    --bs-btn-hover-color: var(--ink);
    --bs-btn-active-color: var(--ink);
}

.btn-close:focus {
    box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color);
}

/* ======================= Navegação e listas =============================== */
.dropdown-menu {
    --bs-dropdown-link-active-bg: var(--accent-tint);
    --bs-dropdown-link-active-color: var(--ink);
    --bs-dropdown-link-hover-bg: var(--paper);
    --bs-dropdown-border-color: var(--line);
    --bs-dropdown-font-size: 1rem;
    --bs-dropdown-item-padding-y: .55rem;
}

.nav-pills {
    --bs-nav-pills-link-active-bg: var(--ink);
    --bs-nav-pills-link-active-color: var(--paper);
}

.nav {
    --bs-nav-link-color: var(--text-2);
    --bs-nav-link-hover-color: var(--ink);
}

.nav-tabs {
    --bs-nav-tabs-link-active-color: var(--ink);
    --bs-nav-tabs-border-color: var(--line);
}

.list-group {
    --bs-list-group-active-bg: var(--accent-tint);
    --bs-list-group-active-color: var(--ink);
    --bs-list-group-active-border-color: var(--accent);
    --bs-list-group-action-hover-bg: var(--paper);
}

.table {
    --bs-table-striped-bg: var(--surface-2);
    --bs-table-hover-bg: var(--paper);
    --bs-table-active-bg: var(--accent-tint);
}

.form-control::placeholder {
    color: var(--subtle);
}

.spinner-border,
.spinner-grow {
    color: var(--accent);
}

/* ======================= smoke.js (avisos e confirmações) ================= */
.smk-alert-content .alert {
    border-radius: var(--r-tile);
    font-size: 1.05rem;
    line-height: 1.45;
}

.smk-confirm-back {
    background: rgba(29, 25, 22, .55);
}

/* De fábrica a pergunta fica colada no topo e nas bordas do celular. */
.smk-confirm.card {
    margin-top: 18vh;
    width: calc(100% - 32px);
    background: var(--surface);
    color: var(--text);
    border: 1px solid var(--line);
    border-radius: var(--r-card);
    font-family: var(--font-sans);
    font-size: 1.15rem;
    line-height: 1.5;
    padding: .5rem;
}

.smk-confirm:focus {
    box-shadow: 0 16px 40px rgba(29, 25, 22, .3);
}

.smk-confirm .text-end {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .75rem;
    padding: 0 1rem 1rem;
}

/* O smoke usa btn-sm: pequeno demais para quem tem dificuldade de toque e visão. */
.smk-confirm .btn.btn-sm {
    min-height: 48px;
    min-width: 120px;
    padding: .6rem 1.25rem;
    font-size: 1.05rem;
    font-weight: 600;
    border-radius: var(--r-btn);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* ======================= Tempus Dominus (calendário do ng-date) =========== */
.tempus-dominus-widget {
    --td-light: var(--surface);
    --td-widget-background: var(--surface);
    --td-font-color: var(--text);
    --td-active-bg: var(--accent-forte);
    --td-active-color: #fff;
    --td-active-border-color: var(--surface);
    --td-range-bg: var(--accent-tint);
    --td-btn-hover-bg: var(--paper);
    --td-disabled-color: var(--subtle);
    --td-alternate-color: var(--subtle);
    --td-secondary-border-color: var(--line);
    --td-secondary-border-color-rgba: rgba(29, 25, 22, .12);
    --td-primary-border-color: var(--surface);
    --td-dow-color: var(--muted);
    --td-border-radius: var(--r-sm);
    font-family: var(--font-sans);
    font-size: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--r-tile);
    box-shadow: 0 12px 32px rgba(29, 25, 22, .16);
    padding: .5rem;
}

/* Alvos maiores: os dias padrão têm ~32px, difíceis para quem tem pouca firmeza na mão. */
.tempus-dominus-widget .date-container-days div:not(.no-highlight),
.tempus-dominus-widget .date-container-days .dow {
    height: 40px;
    line-height: 40px;
}

.tempus-dominus-widget .date-container-days .dow {
    font-family: var(--font-mono);
    font-size: .8rem;
    text-transform: uppercase;
}

.tempus-dominus-widget .calendar-header {
    font-weight: 700;
    color: var(--ink);
}

/* Dia de hoje: marca discreta no laranja da marca em vez do triângulo azul. */
.tempus-dominus-widget .date-container-days div.today::before {
    border-bottom-color: var(--accent);
    border-top-color: rgba(229, 86, 46, .2);
}

.tempus-dominus-widget .date-container-days div.active.today::before {
    border-bottom-color: #fff;
}

.tempus-dominus-widget .toolbar div {
    border-radius: var(--r-sm);
}

/* Ícones Material Symbols por ligadura: a classe só carrega a fonte, o nome vem do ::before. */
.tempus-dominus-widget .material-symbols-outlined::before {
    font-family: "Material Symbols Outlined";
    font-size: 24px;
    line-height: 1;
}
.tempus-dominus-widget .td-prev::before { content: "chevron_left"; }
.tempus-dominus-widget .td-next::before { content: "chevron_right"; }
.tempus-dominus-widget .td-today::before { content: "today"; }
.tempus-dominus-widget .td-clear::before { content: "backspace"; }
.tempus-dominus-widget .td-close::before { content: "check"; }