/*
 * azcall v2 - camada de compatibilidade (Etapa 3).
 * Restiliza o que as ~150 telas antigas já usam (Bootstrap 3 + Material Dashboard + bootstrap-select +
 * DataTables) com os tokens da Opção C, sem editar o HTML delas. Só vale com <html data-v2>.
 * Regra: nada de cor fixa aqui - tudo via var(--...), para o modo escuro (data-theme) funcionar de graça.
 * As cores "de categoria" do Material (green/orange/rose/blue/black/yellow/red/purple) viram versões suaves
 * (fundo -soft + ícone na cor cheia) em vez de blocos saturados.
 */
html[data-v2] {
    --purple-soft: rgba(123, 75, 196, .14);
    --v2-ring: 0 0 0 3px var(--gold-soft);
}
html[data-v2][data-theme="dark"] { --purple-soft: rgba(123, 75, 196, .22); }

/* ---------- texto e links ---------- */
html[data-v2] body, html[data-v2] .main-panel { color: var(--ink); }
html[data-v2] .main-panel > .content a:not(.btn):not([class*="v2-"]) { color: var(--gold-ink); }
html[data-v2] .main-panel > .content a:not(.btn):not([class*="v2-"]):hover { color: var(--gold); }
html[data-v2] h1, html[data-v2] h2, html[data-v2] h3, html[data-v2] h4, html[data-v2] h5, html[data-v2] h6 { color: var(--ink); }
html[data-v2] .text-muted { color: var(--muted) !important; }
html[data-v2] .text-primary { color: var(--gold-ink) !important; }
html[data-v2] .text-success { color: var(--ok) !important; }
html[data-v2] .text-danger { color: var(--crit) !important; }
html[data-v2] .text-warning { color: var(--warn) !important; }
html[data-v2] .text-info { color: var(--info) !important; }
html[data-v2] hr { border-top-color: var(--line); }

