/* KiSOC V2 — presentation only. Loaded after the legacy styles.
 * Keep IDs, visibility states, routes, plugin hooks and semantic status colors.
 * Reference: TELAS-KiSOC.pdf, pp. 2, 41, 70, 133, 154, 173, 177.
 */
:root {
  --v2-yellow: #FFD102;
  --v2-yellow-hover: #e8bd00;
  --v2-yellow-soft: #fff8c5;
  --v2-ink: #303334;
  --v2-muted: #62696c;
  --v2-background: #f4f4f4;
  --v2-surface: #fff;
  --v2-line: #e3e5e6;
  --v2-focus: #146675;
  --v2-radius: 6px;
  --v2-header: 72px;
  --v2-sidebar: 208px;
}
html body {
  font-family: "Century Gothic", "Avenir Next", Avenir, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: var(--v2-ink);
  background-color: var(--v2-background);
  -webkit-font-smoothing: antialiased;
}
html h1, html h2, html h3, html h4, html h5, html h6 {
  color: var(--v2-ink);
  font-weight: 650;
  line-height: 1.3;
}
html :is(button, input, select, textarea) { font-family: inherit; }
html :is(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--v2-focus) !important;
  outline-offset: 3px;
}
html input:is([type="checkbox"], [type="radio"]) { accent-color: #7c6800; }
html :is(button, .btn, select):disabled { cursor: not-allowed; }
/* Shared shell: the existing collapse controls and permission-filtered links remain. */
html #wrapper > .sidebar {
  background: var(--v2-surface) !important;
  width: var(--v2-sidebar) !important;
  flex: 0 0 var(--v2-sidebar);
  padding-top: var(--v2-header) !important;
  min-height: 100vh;
  border-right: 1px solid var(--v2-line);
  box-shadow: 5px 0 24px #00000006;
}
html .sidebar .sidebar-brand {
  position: fixed;
  inset: 0 auto auto 0;
  width: var(--v2-sidebar);
  height: var(--v2-header);
  background: var(--v2-yellow);
  color: #17191a !important;
  z-index: 1031;
  justify-content: flex-start !important;
  padding: 0 22px;
  letter-spacing: .02em;
}
html .sidebar .sidebar-brand-icon { font-size: 22px; transform: none; }
html .sidebar .sidebar-brand-text { font-size: 19px; margin-left: 12px !important; }
html .sidebar #accordionSidebar { width: 100%; padding: 18px 10px; }
html .sidebar .nav-item { margin: 2px 0; }
html .sidebar .nav-item .nav-link {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: var(--v2-radius);
  color: var(--v2-ink) !important;
  text-align: left;
  font-weight: 500;
}
html .sidebar .nav-item .nav-link span { font-size: 12px; line-height: 1.35; }
html .sidebar .nav-item .nav-link i {
  width: 22px;
  margin: 0;
  flex-shrink: 0;
  text-align: center;
  color: #505758 !important;
  font-size: 17px;
}
html .sidebar .nav-item .nav-link:hover { background: #f5f5ef; }
html .sidebar .nav-item .nav-link.active {
  background: var(--v2-yellow-soft);
  color: #252820 !important;
  box-shadow: inset 3px 0 var(--v2-yellow);
  font-weight: 700;
}
html .sidebar .sidebar-divider { border-color: var(--v2-line); }
html .sidebar #sidebarToggle {
  background: #f1f2f2 !important;
  width: 36px;
  height: 36px;
}
html .sidebar #sidebarToggle::after { color: #45494a; }
html #wrapper > .sidebar.toggled { width: 80px !important; flex-basis: 80px; }
html .sidebar.toggled .sidebar-brand { width: 80px; justify-content: center !important; padding: 0; }
html .sidebar.toggled #accordionSidebar { padding-inline: 6px; }
html .sidebar.toggled .nav-item .nav-link { flex-direction: column; gap: 5px; padding: 10px 3px; }
html .sidebar.toggled .nav-item .nav-link span { font-size: 10px; overflow-wrap: anywhere; }
html #wrapper #content-wrapper { background: var(--v2-background); min-width: 0; width: 100%; }
html body > #wrapper > #content-wrapper { padding-top: calc(var(--v2-header) + 28px); }
html .topbar.navbar {
  position: fixed;
  top: 0;
  left: var(--v2-sidebar);
  right: 0;
  height: var(--v2-header);
  margin: 0 !important;
  padding: 0 24px;
  background: var(--v2-yellow) !important;
  box-shadow: none !important;
  border: 0;
  z-index: 1030;
}
html body:has(.sidebar.toggled) .topbar { left: 80px; }
html .topbar > .container-fluid { padding: 0; width: auto; min-width: 0; }
html .topbar > .container-fluid:first-child { flex: 1; }
html .topbar h3 { margin: 0 !important; font-size: 20px; }
html .topbar .nav-link { color: var(--v2-ink) !important; }
html .topbar .text-gray-600 { color: var(--v2-ink) !important; }
html .topbar :is(#idiomab, #tenants) {
  border: 1px solid #b89c16;
  background-color: var(--v2-yellow);
  color: #292a22;
  padding: 7px 8px;
  border-radius: 4px;
  min-height: 36px;
  font-size: 12px;
  margin: 4px;
}
html #content > .container-fluid { padding-right: 28px; padding-left: 28px; }
/* Surfaces do not move on hover: prevents forms and tables jumping under the pointer. */
html .card {
  border: 1px solid var(--v2-line);
  border-radius: var(--v2-radius);
  box-shadow: 0 2px 5px #00000003 !important;
}
html .card:hover { transform: none; box-shadow: 0 2px 5px #00000003 !important; }
html .card > .card-body {
  display: block;
  height: auto;
  padding: 24px;
  text-align: left;
}
html .card > .card-header {
  background: #fff;
  border-bottom: 1px solid var(--v2-line);
  padding: 18px 24px;
}
html .card:not(.bg-primary):not(.bg-success):not(.bg-warning):not(.bg-info):not(.bg-danger):not(.bg-dark) :is(.card-title, .card-text) { color: var(--v2-ink); }
html .card .card-body > :is(table, .table-responsive, form) { width: 100%; }
/* Native forms and legacy Bootstrap/FileInput/DataTables controls. */
html :is(.form-control, .form-select, select.form-control-user, .custom-select) {
  min-height: 40px;
  height: auto;
  border: 1px solid #b9bec0;
  border-radius: 4px;
  background-color: #fafafa;
  color: var(--v2-ink);
  font-size: 13px;
  padding: 9px 12px;
  box-shadow: none;
}
html :is(.form-control, .form-select, .custom-select):focus {
  background-color: #fff;
  border-color: var(--v2-focus);
  box-shadow: 0 0 0 3px #1466751a;
}
html .form-control::placeholder { color: #73797b; opacity: 1; }
html .form-control:disabled, html .form-control[readonly] { background: #eceeef; }
html label { font-size: 13px; color: var(--v2-ink); margin-bottom: 6px; }
html .form-group { margin-bottom: 18px; }
html .input-group-text { background: #f4f4f4; border-color: #b9bec0; color: var(--v2-ink); font-size: 13px; }
html .btn {
  border-radius: 4px;
  padding: 9px 16px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  box-shadow: none;
  transition: background-color .15s ease, border-color .15s ease;
}
html .btn-primary, html .btn-primary.text-white {
  background: var(--v2-yellow) !important;
  border-color: var(--v2-yellow) !important;
  color: #242620 !important;
}
html .btn-primary:is(:hover, :focus, :active) { background: var(--v2-yellow-hover) !important; border-color: var(--v2-yellow-hover) !important; }
html .btn-secondary, html .btn-default { background: #fff; color: var(--v2-ink); border: 1px solid #b9bec0; }
html .btn-secondary:hover, html .btn-default:hover { background: #f1f2f2; }
html .btn-sm { padding: 6px 10px; font-size: 12px; }
html .btn i + span { margin-left: 7px; }
html .nav-pills .nav-link { color: var(--v2-muted); border-radius: 4px; padding: 10px 14px; }
html .nav-pills .nav-link.active, html .nav-tabs .nav-link.active { background: var(--v2-yellow-soft); color: var(--v2-ink); border-color: transparent; font-weight: 700; }
/* Do not recolor row status indicators or alter click/sort/filter behavior. */
html .table-responsive { border: 1px solid var(--v2-line); border-radius: 4px; -webkit-overflow-scrolling: touch; }
html .table { font-size: 12px; margin-bottom: 0; }
html .table th { color: #444a4b; font-size: 11px; font-weight: 700; background: #f7f8f8; white-space: nowrap; }
html .table :is(th, td) { padding: 12px 14px; vertical-align: middle; border-top: 1px solid #eceeef; }
html .table thead th { border-bottom: 1px solid #d9dddf; }
html .table tbody tr[onclick] { cursor: pointer; }
html .table tbody tr[onclick]:hover { background-color: #fffbed; }
html .table :is(#dadosRules, #habitacoes, #auditoria_table) td { white-space: normal; overflow-wrap: anywhere; }
html #dadosRules { font-size: 12px !important; }
html :is(.dataTables_filter, .dt-search) input { padding: 8px 12px; border: 1px solid #b9bec0 !important; border-radius: 4px !important; background: #fafafa !important; }
html :is(.dataTables_info, .dt-info, .dataTables_length, .dt-length) { font-size: 12px; color: var(--v2-muted); padding-block: 10px; }
html .page-item.active .page-link, html .dt-paging .current { background: var(--v2-yellow-soft) !important; border-color: var(--v2-yellow) !important; color: #303334 !important; }
html .page-link { color: #444a4b; }
html :is(.dataTables_empty, .dt-empty) { padding: 48px 16px !important; color: var(--v2-muted); }
/* Dialog presentation only: existing visibility, dismissal and save handlers own state. */
html .modal-content { border: 1px solid var(--v2-line); border-radius: 6px; box-shadow: 0 16px 64px #00000026; }
html .modal-header { padding: 20px 24px; border-bottom: 1px solid var(--v2-line); }
html .modal-title { font-size: 18px; }
html .modal-body { padding: 24px; }
html .modal-footer { padding: 16px 24px; border-top: 1px solid var(--v2-line); gap: 8px; }
html .modal-body .form-row { row-gap: 8px; }
html div#fundo:not(.modal) { border: 0 !important; background: #30333455; }
html div#overlay:not(.modal-dialog) {
  background: #fff;
  border: 1px solid var(--v2-line);
  border-radius: 6px;
  padding: 24px;
  box-shadow: 0 16px 64px #00000026;
  overflow: auto;
  text-align: left;
}
html .alert { border-radius: 4px; font-size: 13px; }
html .alert-success { background: #e8f5ec; border-color: #5d9572; color: #215f38; }
html .alert-danger { background: #fceced; border-color: #cf8d94; color: #922e3b; }
html .alert-warning { background: #fff7e3; border-color: #d4bb77; color: #755519; }
html .alert-info { background: #eaf4f5; border-color: #87b5b9; color: #245e65; }
html footer.sticky-footer { margin-top: 28px; background: #111 !important; color: #fff; padding: 18px 20px; }
html footer.sticky-footer .copyright { font-size: 11px; line-height: 1.5; }
html .scroll-to-top { background: #333; width: 36px; height: 36px; line-height: 36px; }
/* Independent authentication pages use the same brand palette. */
html:is([data-kisoc-view="login"], [data-kisoc-view="recover"], [data-kisoc-view="register"]) body {
  background: linear-gradient(var(--v2-yellow) 0 72px, var(--v2-background) 72px) !important;
  color: var(--v2-ink) !important;
  min-height: 100vh;
}
html:is([data-kisoc-view="login"], [data-kisoc-view="recover"], [data-kisoc-view="register"]) body > .container { padding-top: 80px; padding-bottom: 32px; }
html:is([data-kisoc-view="login"], [data-kisoc-view="recover"], [data-kisoc-view="register"]) .card { border: 1px solid var(--v2-line) !important; box-shadow: 0 12px 40px #00000008 !important; }
html:is([data-kisoc-view="login"], [data-kisoc-view="recover"], [data-kisoc-view="register"]) .bg-login-image { background-position: center; background-color: #fffdf0; min-height: 380px; }
html form.user .form-control-user { border-radius: 4px; font-size: 13px; padding: 14px 12px; }
html form.user .btn-user { border-radius: 4px; font-size: 14px; padding: 12px; }
html[data-kisoc-view="login"] #idiomab { min-height: 36px; border: 1px solid #b9bec0; border-radius: 4px; background: #fff; color: #303334; }
html[data-kisoc-view="login"] [data-i18n="login_recover"] { cursor: pointer; font-size: 12px; }
/* Scheduling, profiles and public registration retain their current step flow. */
html .contact-clean { background: transparent; padding: 24px 0; }
html .contact-clean form { background: #fff; border-radius: 6px; border: 1px solid var(--v2-line); box-shadow: none; }
html[data-kisoc-view="lgpd"] #content { background: #fff; border-top: 6px solid var(--v2-yellow); margin-block: 32px !important; line-height: 1.8; }
html[data-kisoc-view="dashboardv3"] :is(.rounded-xl, .rounded-lg) { border-radius: 6px; }
html[data-kisoc-view="dashboardv3"] .shadow-sm { box-shadow: 0 2px 5px #00000003; }
html[data-kisoc-view="dashboardv3"] :is(input, select) { border-radius: 4px; }
/* Video and biometric coordinates are intentionally left to the existing CSS. */
html:is([data-kisoc-view^="capturafotos-"], [data-kisoc-view="enroll1-preregistro"]) #header { background-color: var(--v2-yellow) !important; color: #303334; }
@media (max-width: 991px) {
  html .topbar { padding-inline: 16px; }
  html .topbar h3 { font-size: 16px; }
  html #content > .container-fluid { padding-inline: 16px; }
  html .card > .card-body { padding: 16px; }
  html .topbar #tenants { max-width: 150px; }
}
@media (max-width: 767px) {
  :root { --v2-sidebar: 80px; --v2-header: 64px; }
  html .sidebar .sidebar-brand { padding: 0; justify-content: center !important; }
  html .sidebar .sidebar-brand-text { display: none; }
  html .sidebar #accordionSidebar { padding-inline: 6px; }
  html .sidebar .nav-item .nav-link { flex-direction: column; gap: 5px; padding: 10px 3px; }
  html .sidebar .nav-item .nav-link span { font-size: 10px; overflow-wrap: anywhere; }
  html #wrapper > .sidebar.toggled { width: 0 !important; flex-basis: 0; padding: 0 !important; overflow: hidden; border: 0; }
  html .sidebar.toggled .sidebar-brand { display: none !important; }
  html body:has(.sidebar.toggled) .topbar { left: 0; }
  html .topbar { padding-inline: 10px; }
  html .topbar h3 { font-size: 14px; overflow-wrap: anywhere; }
  html .topbar #idiomab { width: 72px !important; margin: 0; font-size: 11px; }
  html .topbar #tenants { max-width: 110px; }
  html .topbar .nav-link { padding-inline: 6px; }
  html #content > .container-fluid { padding-inline: 12px; }
  html body > #wrapper > #content-wrapper { padding-top: calc(var(--v2-header) + 16px); }
  html .card > .card-body { padding: 12px; }
  html .table :is(th, td) { padding: 10px; }
  html .modal-dialog { margin: 12px; }
  html .modal-body, html .modal-header, html .modal-footer { padding: 16px; }
  html div#overlay:not(.modal-dialog) { left: 4%; top: 5%; width: 92%; height: 90%; padding: 16px; }
  html .contact-clean { padding: 12px 0; }
  html .contact-clean form { padding: 20px; }
  html:is([data-kisoc-view="login"], [data-kisoc-view="recover"], [data-kisoc-view="register"]) .p-5 { padding: 32px 24px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html .btn, html .card { transition: none; }
}
@media print {
  html .sidebar, html .topbar, html .scroll-to-top { display: none !important; }
  html body > #wrapper > #content-wrapper { padding-top: 0; }
  html #content > .container-fluid { padding: 0; }
  html .card { box-shadow: none !important; }
  html .table-responsive { overflow: visible; }
}
/* Compatibility with legacy inline background-color: black !important.
   Paint the primary surface without rewriting generated buttons or handlers. */
html .btn-primary { background-image: linear-gradient(var(--v2-yellow), var(--v2-yellow)) !important; }
html .btn-primary:is(:hover, :focus, :active) { background-image: linear-gradient(var(--v2-yellow-hover), var(--v2-yellow-hover)) !important; }
html .form-control { box-shadow: none !important; }
html .form-control:focus { box-shadow: 0 0 0 3px #1466751a !important; }
html .table { color: var(--v2-ink); }
html .card-body > table:not(.table) td { vertical-align: middle; }
html .card-body > table:not(.table) td + td { padding-left: 12px; }
html #wrapper > .sidebar { position: sticky; top: 0; max-height: 100vh; overflow-y: auto; scrollbar-width: thin; }
html #content #wrapper > #content-wrapper { min-height: calc(100vh - var(--v2-header) - 28px); }
@media (max-width: 767px) {
  html .table-responsive > table.table { min-width: 640px; }
  html .table :is(#dadosRules, #habitacoes, #auditoria_table) td { overflow-wrap: normal; }
  html .card-body > table:not(.table):has(#myInputSearch) > tbody > tr { display: flex; flex-wrap: wrap; gap: 10px; }
  html .card-body > table:not(.table):has(#myInputSearch) > tbody > tr > td { width: 100% !important; padding: 0; }
  html .card-body > table:not(.table):has(#myInputSearch) .btn { width: 100%; }
  html #content #wrapper > #content-wrapper { min-height: calc(100vh - var(--v2-header) - 16px); }
}
/* Some legacy wrappers also carry .table; only the actual table needs a minimum width. */
html div.table-responsive { min-width: 0; width: 100%; max-width: 100%; }
html[data-kisoc-view="login"] .text-center > div:has(> #idiomab) {
  position: fixed !important;
  top: 16px !important;
  left: auto !important;
  right: 24px;
  z-index: 2;
}
html:is([data-kisoc-view="login"], [data-kisoc-view="recover"], [data-kisoc-view="register"]) body::before {
  content: "KiSOC";
  position: absolute;
  top: 19px;
  left: 28px;
  font-size: 24px;
  font-weight: 800;
  color: #242620;
}
html .contact-clean form .form-control { border-radius: 4px !important; }
html .contact-clean form .nav-pills .nav-link:not(.active) { color: #62696c !important; }
html .contact-clean form { padding: 24px !important; }
html .contact-clean :is(input.form-control, select) { border-radius: 4px !important; }
html .contact-clean .text-truncate:has(.nav-pills) { overflow-x: auto; text-overflow: clip; padding-bottom: 4px; }
html .card-body button:not(.btn):not(.close):not(.dt-paging-button) {
  background-color: #fff;
  border: 1px solid #b9bec0;
  border-radius: 4px;
  padding: 8px 12px;
  color: var(--v2-ink);
  font-size: 13px;
}
@media (max-width: 767px) {
  html .contact-clean form { padding: 16px !important; }
}
html :is(.form-control, .form-select) { margin-bottom: 0; border-radius: 4px !important; }
html .form-select, html .input-group-text { box-shadow: none !important; }
html .input-group-text { border-radius: 4px !important; }
/* Scope by element: the face enrollment canvas also has an ID named overlay. */
html div#fundo:not(.modal) {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 0;
  z-index: 1040;
}
html div#overlay:not(.modal-dialog) {
  position: fixed;
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  transform: translate(-50%, -50%);
  width: min(760px, calc(100% - 32px));
  height: auto;
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  z-index: 1050;
}
html .btn-primaryKISOC { background: var(--v2-yellow) !important; border-color: var(--v2-yellow); color: #242620 !important; }
html .btn:is(#cancelar, [data-dismiss="modal"], [data-bs-dismiss="modal"]),
html .btn:has([data-i18n="cancel_button"]) {
  background: #fff !important;
  background-image: none !important;
  border-color: #b9bec0 !important;
  color: var(--v2-ink) !important;
}
html[data-kisoc-view^="multivisits-"] .demo-wrap,
html[data-kisoc-view="eventschedule-isocmadrid"] .demo-wrap {
  margin: 0 28px 28px;
  padding: 24px;
  background: #fff;
  border: 1px solid var(--v2-line);
  border-radius: 6px;
}
html[data-kisoc-view^="multivisits-"] #header,
html[data-kisoc-view="eventschedule-isocmadrid"] #header {
  background: #fff !important;
  border-bottom: 1px solid var(--v2-line);
  margin-bottom: 20px;
  justify-content: flex-start !important;
}
html[data-kisoc-view^="multivisits-"] #dadosGerais {
  background: #fafafa !important;
  border: 1px solid var(--v2-line);
  border-radius: 4px;
  padding: 16px;
}
html[data-kisoc-view^="multivisits-"] .form-group > label { text-align: left; justify-content: flex-start; }
html[data-kisoc-view^="multivisits-"] input.form-control:focus { border-radius: 4px !important; }
@media (max-width: 767px) {
  html[data-kisoc-view^="multivisits-"] .demo-wrap,
  html[data-kisoc-view="eventschedule-isocmadrid"] .demo-wrap { margin: 0 12px 16px; padding: 12px; }
  html[data-kisoc-view^="multivisits-"] #dadosGerais { padding: 8px; }
  html[data-kisoc-view^="multivisits-"] .form-group > .form-control { width: 100%; min-width: 0; }
  html[data-kisoc-view^="multivisits-"] .form-group > label { flex-basis: 100%; max-width: 100%; padding-inline: 0; }
}
@media (max-width: 767px) {
  html #acessos { display: block; width: 100%; max-width: 100%; overflow-x: auto; }
  html #leitor { left: auto !important; right: 16px; max-width: calc(100% - 32px); }
  html body:has(#leitor) div:has(> .bi-printer) { left: auto !important; right: 16px; }
  html body:has(#leitor) .bi-printer { width: 44px; height: 44px; }
}

/* Visit list: match the compact operations board shown in the product reference. */
html[data-kisoc-view="visitlist"] {
  --visitlist-sidebar: 60px;
  --visitlist-header: 52px;
  --visitlist-border: #e6e6e6;
  --visitlist-text: #3f4243;
  --visitlist-muted: #737778;
  background: #f3f3f3;
}
html[data-kisoc-view="visitlist"] body {
  background: #f3f3f3;
  color: var(--visitlist-text);
}
html[data-kisoc-view="visitlist"] #wrapper > .sidebar {
  width: var(--visitlist-sidebar) !important;
  flex-basis: var(--visitlist-sidebar);
  padding-top: var(--visitlist-header) !important;
  box-shadow: 5px 0 18px #00000012;
}
html[data-kisoc-view="visitlist"] .sidebar .sidebar-brand {
  width: var(--visitlist-sidebar);
  height: var(--visitlist-header);
  padding: 0;
  justify-content: center !important;
}
html[data-kisoc-view="visitlist"] .sidebar .sidebar-brand-icon { font-size: 18px; flex-basis: auto; }
html[data-kisoc-view="visitlist"] .sidebar .sidebar-brand-text,
html[data-kisoc-view="visitlist"] .sidebar #sidebarToggle,
html[data-kisoc-view="visitlist"] .sidebar .nav-link span { display: none; }
html[data-kisoc-view="visitlist"] .sidebar #accordionSidebar { padding: 12px 8px; }
html[data-kisoc-view="visitlist"] .sidebar .nav-item { margin: 5px 0; }
html[data-kisoc-view="visitlist"] .sidebar .nav-item .nav-link {
  min-height: 40px;
  justify-content: center;
  padding: 9px 4px;
  border-radius: 4px;
}
html[data-kisoc-view="visitlist"] .sidebar .nav-item .nav-link i { font-size: 17px; }
html[data-kisoc-view="visitlist"] .sidebar .nav-item .nav-link.active {
  box-shadow: none;
  background: #fff5bf;
}
html[data-kisoc-view="visitlist"] #wrapper > .sidebar.toggled {
  width: var(--visitlist-sidebar) !important;
  flex-basis: var(--visitlist-sidebar);
}
html[data-kisoc-view="visitlist"] .topbar {
  left: var(--visitlist-sidebar);
  height: var(--visitlist-header);
  padding: 0 18px;
  background: var(--v2-yellow) !important;
}
html[data-kisoc-view="visitlist"] body:has(.sidebar.toggled) .topbar { left: var(--visitlist-sidebar); }
html[data-kisoc-view="visitlist"] .topbar h3 {
  margin: 0 !important;
  font-size: 15px;
  font-weight: 700;
}
html[data-kisoc-view="visitlist"] .topbar .nav-link { padding: 6px 8px; }
html[data-kisoc-view="visitlist"] .topbar #idiomab {
  min-height: 30px;
  margin: 0 4px;
  padding: 4px 6px;
  border: 0;
  background: transparent;
}
html[data-kisoc-view="visitlist"] #content > .container-fluid {
  padding: 28px 28px 20px;
}
html[data-kisoc-view="visitlist"] body > #wrapper > #content-wrapper {
  padding-top: calc(var(--visitlist-header) + 0px);
}
html[data-kisoc-view="visitlist"] .card:has(#dataTable) {
  min-height: calc(100vh - var(--visitlist-header) - 48px);
  background: #fff;
  border: 0;
  border-radius: 7px;
  box-shadow: 0 2px 12px #0000000a !important;
}
html[data-kisoc-view="visitlist"] .card:has(#dataTable) > .card-body { padding: 20px 24px 16px; }
html[data-kisoc-view="visitlist"] #dt-custom-toolbar {
  min-height: 48px;
  align-items: center !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid var(--visitlist-border);
}
html[data-kisoc-view="visitlist"] #dt-custom-toolbar > div:first-child { gap: 18px !important; }
html[data-kisoc-view="visitlist"] #dt-custom-toolbar input[type="search"] {
  width: 245px !important;
  min-height: 34px;
  border: 0 !important;
  border-bottom: 1px solid #aeb2b3 !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 7px 10px 7px 30px !important;
}
html[data-kisoc-view="visitlist"] #dt-custom-toolbar .toggle-switch { width: 34px; height: 19px; }
html[data-kisoc-view="visitlist"] #dt-custom-toolbar .slider-track::before { width: 13px; height: 13px; }
html[data-kisoc-view="visitlist"] #dt-custom-toolbar .toggle-switch input:checked + .slider-track::before { transform: translateX(15px); }
html[data-kisoc-view="visitlist"] #activeToggleWrap { font-size: 11px; color: var(--visitlist-muted); }
html[data-kisoc-view="visitlist"] #dt-custom-toolbar :is(#add, #link) {
  min-height: 34px;
  padding: 7px 11px;
  border-radius: 3px;
  font-size: 11px;
}
html[data-kisoc-view="visitlist"] #dt-custom-toolbar #add { background: var(--v2-yellow) !important; }
html[data-kisoc-view="visitlist"] #dt-custom-toolbar #link { background: #fff !important; border: 1px solid #c5c9ca; }
html[data-kisoc-view="visitlist"] #dt-custom-toolbar #export_table { font-size: 18px; color: #555b5c; }
html[data-kisoc-view="visitlist"] #dt-custom-toolbar select { min-height: 32px; font-size: 11px; }
html[data-kisoc-view="visitlist"] .dt-container table.dataTable > thead > tr > th {
  padding: 12px 10px !important;
  color: #454b4c;
  font-size: 10px;
  letter-spacing: .01em;
  text-transform: none;
  white-space: nowrap;
}
html[data-kisoc-view="visitlist"] .dt-container table.dataTable > tbody > tr > td {
  height: 43px;
  padding: 10px !important;
  color: #565b5c;
  font-size: 11px;
  border-bottom: 1px solid #eeeeee;
}
html[data-kisoc-view="visitlist"] .dt-container table.dataTable > tbody > tr:hover { background: #fffbea; }
html[data-kisoc-view="visitlist"] .dt-container table.dataTable thead tr.dt-search-row th { padding: 6px 10px 10px !important; }
html[data-kisoc-view="visitlist"] .dt-container .dt-col-search { height: 28px; font-size: 10px !important; }
html[data-kisoc-view="visitlist"] .dt-container > .dt-layout-row:not(.dt-layout-table) { padding-block: 12px 0; }
html[data-kisoc-view="visitlist"] .dt-container .dt-paging .dt-paging-button { min-width: 28px; min-height: 28px; font-size: 11px; }
html[data-kisoc-view="visitlist"] footer.sticky-footer { margin-top: 0; padding: 11px 18px; }
html[data-kisoc-view="visitlist"] footer.sticky-footer .copyright { font-size: 10px; }
@media (max-width: 767px) {
  html[data-kisoc-view="visitlist"] .topbar { left: var(--visitlist-sidebar); padding-inline: 8px; }
  html[data-kisoc-view="visitlist"] #content > .container-fluid { padding: 16px 10px; }
  html[data-kisoc-view="visitlist"] .card:has(#dataTable) > .card-body { padding: 14px 12px; }
  html[data-kisoc-view="visitlist"] #dt-custom-toolbar input[type="search"] { width: 100% !important; }
  html[data-kisoc-view="visitlist"] #dt-custom-toolbar > div:first-child { gap: 10px !important; }
}

/* Visit detail modal: presentation-only treatment for the existing edit fields. */
html[data-kisoc-view="visitlist"] #modalDetalhe {
  background: #0000002e;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .modal-dialog {
  width: min(890px, calc(100% - 32px));
  max-width: none;
  margin: 1.75rem auto;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .modal-content {
  overflow: hidden;
  border: 0;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 14px 42px #0000002e;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .modal-content::before {
  content: "Detalle de la visita";
  display: block;
  min-height: 58px;
  padding: 18px 52px 14px 24px;
  border-bottom: 1px solid #e5e6e6;
  color: #363b3c;
  font-size: 16px;
  font-weight: 700;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .modal-body {
  position: relative;
  padding: 20px 24px 14px;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .modal-body > table {
  width: 100% !important;
  margin: 0 !important;
  border: 1px solid #e3e5e5;
  border-radius: 6px;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  table-layout: fixed;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .modal-body > table tr {
  display: grid;
  grid-template-columns: 27% 73%;
  min-height: 38px;
  border-bottom: 1px solid #eeeeee;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .modal-body > table tr:last-child { border-bottom: 0; }
html[data-kisoc-view="visitlist"] #modalDetalhe .modal-body > table td {
  display: flex;
  align-items: center;
  min-width: 0;
  padding: 9px 12px;
  color: #606667;
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .modal-body > table td:first-child {
  background: #f5f6f6;
  color: #4b5051;
  font-weight: 600;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .modal-body > table td:nth-child(2) {
  color: #515758;
  background: #fff;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .modal-body > table td span {
  display: block;
  max-width: 100%;
}
html[data-kisoc-view="visitlist"] #modalDetalhe #linha_status {
  display: inline-block;
  padding: 3px 9px;
  border: 1px solid #8eb99f;
  border-radius: 12px;
  background: #e9f4ec;
  color: #357048;
  font-size: 11px;
}
html[data-kisoc-view="visitlist"] #modalDetalhe #linha_anular {
  accent-color: #c99f00;
}
html[data-kisoc-view="visitlist"] #modalDetalhe label[for="linha_anular"] {
  margin: 0 0 0 8px;
  font-size: 12px;
}
html[data-kisoc-view="visitlist"] #modalDetalhe #linha_save {
  background: #fffdf0;
}
html[data-kisoc-view="visitlist"] #modalDetalhe #linha_save td:first-child {
  background: #fffdf0;
}
html[data-kisoc-view="visitlist"] #modalDetalhe #linha_save #botao_save {
  grid-column: 1 / -1;
  width: 100%;
  background: #fffdf0;
}
html[data-kisoc-view="visitlist"] #modalDetalhe #make_save {
  width: auto;
  min-width: 150px;
  border: 0;
  border-radius: 4px;
  background: var(--v2-yellow) !important;
  color: #252820 !important;
  font-size: 12px;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .fotoVis {
  position: absolute !important;
  top: 20px !important;
  right: 24px !important;
  z-index: 2;
  width: 112px !important;
  height: 112px !important;
  overflow: hidden;
  border: 1px solid #dfe2e2;
  border-radius: 5px;
  background: #f1f2f2 !important;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .fotoVis img,
html[data-kisoc-view="visitlist"] #modalDetalhe .fotoVis video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .plusIcon,
html[data-kisoc-view="visitlist"] #modalDetalhe .saveIcon {
  right: 5px;
  bottom: 5px;
  width: 25px;
  height: 25px;
  font-size: 13px;
  box-shadow: 0 1px 4px #00000026;
}
html[data-kisoc-view="visitlist"] #modalDetalhe .modal-footer {
  justify-content: flex-end;
  padding: 14px 24px 18px;
  border-top: 0;
  background: #fff;
}
html[data-kisoc-view="visitlist"] #modalDetalhe #modal_close {
  width: auto;
  min-width: 112px;
  margin: 0;
  border: 1px solid #bcc1c2 !important;
  border-radius: 4px;
  background: #fff !important;
  color: #444a4b !important;
  font-size: 12px;
}
@media (max-width: 767px) {
  html[data-kisoc-view="visitlist"] #modalDetalhe .modal-dialog {
    width: calc(100% - 20px);
    margin: 10px auto;
  }
  html[data-kisoc-view="visitlist"] #modalDetalhe .modal-content::before { padding-left: 16px; }
  html[data-kisoc-view="visitlist"] #modalDetalhe .modal-body { padding: 14px 16px 10px; }
  html[data-kisoc-view="visitlist"] #modalDetalhe .modal-body > table tr {
    grid-template-columns: 40% 60%;
  }
  html[data-kisoc-view="visitlist"] #modalDetalhe .fotoVis {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    margin: 0 0 14px auto;
  }
  html[data-kisoc-view="visitlist"] #modalDetalhe .modal-footer { padding-inline: 16px; }
}

/* Official system yellow — header surfaces and login. */
html .sidebar .sidebar-brand,
html .card > .card-header,
html .modal-header,
html[data-kisoc-view^="multivisits-"] #header,
html[data-kisoc-view="eventschedule-isocmadrid"] #header {
  background: var(--v2-yellow) !important;
  color: var(--v2-ink);
}
html[data-kisoc-view="login"] body {
  background: var(--v2-yellow) !important;
}
/* List surfaces: DataTables builds a second layout after the EJS page loads.
   Style that generated structure without moving controls or changing its API. */
html .sidebar .sidebar-brand { padding-inline: 14px; gap: 8px; }
html .sidebar .sidebar-brand-text { min-width: 0; margin-inline: 0 !important; font-size: 14px; letter-spacing: 0; white-space: normal; line-height: 1.2; }
html .sidebar .sidebar-brand-icon { flex: 0 0 30px; }
html .card:has(table.table) { border: 0; box-shadow: none !important; }
html .card:has(table.table) > .card-body { padding: 24px; }
html .table-responsive:has(table.table) { border: 0; border-radius: 0; }
html .table-responsive:has(> .dt-container) { overflow: visible; }
html .dt-container { width: 100%; min-width: 0; font-size: 13px; }
html .dt-container .dt-layout-row { margin: 0; gap: 16px; }
html .dt-container .dt-layout-cell { min-width: 0; max-width: 100%; padding: 0; }
html .dt-container .dt-layout-table { display: block; width: 100%; }
html .dt-container .dt-layout-table > .dt-layout-cell { display: block; overflow-x: auto; width: 100%; scrollbar-width: thin; }
html #dt-custom-toolbar {
  display: flex !important; align-items: center !important;
  flex-wrap: wrap !important; gap: 16px 24px !important;
  padding: 0 0 24px !important;
}
html #dt-custom-toolbar > div:first-child { flex: 1 1 320px; min-width: 0; flex-wrap: wrap; gap: 16px !important; }
html #dt-custom-toolbar > div:first-child > div:has(input[type="search"]) { flex: 1 1 180px; min-width: 0; }
html #dt-custom-toolbar input[type="search"] {
  width: 100% !important; min-height: 40px;
  background: #f7f8f8 !important; border: 1px solid #d6d9da !important;
  padding: 10px 12px 10px 34px !important; border-radius: 4px !important;
  font-size: 13px !important; color: #303334;
}
html #dt-custom-toolbar > div:last-child { gap: 10px !important; flex: 0 1 auto; }
html #dt-custom-toolbar :is(.btn, #link) { min-height: 40px; white-space: nowrap; }
html #dt-custom-toolbar select { min-width: 72px; min-height: 40px; background: #fff; border: 1px solid #d6d9da !important; border-radius: 4px !important; padding: 8px 10px !important; }
html #dt-custom-toolbar #export_table { margin: 0 8px !important; padding: 8px; font-size: 21px; cursor: pointer; }
html #activeToggleWrap { margin: 0 !important; white-space: nowrap; color: #505758; }
html #activeToggleWrap .toggle-switch { margin: 0; flex-shrink: 0; }
html .dt-container > .dt-layout-row:not(.dt-layout-table) { padding-block: 16px; }
html .dt-container table.dataTable,
html table.table { border-collapse: collapse !important; border-spacing: 0 !important; color: #303334; font-size: 13px; }
html .dt-container table.dataTable { table-layout: auto !important; width: 100% !important; }
html table.table > thead > tr > th,
html .dt-container table.dataTable > thead > tr > th {
  background: #fff !important; color: #373d3f; font-size: 12px;
  font-weight: 600; padding: 13px 12px !important;
  border: 0 !important; border-bottom: 1px solid #d9ddde !important;
  text-align: left; vertical-align: middle;
}
html .dt-container table.dataTable thead tr.dt-search-row th { padding: 8px 12px 12px !important; background: #fff !important; }
html .dt-container table.dataTable thead .dt-col-search {
  height: 34px; min-width: 80px; width: 100% !important;
  padding: 7px 9px !important; font-size: 12px !important;
  border: 1px solid #dfe2e3 !important; background: #f7f8f8;
  border-radius: 4px !important; box-shadow: none !important;
}
html table.table > tbody > tr > td,
html .dt-container table.dataTable > tbody > tr > td {
  padding: 14px 12px !important; border: 0;
  border-bottom: 1px solid #eceeef; vertical-align: middle;
  box-shadow: none !important; background-color: transparent;
  white-space: nowrap; overflow-wrap: normal; word-break: normal;
  max-width: none; overflow: visible; text-overflow: clip;
}
/* IDs are also used on surrounding containers in the legacy views. */
html #habitacoes table#dataTable tbody td,
html table#dataTable #dadosRules td,
html table#dataTable #auditoria_table td {
  white-space: nowrap; overflow-wrap: normal; word-break: normal;
  max-width: none; overflow: visible; text-overflow: clip;
}
html table.table > tbody > tr { background-color: #fff; }
html table.table > tbody > tr:hover { background-color: #fffdf0; }
html table.dataTable > tbody > tr.selected > td { background-color: #fff8c5; }
html .dt-container .dt-info { padding: 0; color: #687073; font-size: 12px; }
html .dt-container .dt-paging .dt-paging-button {
  min-width: 34px; min-height: 34px; margin: 0 2px;
  padding: 6px 10px; border: 1px solid transparent !important;
  background: transparent !important; border-radius: 4px;
  color: #505758 !important; box-shadow: none !important;
}
html .dt-container .dt-paging .dt-paging-button.current { background: #fff8c5 !important; border-color: #FFD102 !important; color: #303334 !important; }
html .dt-container .dt-paging .dt-paging-button:hover:not(.disabled) { background: #f1f3f3 !important; color: #303334 !important; }
@media (max-width: 767px) {
  html .card:has(table.table) > .card-body { padding: 16px; }
  html #dt-custom-toolbar { gap: 12px !important; padding-bottom: 16px !important; }
  html #dt-custom-toolbar > div { flex-basis: 100% !important; width: 100%; }
  html #dt-custom-toolbar > div:last-child { justify-content: flex-start; }
  html #dt-custom-toolbar :is(.btn, #link) { flex: 1 1 auto; }
  html .dt-container > .dt-layout-row:last-child { display: flex; flex-wrap: wrap; justify-content: space-between; }
}