/* ---------- cards ---------- */
html[data-v2] .card {
    background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg);
    box-shadow: var(--shadow); color: var(--ink); margin-top: 0; margin-bottom: var(--gap);
}
html[data-v2] .card .card-content, html[data-v2] .card .card-body { padding: var(--pad); }
html[data-v2] .card .card-footer { border-top: 1px solid var(--line-2); margin: 0 var(--pad); padding: 12px 0; }
html[data-v2] .card .card-title { font-family: var(--f-display); font-weight: 600; font-size: 15px; letter-spacing: -.01em; color: var(--ink); margin: 0; }
html[data-v2] .card .card-category { color: var(--muted); font-size: 12.5px; margin: 0; text-transform: none; }
/* cabeçalho com ícone: ícone vira um chip, em linha com o título (antes flutuava 20px acima do card) */
html[data-v2] .card .card-header.card-header-icon,
html[data-v2] .card .card-header.card-header-text {
    display: flex; align-items: center; gap: 12px; padding: 16px var(--pad) 0; margin: 0; background: transparent; box-shadow: none; text-align: left;
}
html[data-v2] .card .card-header .card-icon {
    float: none; width: 36px; height: 36px; margin: 0; padding: 0; border-radius: 10px; box-shadow: none;
    display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
html[data-v2] .card .card-header .card-icon i, html[data-v2] .card .card-header .card-icon .material-icons { font-size: 20px; width: auto; height: auto; line-height: 1; margin: 0; color: inherit; }
html[data-v2] .card .card-header.card-header-icon .card-title { float: none; margin: 0; }
html[data-v2] .card .card-header.card-header-icon h3.card-title, html[data-v2] .card .card-header.card-header-icon h4.card-title { padding: 0; }
/* cabeçalhos coloridos (blocos saturados) -> suaves */
html[data-v2] .card .card-header[data-background-color]:not(.card-header-icon):not(.card-header-text) {
    border-radius: var(--r-lg) var(--r-lg) 0 0; margin: 0; box-shadow: none; padding: 14px var(--pad); border-bottom: 1px solid var(--line);
}
html[data-v2] .card .card-header[data-background-color]:not(.card-header-icon) .card-title,
html[data-v2] .card .card-header[data-background-color]:not(.card-header-icon) .card-category { color: inherit; }
/* mapa de cores de categoria */
html[data-v2] .card [data-background-color="green"] { background: var(--ok-soft); color: var(--ok); }
html[data-v2] .card [data-background-color="orange"],
html[data-v2] .card [data-background-color="yellow"] { background: var(--warn-soft); color: var(--warn); }
html[data-v2] .card [data-background-color="red"] { background: var(--crit-soft); color: var(--crit); }
html[data-v2] .card [data-background-color="rose"] { background: var(--crit-soft); color: var(--crit); }
html[data-v2] .card [data-background-color="blue"],
html[data-v2] .card [data-background-color="azure"] { background: var(--info-soft); color: var(--info); }
html[data-v2] .card [data-background-color="purple"],
html[data-v2] .card [data-background-color="violet"] { background: var(--purple-soft); color: var(--purple); }
html[data-v2] .card [data-background-color="black"] { background: var(--line-2); color: var(--ink-2); }
html[data-v2] .card [data-background-color="white"] { background: var(--card); color: var(--ink); }
html[data-v2] .card [data-background-color] { box-shadow: none; }
/* cartões de indicador (card-stats) */
html[data-v2] .card-stats .card-header { margin: 0; padding: 16px var(--pad) 0; background: transparent; box-shadow: none; }
html[data-v2] .card-stats .card-icon { float: none; }
html[data-v2] .card-stats .card-category { color: var(--muted); }
html[data-v2] .card-stats .card-title { font-size: 26px; font-weight: 700; }
html[data-v2] .card-stats .card-footer { border-top: 1px solid var(--line-2); }
html[data-v2] .card .stats, html[data-v2] .card .stats .material-icons { color: var(--subtle); }

/* ---------- botões ---------- */
html[data-v2] .btn, html[data-v2] .btn.btn-default {
    border-radius: var(--r-sm); text-transform: none; letter-spacing: 0; font-family: var(--f-body); font-size: 13.5px; font-weight: 500;
    padding: 8px 16px; line-height: 1.3; box-shadow: none; border: 1px solid var(--line); background: var(--card); color: var(--ink);
    transition: background .14s, border-color .14s, opacity .14s;
}
html[data-v2] .btn:hover, html[data-v2] .btn:focus, html[data-v2] .btn:active, html[data-v2] .btn.active,
html[data-v2] .btn.btn-default:hover, html[data-v2] .btn.btn-default:focus { background: var(--hover); color: var(--ink); box-shadow: none; border-color: var(--line); }
html[data-v2] .btn .material-icons, html[data-v2] .btn i.fa { font-size: 17px; vertical-align: -3px; margin-right: 4px; }
html[data-v2] .btn.btn-sm, html[data-v2] .btn.btn-xs { padding: 5px 12px; font-size: 12.5px; }
html[data-v2] .btn.btn-xs { padding: 3px 9px; font-size: 12px; }
html[data-v2] .btn.btn-lg { padding: 11px 22px; font-size: 14.5px; }
html[data-v2] .btn.btn-round { border-radius: 22px; }
html[data-v2] .btn.btn-just-icon { padding: 0; width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; }
html[data-v2] .btn.btn-just-icon .material-icons { margin: 0; }
html[data-v2] .btn.btn-primary { background: var(--gold); border-color: var(--gold); color: #fff; }
html[data-v2] .btn.btn-primary:hover, html[data-v2] .btn.btn-primary:focus, html[data-v2] .btn.btn-primary:active { background: var(--gold-ink); border-color: var(--gold-ink); color: #fff; }
html[data-v2] .btn.btn-success { background: var(--ok); border-color: var(--ok); color: #fff; }
html[data-v2] .btn.btn-danger { background: var(--crit); border-color: var(--crit); color: #fff; }
html[data-v2] .btn.btn-warning { background: var(--warn); border-color: var(--warn); color: #fff; }
html[data-v2] .btn.btn-info { background: var(--info); border-color: var(--info); color: #fff; }
html[data-v2] .btn.btn-rose { background: var(--purple); border-color: var(--purple); color: #fff; }
html[data-v2] .btn.btn-success:hover, html[data-v2] .btn.btn-danger:hover, html[data-v2] .btn.btn-warning:hover,
html[data-v2] .btn.btn-info:hover, html[data-v2] .btn.btn-rose:hover, html[data-v2] .btn.btn-success:focus, html[data-v2] .btn.btn-danger:focus,
html[data-v2] .btn.btn-warning:focus, html[data-v2] .btn.btn-info:focus { filter: brightness(.92); color: #fff; }
html[data-v2] .btn.btn-success:hover { background: var(--ok); } html[data-v2] .btn.btn-danger:hover { background: var(--crit); }
html[data-v2] .btn.btn-warning:hover { background: var(--warn); } html[data-v2] .btn.btn-info:hover { background: var(--info); }
html[data-v2] .btn.btn-secondary, html[data-v2] .btn.btn-white { background: var(--card); color: var(--ink); border-color: var(--line); }
/* "simple" = só texto/contorno */
html[data-v2] .btn.btn-simple, html[data-v2] .btn.btn-outline-info { background: transparent; border-color: transparent; box-shadow: none; }
html[data-v2] .btn.btn-simple:hover { background: var(--hover); }
html[data-v2] .btn.btn-simple.btn-primary { color: var(--gold-ink); } html[data-v2] .btn.btn-simple.btn-success { color: var(--ok); }
html[data-v2] .btn.btn-simple.btn-danger { color: var(--crit); } html[data-v2] .btn.btn-simple.btn-warning { color: var(--warn); }
html[data-v2] .btn.btn-simple.btn-info { color: var(--info); } html[data-v2] .btn.btn-simple.btn-default { color: var(--ink-2); }
html[data-v2] .btn.btn-outline-info { color: var(--info); border-color: var(--info); }
html[data-v2] .btn[disabled], html[data-v2] .btn.disabled { opacity: .5; }
html[data-v2] .btn-group > .btn, html[data-v2] .btn-group-vertical > .btn { border-radius: 0; }
html[data-v2] .btn-group > .btn:first-child { border-radius: var(--r-sm) 0 0 var(--r-sm); }
html[data-v2] .btn-group > .btn:last-child { border-radius: 0 var(--r-sm) var(--r-sm) 0; }
html[data-v2] .btn-group > .btn:only-child { border-radius: var(--r-sm); }

/* ---------- formulários ---------- */
html[data-v2] .form-group { margin: 14px 0 0; padding-bottom: 0; }
html[data-v2] .form-group .form-control, html[data-v2] .form-control, html[data-v2] select.form-control, html[data-v2] textarea.form-control {
    background: var(--card) !important; background-image: none !important; color: var(--ink);
    border: 1px solid var(--line) !important; border-radius: var(--r-sm); box-shadow: none;
    height: 38px; padding: 0 12px; font-size: 13.5px; font-family: var(--f-body);
}
html[data-v2] textarea.form-control { height: auto; min-height: 76px; padding: 9px 12px; }
html[data-v2] .form-control:focus, html[data-v2] .form-group.is-focused .form-control {
    border-color: var(--gold) !important; box-shadow: var(--v2-ring); background-image: none !important; outline: 0;
}
html[data-v2] .form-control::placeholder { color: var(--subtle); }
html[data-v2] .form-control[disabled], html[data-v2] .form-control[readonly] { background: var(--line-2) !important; color: var(--muted); }
html[data-v2] .form-group .material-input:before, html[data-v2] .form-group .material-input:after { display: none !important; }
/* rótulos flutuantes do Material viram rótulo fixo acima do campo */
html[data-v2] .form-group.label-floating .control-label, html[data-v2] .form-group.label-static .control-label,
html[data-v2] .form-group .control-label, html[data-v2] .label-control {
    position: static !important; display: block; transform: none !important; top: auto !important; margin: 0 0 6px;
    font-size: 12.5px !important; font-weight: 500; color: var(--muted) !important; text-transform: none; line-height: 1.3;
}
html[data-v2] .form-group.is-focused .control-label { color: var(--gold-ink) !important; }
html[data-v2] label { font-weight: 500; color: var(--ink-2); }
html[data-v2] .input-group .form-control { border-radius: var(--r-sm) 0 0 var(--r-sm); }
html[data-v2] .input-group-addon { background: var(--line-2); border: 1px solid var(--line); color: var(--muted); border-radius: 0 var(--r-sm) var(--r-sm) 0; }
html[data-v2] .help-block { color: var(--subtle); }
/* radio / checkbox / toggle: roxo do Material -> dourado/verde */
html[data-v2] .radio input[type=radio]:checked ~ .check, html[data-v2] .radio label .check { background-color: var(--gold); }
html[data-v2] .radio input[type=radio]:checked ~ .circle { border-color: var(--gold); }
html[data-v2] .radio .circle { border-color: var(--subtle); }
html[data-v2] .checkbox input[type=checkbox]:checked + .checkbox-material .check { background: var(--gold); border-color: var(--gold); }
html[data-v2] .checkbox .checkbox-material .check { border-color: var(--subtle); }
html[data-v2] .checkbox label, html[data-v2] .radio label { color: var(--ink-2); }
html[data-v2] .togglebutton label input[type=checkbox]:checked + .toggle { background-color: color-mix(in oklab, var(--ok) 55%, transparent); }
html[data-v2] .togglebutton label input[type=checkbox]:checked + .toggle:after { border-color: var(--ok); background-color: var(--ok); left: 15px; }
html[data-v2] .togglebutton label { color: var(--ink-2); }

/* ---------- bootstrap-select (os "selectpicker" que eram pílulas coloridas) ---------- */
html[data-v2] .bootstrap-select > .dropdown-toggle, html[data-v2] .bootstrap-select > .btn,
html[data-v2] .bootstrap-select.btn-group .dropdown-toggle {
    background: var(--card) !important; color: var(--ink) !important; border: 1px solid var(--line) !important; border-radius: var(--r-sm) !important;
    box-shadow: none !important; text-transform: none; height: 38px; padding: 0 12px; font-size: 13.5px; font-weight: 400; margin: 0;
}
html[data-v2] .bootstrap-select > .dropdown-toggle:focus, html[data-v2] .bootstrap-select.open > .dropdown-toggle { border-color: var(--gold) !important; box-shadow: var(--v2-ring) !important; }
html[data-v2] .bootstrap-select .filter-option { color: var(--ink); text-transform: none; }
html[data-v2] .bootstrap-select .caret { color: var(--muted); border-top-color: var(--muted); }
html[data-v2] .bootstrap-select .dropdown-menu { border-radius: var(--r); }
html[data-v2] .bootstrap-select .dropdown-menu li a { color: var(--ink-2); }
html[data-v2] .bootstrap-select .bs-searchbox .form-control { height: 34px; }

/* ---------- tabelas ---------- */
html[data-v2] .table { color: var(--ink); background: transparent; margin-bottom: 0; }
html[data-v2] .table > thead > tr > th {
    font-size: 11.5px; font-weight: 600; color: var(--subtle); text-transform: uppercase; letter-spacing: .05em;
    border-bottom: 1px solid var(--line); border-top: 0; padding: 10px 12px; white-space: nowrap; background: transparent;
}
html[data-v2] .table > tbody > tr > td, html[data-v2] .table > tfoot > tr > td {
    border-top: 0; border-bottom: 1px solid var(--line-2); padding: 11px 12px; color: var(--ink); vertical-align: middle; font-size: 13px;
}
html[data-v2] .table > tbody > tr:last-child > td { border-bottom: 0; }
html[data-v2] .table-striped > tbody > tr:nth-of-type(odd) { background: transparent; }
html[data-v2] .table-hover > tbody > tr:hover, html[data-v2] .table > tbody > tr:hover > td { background: var(--hover); }
html[data-v2] .table-bordered, html[data-v2] .table-bordered > thead > tr > th, html[data-v2] .table-bordered > tbody > tr > td { border-color: var(--line-2); }
html[data-v2] .table-responsive { border: 0; }
html[data-v2] .table > tbody > tr.success > td { background: var(--ok-soft); } html[data-v2] .table > tbody > tr.danger > td { background: var(--crit-soft); }
html[data-v2] .table > tbody > tr.warning > td { background: var(--warn-soft); } html[data-v2] .table > tbody > tr.info > td { background: var(--info-soft); }
/* DataTables / bootstrap-table */
html[data-v2] .dataTables_wrapper .dataTables_filter input, html[data-v2] .dataTables_wrapper .dataTables_length select,
html[data-v2] .fixed-table-toolbar .search input {
    background: var(--card); color: var(--ink); border: 1px solid var(--line); border-radius: var(--r-sm); height: 34px; padding: 0 10px; box-shadow: none;
}
html[data-v2] .dataTables_wrapper .dataTables_info, html[data-v2] .dataTables_wrapper .dataTables_length, html[data-v2] .dataTables_wrapper .dataTables_filter { color: var(--muted); font-size: 12.5px; }
html[data-v2] table.dataTable thead .sorting, html[data-v2] table.dataTable thead .sorting_asc, html[data-v2] table.dataTable thead .sorting_desc { background-color: transparent; }
html[data-v2] .pagination > li > a, html[data-v2] .pagination > li > span, html[data-v2] .pagination > li > a:focus {
    background: var(--card); border: 1px solid var(--line); color: var(--ink-2); border-radius: var(--r-sm); margin: 0 2px; padding: 6px 12px; box-shadow: none;
}
html[data-v2] .pagination > li > a:hover { background: var(--hover); color: var(--ink); }
html[data-v2] .pagination > .active > a, html[data-v2] .pagination > .active > a:hover, html[data-v2] .pagination > .active > span,
html[data-v2] .pagination > .active > a:focus { background: var(--gold); border-color: var(--gold); color: #fff; box-shadow: none; }
html[data-v2] .pagination > .disabled > a { color: var(--subtle); background: var(--line-2); }

/* ---------- abas e pills ---------- */
html[data-v2] .nav-tabs { background: transparent !important; border: 0; border-bottom: 1px solid var(--line); padding: 0; box-shadow: none; border-radius: 0; margin-bottom: 16px; }
html[data-v2] .nav-tabs > li > a {
    background: transparent !important; color: var(--muted) !important; border: 0; border-bottom: 2px solid transparent; border-radius: 0;
    margin: 0 0 -1px; padding: 10px 14px; font-size: 13.5px; font-weight: 500; text-transform: none; box-shadow: none;
}
html[data-v2] .nav-tabs > li > a:hover { color: var(--ink) !important; background: transparent !important; }
html[data-v2] .nav-tabs > li.active > a, html[data-v2] .nav-tabs > li.active > a:hover, html[data-v2] .nav-tabs > li.active > a:focus {
    color: var(--ink) !important; background: transparent !important; border: 0; border-bottom: 2px solid var(--gold);
}
html[data-v2] .nav-tabs .material-icons { font-size: 18px; vertical-align: -4px; margin-right: 4px; }
html[data-v2] .nav-pills { display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 3px; border-radius: var(--r-sm); background: var(--line-2); border: 1px solid var(--line); }
html[data-v2] .nav-pills > li { float: none; margin: 0; }
html[data-v2] .nav-pills > li > a {
    background: transparent; color: var(--muted); border-radius: 6px; padding: 6px 14px; margin: 0; font-size: 12.5px; font-weight: 500; text-transform: none; box-shadow: none; min-width: 0;
}
html[data-v2] .nav-pills > li.active > a, html[data-v2] .nav-pills > li.active > a:hover, html[data-v2] .nav-pills > li.active > a:focus {
    background: var(--card); color: var(--ink); box-shadow: 0 1px 2px rgba(0, 0, 0, .08);
}
html[data-v2] .nav-pills > li > a:hover { color: var(--ink); background: transparent; }
html[data-v2] .nav-pills.nav-stacked { display: flex; flex-direction: column; }

/* ---------- alertas, etiquetas, progresso ---------- */
html[data-v2] .alert { border: 1px solid var(--line); border-radius: var(--r); box-shadow: none; color: var(--ink-2); background: var(--card); }
html[data-v2] .alert.alert-success { background: var(--ok-soft); border-color: transparent; color: var(--ok); }
html[data-v2] .alert.alert-danger { background: var(--crit-soft); border-color: transparent; color: var(--crit); }
html[data-v2] .alert.alert-warning { background: var(--warn-soft); border-color: transparent; color: var(--warn); }
html[data-v2] .alert.alert-info { background: var(--info-soft); border-color: transparent; color: var(--info); }
html[data-v2] .alert.alert-primary { background: var(--gold-soft); border-color: transparent; color: var(--gold-ink); }
html[data-v2] .alert a { color: inherit; text-decoration: underline; }
html[data-v2] .alert i, html[data-v2] .alert .material-icons { color: inherit; }
html[data-v2] .label, html[data-v2] .badge { border-radius: 12px; font-weight: 600; font-size: 11.5px; padding: 3px 9px; text-transform: none; box-shadow: none; }
html[data-v2] .label-default, html[data-v2] .badge { background: var(--line-2); color: var(--muted); }
html[data-v2] .label-primary { background: var(--gold-soft); color: var(--gold-ink); }
html[data-v2] .label-success { background: var(--ok-soft); color: var(--ok); } html[data-v2] .label-danger { background: var(--crit-soft); color: var(--crit); }
html[data-v2] .label-warning { background: var(--warn-soft); color: var(--warn); } html[data-v2] .label-info { background: var(--info-soft); color: var(--info); }
html[data-v2] .progress { background: var(--line-2); box-shadow: none; border-radius: 4px; height: 6px; }
html[data-v2] .progress .progress-bar, html[data-v2] .progress .progress-bar.progress-bar-default { background-color: var(--gold); box-shadow: none; }
html[data-v2] .progress .progress-bar-success { background-color: var(--ok); } html[data-v2] .progress .progress-bar-danger { background-color: var(--crit); }
html[data-v2] .progress .progress-bar-warning { background-color: var(--warn); } html[data-v2] .progress .progress-bar-info { background-color: var(--info); }

/* ---------- modais, menus suspensos, popovers ---------- */
html[data-v2] .modal-content { background: var(--card); color: var(--ink); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-pop); }
html[data-v2] .modal-header { border-bottom: 1px solid var(--line); padding: 16px var(--pad); }
html[data-v2] .modal-header .close { color: var(--muted); opacity: 1; text-shadow: none; }
html[data-v2] .modal-title { font-family: var(--f-display); font-weight: 600; font-size: 16px; color: var(--ink); }
html[data-v2] .modal-body { padding: var(--pad); color: var(--ink); }
html[data-v2] .modal-footer { border-top: 1px solid var(--line); padding: 14px var(--pad); }
html[data-v2] .modal-backdrop.in { background: #0f1114; opacity: .5; }
html[data-v2] .dropdown-menu { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-pop); padding: 6px; }
html[data-v2] .dropdown-menu > li > a, html[data-v2] .dropdown-menu li a { color: var(--ink-2); border-radius: 6px; padding: 8px 12px; font-size: 13px; }
html[data-v2] .dropdown-menu > li > a:hover, html[data-v2] .dropdown-menu li a:hover, html[data-v2] .dropdown-menu li a:focus, html[data-v2] .dropdown-menu li a:active,
html[data-v2] .dropdown-menu > .active > a { background: var(--hover); color: var(--ink); box-shadow: none; }
html[data-v2] .dropdown-menu .divider { background: var(--line); }
html[data-v2] .popover { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-pop); color: var(--ink); }
html[data-v2] .popover-title { background: var(--line-2); border-bottom: 1px solid var(--line); color: var(--ink); }
html[data-v2] .tooltip-inner { background: var(--ink); color: var(--bg); border-radius: 6px; }
html[data-v2] .list-group-item { background: var(--card); border-color: var(--line); color: var(--ink); }
html[data-v2] .panel { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); box-shadow: none; }
html[data-v2] .panel-heading { background: var(--line-2); border-bottom: 1px solid var(--line); color: var(--ink); }
html[data-v2] .well { background: var(--line-2); border: 1px solid var(--line); box-shadow: none; border-radius: var(--r); }

/* ---------- pickers e rodapé ---------- */
html[data-v2] .bootstrap-datetimepicker-widget table td.active > div, html[data-v2] .bootstrap-datetimepicker-widget table td.active:hover > div,
html[data-v2] .bootstrap-datetimepicker-widget table td span.active { background-color: var(--gold); }
html[data-v2] .bootstrap-datetimepicker-widget a[data-action], html[data-v2] .bootstrap-datetimepicker-widget a[data-action]:hover span { color: var(--gold-ink); }
html[data-v2] .daterangepicker { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-pop); color: var(--ink); }
html[data-v2] .daterangepicker td.active, html[data-v2] .daterangepicker td.active:hover, html[data-v2] .daterangepicker .ranges li.active { background-color: var(--gold); color: #fff; }
html[data-v2] .daterangepicker .calendar-table { background: var(--card); border-color: var(--card); }
html[data-v2] .daterangepicker td.in-range { background: var(--gold-soft); color: var(--ink); }
html[data-v2] .daterangepicker td.off, html[data-v2] .daterangepicker td.off.in-range { background: var(--card); color: var(--subtle); }
html[data-v2] .main-panel > .footer, html[data-v2] footer.footer { border-top: 1px solid var(--line); background: transparent; color: var(--subtle); }
html[data-v2] .noUi-connect { background: var(--gold); } html[data-v2] .noUi-horizontal .noUi-handle { border-color: var(--gold); }
html[data-v2] .loader, html[data-v2] .loaderCDR { border-top-color: var(--gold); }

/* o modo escuro antigo pinta o .card-header-icon inteiro (bloco cinza atrás do ícone); no v2 só o chip do ícone tem fundo */
html[data-v2] .card .card-header.card-header-icon,
html[data-v2] .card .card-header.card-header-text,
html[data-v2][data-theme="dark"] .card .card-header.card-header-icon,
html[data-v2][data-theme="dark"] .card .card-header.card-header-text { background: transparent !important; box-shadow: none !important; }

/* ---------- SweetAlert (swal/swal2: 70+ telas usam para confirmações e avisos) ---------- */
html[data-v2] .swal2-popup, html[data-v2] .sweet-alert { background: var(--card); color: var(--ink); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-pop); font-family: var(--f-body); }
html[data-v2] .swal2-title, html[data-v2] .sweet-alert h2 { font-family: var(--f-display); font-weight: 600; font-size: 20px; color: var(--ink); text-transform: none; }
html[data-v2] .swal2-content, html[data-v2] .swal2-html-container, html[data-v2] .sweet-alert p { color: var(--ink-2); font-size: 14px; }
html[data-v2] .swal2-container.swal2-shown, html[data-v2] .sweet-overlay { background: rgba(15, 17, 20, .5) !important; }
html[data-v2] .swal2-popup .swal2-styled, html[data-v2] .swal2-actions .btn { border-radius: var(--r-sm); font-size: 13.5px; font-weight: 500; text-transform: none; box-shadow: none; padding: 9px 18px; }
html[data-v2] .swal2-popup .swal2-input, html[data-v2] .swal2-popup .swal2-textarea, html[data-v2] .swal2-popup .swal2-select { background: var(--card); color: var(--ink); border: 1px solid var(--line); border-radius: var(--r-sm); box-shadow: none; }
html[data-v2] .swal2-popup .swal2-validation-message { background: var(--crit-soft); color: var(--crit); }

/* ---------- select2 ---------- */
html[data-v2] .select2-container--default .select2-selection--single, html[data-v2] .select2-container--default .select2-selection--multiple {
    background: var(--card); border: 1px solid var(--line); border-radius: var(--r-sm); min-height: 38px; color: var(--ink);
}
html[data-v2] .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--ink); line-height: 36px; }
html[data-v2] .select2-container--default .select2-selection--single .select2-selection__arrow { height: 36px; }
html[data-v2] .select2-dropdown { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-pop); color: var(--ink); }
html[data-v2] .select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--gold-soft); color: var(--gold-ink); }
html[data-v2] .select2-container--default .select2-results__option[aria-selected=true] { background: var(--line-2); }
html[data-v2] .select2-container--default .select2-selection--multiple .select2-selection__choice { background: var(--gold-soft); border: 0; color: var(--gold-ink); border-radius: 12px; }

/* ---------- growl / notify (avisos no canto) ---------- */
html[data-v2] #growls .growl, html[data-v2] .alert[data-notify] { border-radius: var(--r); box-shadow: var(--shadow-pop); }

/* ---------- select do bootstrap-select: texto com respiro e seta à direita ---------- */
html[data-v2] .bootstrap-select > .dropdown-toggle { padding: 0 32px 0 12px !important; text-align: left; position: relative; }
html[data-v2] .bootstrap-select > .dropdown-toggle .filter-option { padding: 0; line-height: 36px; }
html[data-v2] .bootstrap-select > .dropdown-toggle .caret, html[data-v2] .bootstrap-select > .dropdown-toggle .bs-caret { position: absolute; right: 12px; top: 50%; margin-top: -2px; }
/* alertas com ícone do Material: sem a sombra e o ícone flutuante */
html[data-v2] .alert.alert-with-icon { box-shadow: none; padding: 12px 16px 12px 48px; text-align: left; position: relative; }
html[data-v2] .alert.alert-with-icon > [data-notify="icon"] { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: auto; height: auto; background: transparent; box-shadow: none; font-size: 22px; margin: 0; color: inherit; }
html[data-v2] .alert.alert-with-icon > [data-notify="message"] { display: block; padding: 0; text-align: left; }

/* ---------- DataTables (paginação própria .paginate_button, rodapé repetido) ---------- */
html[data-v2] .dataTables_wrapper .dataTables_paginate { display: flex; gap: 4px; justify-content: flex-end; flex-wrap: wrap; padding-top: 10px; }
html[data-v2] .dataTables_wrapper .dataTables_paginate .paginate_button {
    display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 34px; padding: 0 12px; margin: 0; border: 1px solid var(--line) !important;
    border-radius: var(--r-sm); background: var(--card) !important; color: var(--ink-2) !important; font-size: 12.5px; font-weight: 500; text-transform: none; box-shadow: none; cursor: pointer;
}
html[data-v2] .dataTables_wrapper .dataTables_paginate .paginate_button:hover { background: var(--hover) !important; color: var(--ink) !important; }
html[data-v2] .dataTables_wrapper .dataTables_paginate .paginate_button.current, html[data-v2] .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover { background: var(--gold) !important; border-color: var(--gold) !important; color: #fff !important; }
html[data-v2] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled { opacity: .45; cursor: default; }
html[data-v2] .dataTables_wrapper table.dataTable tfoot { display: none; }
html[data-v2] .dataTables_wrapper .dataTables_length select { width: auto; display: inline-block; margin: 0 6px; }
html[data-v2] .dataTables_wrapper .dataTables_filter input { margin-left: 0; }