@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
/* ============================================================
   DHealth UI v2 — global reskin over Bootstrap 3 / Limitless
   Loaded LAST so it overrides the legacy theme. 2026-06-26
   ============================================================ */
:root{
  --dh-bg:#f5f7fb; --dh-surface:#ffffff; --dh-ink:#0b1524; --dh-muted:#667085;
  --dh-line:#e7ebf2; --dh-line2:#dfe4ec;
  --dh-primary:#0e9488; --dh-primary-d:#0c7a70; --dh-primary-t:#e6f7f5;
  --dh-ok:#0f9d58; --dh-ok-t:#e7f7ee; --dh-warn:#c77700; --dh-warn-t:#fdf3e3;
  --dh-danger:#dc2b2b; --dh-danger-t:#fdecec; --dh-info:#2f6bff; --dh-info-t:#eaf1ff;
  --dh-radius:12px; --dh-shadow:0 1px 2px rgba(13,24,43,.05),0 6px 20px rgba(13,24,43,.06);
}
/* ---- Base ---- */
body{font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif !important;
  background:var(--dh-bg) !important;color:var(--dh-ink);font-size:13.5px;-webkit-font-smoothing:antialiased;}
a{color:var(--dh-primary);}
a:hover,a:focus{color:var(--dh-primary-d);}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5{font-weight:600;color:var(--dh-ink);letter-spacing:-.01em;}
.content-wrapper,.page-content{background:var(--dh-bg) !important;}

/* ---- Top navbar: subtle modern polish (keep existing bg so the logo stays visible) ---- */
.navbar-dhealth,.navbar-fixed-top,.navbar.navbar-dhealth{
  border-bottom:1px solid var(--dh-line2) !important;box-shadow:0 1px 3px rgba(13,24,43,.05) !important;}
.second-navbar{border-bottom:1px solid var(--dh-line) !important;}
.navbar-toggler.side-button,.side-button{color:var(--dh-primary) !important;}

/* ---- Page header / breadcrumb ---- */
.page-header{background:transparent !important;border:0 !important;margin:0 0 16px !important;}
.page-header .page-title,.page-title{font-size:20px !important;font-weight:600;}
.breadcrumb{background:transparent !important;padding:6px 0 !important;font-size:12.5px;}
.breadcrumb>.active{color:var(--dh-ink);font-weight:600;}

/* ---- Panels -> Cards ---- */
.panel{background:var(--dh-surface) !important;border:1px solid var(--dh-line2) !important;
  border-radius:var(--dh-radius) !important;box-shadow:var(--dh-shadow) !important;margin-bottom:18px;overflow:hidden;}
.panel-flat,.panel-white,.panel-default{border-color:var(--dh-line2) !important;}
.panel>.panel-heading,.panel-heading{
  background:var(--dh-surface) !important;color:var(--dh-ink) !important;
  border-bottom:1px solid var(--dh-line) !important;border-radius:0 !important;padding:15px 20px !important;}
.panel-title{font-size:14.5px !important;font-weight:600 !important;color:var(--dh-ink) !important;}
.panel-body{padding:20px !important;}
.panel-footer{background:#fbfcfe !important;border-top:1px solid var(--dh-line) !important;}
/* kill Limitless colored panel bars, keep them subtle */
.panel-primary,.panel-info,.panel-success,.panel-warning,.panel-danger{border-top:3px solid var(--dh-primary) !important;}

/* ---- Buttons ---- */
.btn{border-radius:9px !important;font-weight:600 !important;font-size:13px;padding:8px 15px;
  text-transform:none !important;border:1px solid transparent;transition:all .15s;}
.btn-primary{background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;color:#fff !important;
  box-shadow:0 6px 14px -7px var(--dh-primary);}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active{background:var(--dh-primary-d) !important;border-color:var(--dh-primary-d) !important;}
.btn-default{background:var(--dh-surface) !important;border-color:var(--dh-line2) !important;color:#344054 !important;}
.btn-default:hover{background:#f2f5f9 !important;}
.btn-success{background:var(--dh-ok) !important;border-color:var(--dh-ok) !important;}
.btn-danger{background:var(--dh-danger) !important;border-color:var(--dh-danger) !important;}
.btn-link{color:var(--dh-primary) !important;}
.btn-xs{padding:4px 9px;border-radius:7px !important;}

/* ---- Form controls ---- */
.form-control{border:1px solid var(--dh-line2) !important;border-radius:9px !important;
  box-shadow:none !important;color:var(--dh-ink);font-size:13.5px;padding:8px 12px;height:auto;min-height:38px;}
.form-control:focus{border-color:var(--dh-primary) !important;box-shadow:0 0 0 3px rgba(14,148,136,.15) !important;}
.control-label,label{font-weight:600;color:#344054;font-size:12.5px;}
.has-error .form-control{border-color:var(--dh-danger) !important;}
.input-group-addon{border-radius:9px;border-color:var(--dh-line2);background:#f2f5f9;}
/* select2 */
.select2-container--default .select2-selection--single,
.select2-selection,.select2-container .select2-selection--single{
  border:1px solid var(--dh-line2) !important;border-radius:9px !important;min-height:38px !important;height:38px !important;}
.select2-container--default .select2-selection--single .select2-selection__rendered{line-height:36px !important;}
.select2-dropdown{border-color:var(--dh-line2) !important;border-radius:9px;}
/* highlighted (hover/keyboard) option: dark-teal bg needs light text or the black label is unreadable */
.select2-container--default .select2-results__option--highlighted,
.select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--dh-primary) !important;color:#fff !important;}
.select2-container--default .select2-results__option--highlighted *{color:#fff !important;}
/* currently-selected option (not hovered): soft tint + dark text, not a heavy dark block */
.select2-container--default .select2-results__option[aria-selected="true"]:not(.select2-results__option--highlighted){background:#e8f5f2 !important;color:#0f172a !important;}

/* ---- Tables ---- */
.table{background:transparent;}
.table>thead>tr>th{background:#fbfcfe !important;color:var(--dh-muted) !important;font-weight:600 !important;
  font-size:11.5px;text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid var(--dh-line2) !important;padding:11px 14px !important;}
.table>tbody>tr>td{border-top:1px solid var(--dh-line) !important;padding:11px 14px !important;vertical-align:middle;}
.table-striped>tbody>tr:nth-of-type(odd){background:#fbfcfe !important;}
.table-hover>tbody>tr:hover{background:var(--dh-primary-t) !important;}
.dataTables_wrapper .dataTables_paginate .paginate_button.current{background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;color:#fff !important;border-radius:7px;}
.dataTables_filter input,.dataTables_length select{border-radius:8px !important;border:1px solid var(--dh-line2) !important;}

/* ---- Labels / badges ---- */
.label,.badge{font-weight:600;border-radius:999px;padding:.35em .7em;font-size:11px;}
.label-primary,.badge-primary{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;}
.label-success{background:var(--dh-ok-t) !important;color:var(--dh-ok) !important;}
.label-warning{background:var(--dh-warn-t) !important;color:var(--dh-warn) !important;}
.label-danger{background:var(--dh-danger-t) !important;color:var(--dh-danger) !important;}
.label-info{background:var(--dh-info-t) !important;color:var(--dh-info) !important;}
.label-default{background:#eef2f7 !important;color:#475467 !important;}

/* ---- Tabs ---- */
.nav-tabs{border-bottom:1px solid var(--dh-line2);}
.nav-tabs>li>a{border:0 !important;color:var(--dh-muted);font-weight:600;border-radius:0;}
.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover{color:var(--dh-primary) !important;background:transparent !important;
  border-bottom:2px solid var(--dh-primary) !important;}

/* ---- Alerts ---- */
.alert{border-radius:10px;border:1px solid transparent;font-size:13px;}
.alert-success{background:var(--dh-ok-t);border-color:#bce7cd;color:#0c6b3d;}
.alert-danger{background:var(--dh-danger-t);border-color:#f5c2c2;color:#a31919;}
.alert-info{background:var(--dh-info-t);border-color:#c7dbff;color:#1d4ed8;}
.alert-warning{background:var(--dh-warn-t);border-color:#f3dca5;color:#92560a;}

/* ---- Modals ---- */
.modal-content{border-radius:14px !important;border:0 !important;box-shadow:0 24px 60px rgba(13,24,43,.25) !important;}
.modal-header{border-bottom:1px solid var(--dh-line) !important;padding:16px 20px;}
.modal-title{font-weight:600;}
.modal-footer{border-top:1px solid var(--dh-line) !important;padding:14px 20px !important;}
.modal-footer .btn + .btn{margin-left:8px;}
.modal-body{padding:18px 20px;}

/* ---- Misc ---- */
.well{background:var(--dh-surface);border:1px solid var(--dh-line2);border-radius:var(--dh-radius);box-shadow:none;}
.pagination>li>a{color:var(--dh-primary);}
.pagination>.active>a,.pagination>.active>a:hover{background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;}
hr{border-top-color:var(--dh-line);}
.text-primary{color:var(--dh-primary) !important;}

/* ---- Login page polish ---- */
.login-container .panel,.login-form .panel,body.login-container .panel{border-radius:16px !important;}
.login-cover,.bg-slate-800,.login-container{background:var(--dh-bg);}

/* ===== Post-login module launcher redesign (recreated icons + clean grid) ===== */
.site-index .module-section{max-width:1120px;margin:28px auto 8px;padding:0 14px}
/* Bootstrap .row clearfix pseudo-elements become stray grid items when .row is a grid
   (caused a blank leading + trailing cell, shifting cards right). Neutralize them. */
.site-index .row-flex::before,.site-index .row-flex::after{content:none !important;display:none !important;}
.site-index .row-flex{display:grid !important;grid-template-columns:repeat(5,1fr);gap:16px;margin:0 !important}
.site-index .list-module,.site-index .list-module-hide,.site-index .list-module-not{width:auto !important;float:none !important;padding:0 !important;margin:0 !important;max-width:none !important;flex:none !important}
.site-index .isi-module{background:#fff;border:1px solid var(--dh-line2);border-radius:16px;padding:22px 12px;box-shadow:var(--dh-shadow);cursor:pointer;transition:transform .15s,box-shadow .15s,border-color .15s;display:flex;flex-direction:column;align-items:center;gap:13px;min-height:138px;justify-content:center;height:100%}
.site-index .isi-module:hover,.site-index .isi-module:focus{border-color:var(--dh-primary);box-shadow:0 12px 26px -12px var(--dh-primary);transform:translateY(-3px);outline:none}
.site-index .dh-mod-ic{width:58px;height:58px;border-radius:17px;background:var(--dh-primary-t);display:flex;align-items:center;justify-content:center;color:var(--dh-primary-d);transition:.15s}
.site-index .isi-module:hover .dh-mod-ic{background:var(--dh-primary);color:#fff}
.site-index .dh-mod-ic svg{width:29px;height:29px}
.site-index .isi-module h6{font-size:13px;font-weight:600;color:var(--dh-ink);margin:0;line-height:1.25}
.site-index .isi-module-not{background:#fafbfd;border:1px dashed var(--dh-line2);border-radius:16px;min-height:138px;display:flex;align-items:center;justify-content:center;color:var(--dh-soft);padding:12px}
.site-index .isi-module-not h6{color:var(--dh-soft);font-weight:500;font-size:12px;margin:0}
.site-index .btn-more,.site-index .btn-less{background:var(--dh-primary) !important;color:#fff !important;border:0 !important;border-radius:10px;padding:10px 20px;font-weight:600;font-size:13px;margin-top:24px;box-shadow:0 8px 18px -8px var(--dh-primary)}
.site-index .btn-more:hover,.site-index .btn-less:hover{background:var(--dh-primary-d) !important}
/* launcher responsive: 5 cols desktop -> 3 tablet -> 2 phone */
@media(max-width:767px){ .site-index .row-flex{grid-template-columns:repeat(3,1fr)} }
@media(max-width:600px){ .site-index .row-flex{grid-template-columns:repeat(2,1fr);gap:12px} .site-index .dh-mod-ic{width:50px;height:50px} }

/* ===== In-module top menu / navbar simplification ===== */
.navbar-dhealth .navbar-nav > li > a{font-weight:500;color:#475467 !important;padding:14px 14px;border-radius:0;transition:.12s}
.navbar-dhealth .navbar-nav > li > a:hover,.navbar-dhealth .navbar-nav > li.active > a,.navbar-dhealth .navbar-nav > li.open > a{color:var(--dh-primary-d) !important;background:var(--dh-primary-t) !important}
.navbar-dhealth .navbar-nav > li > a i{color:inherit}
.second-navbar{background:#fff !important;border-bottom:1px solid var(--dh-line) !important;box-shadow:none !important}
/* dropdown menus (module menu) -> modern card */
.dropdown-menu{border:1px solid var(--dh-line2) !important;border-radius:12px !important;box-shadow:0 12px 30px rgba(13,24,43,.12) !important;padding:6px !important;margin-top:6px}
.dropdown-menu > li > a,.dropdown-menu li a{border-radius:8px;padding:9px 12px !important;color:#344054 !important;font-size:13px;font-weight:500}
.dropdown-menu > li > a:hover,.dropdown-menu li a:hover{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important}
.dropdown-menu .divider{background:var(--dh-line)}
/* mega/submenu wrapper used by Limitless */
.wrapper,.wrapper-header{border-radius:12px !important}
.menu li a{border-radius:8px;font-size:13px}
.menu li a:hover{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important}
/* notification + user dropdown chips */
.navbar-dhealth .dropdown-user > a,.navbar-dhealth .notifications-menu > a{color:#475467 !important}
/* room switcher / Menu Utama buttons */
.right-navbar .nav.navbar-right > li > a{border-radius:8px;font-weight:500}
.right-navbar .nav.navbar-right > li > a:hover{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important}
.scrollable-menu{max-height:340px;overflow:auto}
/* breadcrumbs/page title inside modules */
.page-title{font-weight:600}

/* ===== Launcher footer + header polish ===== */
.footer{text-align:center;color:var(--dh-soft);font-size:12.5px;margin:32px 0 24px}
.footer .dhealth-logo,.footer img{max-height:40px !important;width:auto !important;opacity:.9;vertical-align:middle;margin-left:6px}
.site-index + div .footer, .footer p{margin:0}
/* keep RS logo in the top bar tidy on the launcher */
.navbar-dhealth .navbar-logo img,.navbar-dhealth .logo-rs{max-height:40px !important;width:auto !important}

/* ===== PROMOTE TO LIVE: in-module left SIDEBAR shell (desktop) ===== */
@media(min-width:992px){
  body{}
  #navbar-second .second-navbar{
    position:fixed !important; top:56px; left:0; bottom:0; width:236px;
    display:flex !important; flex-direction:column !important; align-items:stretch !important;
    background:#fff !important; border-right:1px solid var(--dh-line2) !important;
    box-shadow:1px 0 0 rgba(13,24,43,.02); overflow-y:auto; z-index:1029; padding:10px 10px 16px;
  }
  #navbar-second .navbar-logo{display:none !important;}
  #navbar-second .left-navbar{display:block !important;width:100%;}
  #navbar-second .navbar-collapse{display:block !important;height:auto !important;overflow:visible !important;padding:0 !important;}
  #navbar-second .navbar-toggler.side-button{display:none !important;}
  #navbar-second #mainmenu{display:flex !important;flex-direction:column !important;width:100%;float:none !important;}
  #navbar-second #mainmenu > li{width:100%;float:none !important;position:relative;}
  #navbar-second #mainmenu > li > a{display:flex;align-items:center;gap:10px;padding:11px 13px;border-radius:9px;color:#475467 !important;font-weight:500;}
  #navbar-second #mainmenu > li > a:hover,#navbar-second #mainmenu > li.open > a,#navbar-second #mainmenu > li:hover > a{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;}
  /* submenu flyout to the right */
  #navbar-second #mainmenu > li > .dropdown-menu{position:absolute !important;left:100% !important;top:0 !important;margin:0 0 0 6px !important;min-width:230px;display:none;}
  #navbar-second #mainmenu > li:hover > .dropdown-menu{display:block !important;}
  #navbar-second .right-navbar{margin-top:auto;width:100%;}
  #navbar-second .right-navbar .nav.navbar-right{display:flex;flex-direction:column;width:100%;float:none;}
  #navbar-second .right-navbar .nav.navbar-right > li{width:100%;float:none;}
  /* push page content right of the sidebar */
  /* push page content right of the sidebar — ONLY when the sidebar actually exists
     (#navbar-second renders only inside a workspace; absent on login & launcher). */
  #navbar-second ~ .page-container{margin-left:236px !important;}
}

/* ===== Sidebar polish (live, desktop) ===== */
@media(min-width:992px){
  #navbar-second .second-navbar{padding:8px 10px 14px;}
  #navbar-second .left-navbar::before{content:"NAVIGASI";display:block;font-size:10.5px;letter-spacing:.09em;color:var(--dh-soft);font-weight:700;padding:6px 12px 8px;}
  #navbar-second #mainmenu > li{margin:1px 0;}
  #navbar-second #mainmenu > li > a{position:relative;font-size:13.5px;}
  #navbar-second #mainmenu > li > a .caret{margin-left:auto;border-top-color:currentColor;}
  #navbar-second #mainmenu > li > a i,#navbar-second #mainmenu > li > a [class^="icon-"]{width:18px;text-align:center;}
  #navbar-second #mainmenu > li.active > a,#navbar-second #mainmenu > li.active > a:hover{background:var(--dh-primary) !important;color:#fff !important;box-shadow:0 6px 14px -7px var(--dh-primary);}
  #navbar-second #mainmenu > li.active > a i{color:#fff !important;}
  #navbar-second .right-navbar{border-top:1px solid var(--dh-line);padding-top:10px;margin-top:14px;}
  #navbar-second .right-navbar .nav.navbar-right > li > a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;color:#475467 !important;font-weight:500;}
  #navbar-second .right-navbar .nav.navbar-right > li > a:hover{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;}
  #navbar-second .second-navbar::-webkit-scrollbar{width:7px;}
  #navbar-second .second-navbar::-webkit-scrollbar-thumb{background:#dfe4ec;border-radius:8px;}
  #navbar-second .second-navbar::-webkit-scrollbar-track{background:transparent;}
  /* subtle hover lift on submenu flyout */
  #navbar-second #mainmenu > li > .dropdown-menu{box-shadow:0 12px 30px rgba(13,24,43,.14) !important;}
}

/* ===== Global modern legend (covers all .my-legend across modules) ===== */
.my-legend .legend-title{font-size:12px;font-weight:600;color:#475467;margin-bottom:8px;text-align:left;}
.my-legend .legend-scale ul{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px;float:none;}
.my-legend .legend-scale ul li{display:inline-flex !important;align-items:center;gap:7px;width:auto !important;float:none !important;margin:0 !important;padding:6px 12px;border:1px solid #e7ebf2;border-radius:999px;font-size:11.5px;font-weight:500;color:#344054;background:#fff;text-align:left;height:auto !important;}
.my-legend ul.legend-labels li span{display:inline-block !important;float:none !important;width:9px !important;height:9px !important;border-radius:50% !important;border:0 !important;margin:0 !important;}
.my-legend{margin-bottom:8px;}

/* ===== Track 1: global modernization of high-frequency patterns (covers 100s of views) ===== */
/* panel-toolbar (list-page action/search bar) */
.panel-toolbar{background:#fbfcfe !important;border-bottom:1px solid var(--dh-line) !important;padding:12px 20px !important;}
.panel-toolbar .btn{margin:2px 6px 2px 0;}
/* section headers */
.content-group,.content-group-lg{margin-bottom:18px;}
/* form labels + horizontal spacing */
.control-label{font-weight:600;color:#344054;}
.form-horizontal .form-group{margin-bottom:14px;}
/* input groups */
.input-group .form-control{border-radius:9px 0 0 9px;}
.input-group-btn:last-child .btn,.input-group-btn:last-child > .btn{border-radius:0 9px 9px 0;}
.input-group-addon{border-radius:9px;border-color:var(--dh-line2);background:#f2f5f9;color:#475467;}
/* DataTables controls */
.dataTables_wrapper{padding:6px 2px;}
.dataTables_length select,.dataTables_filter input{border:1px solid var(--dh-line2) !important;border-radius:8px !important;padding:6px 10px;height:auto;box-shadow:none !important;}
.dataTables_filter input:focus,.dataTables_length select:focus{border-color:var(--dh-primary) !important;box-shadow:0 0 0 3px rgba(14,148,136,.15) !important;outline:0;}
.dataTables_info{color:var(--dh-muted);font-size:12.5px;}
.dataTables_paginate .paginate_button{border-radius:8px !important;border:1px solid var(--dh-line2) !important;margin:0 2px !important;padding:5px 11px !important;color:#475467 !important;background:#fff !important;}
.dataTables_paginate .paginate_button.current,.dataTables_paginate .paginate_button.current:hover{background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;color:#fff !important;}
.dataTables_paginate .paginate_button:hover{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;border-color:var(--dh-primary-t) !important;}
/* panel-flat / framed tables */
.panel-flat{box-shadow:var(--dh-shadow) !important;}
.table-framed{border:1px solid var(--dh-line2) !important;border-radius:12px;}
/* select2 arrow height align */
.select2-container--default .select2-selection--single .select2-selection__arrow{height:36px !important;}

/* ===== Track 1b: more global pattern modernization (safe set) ===== */
/* progress bars -> modern rounded teal */
.progress{height:10px !important;border-radius:999px !important;background:#eef2f7 !important;box-shadow:none !important;overflow:hidden;}
.progress-bar{background:var(--dh-primary) !important;border-radius:999px;}
.progress-bar-success{background:var(--dh-ok) !important;} .progress-bar-warning{background:var(--dh-warn) !important;}
.progress-bar-danger{background:var(--dh-danger) !important;} .progress-bar-info{background:var(--dh-info) !important;}
/* bootstrap media objects */
.media{padding:6px 0;}
.media-list .media{border-bottom:1px solid var(--dh-line);}
.media .media-heading{font-weight:600;color:var(--dh-ink);}
/* tab content spacing */
.tab-content{padding-top:14px;}
/* list-group rounded + lines */
.list-group{border-radius:10px;overflow:hidden;}
.list-group-item{border-color:var(--dh-line) !important;}
.list-group-item.active{background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;}
/* status legend squares -> softened */
.square-batal,.square-sukses,.square-proses,.square-pending{border-radius:4px !important;}
/* kartik / bootstrap file inputs */
.file-input .btn,.fileinput .btn,.file-caption{border-radius:9px !important;}
.file-caption .file-caption-name{border:0;}
/* legend source muted */
.my-legend .legend-source{color:var(--dh-soft) !important;font-size:11px !important;}
/* timeline (limitless) subtle */
.timeline .timeline-icon{box-shadow:0 0 0 3px #fff,0 0 0 4px var(--dh-line2);}

/* ===== Logo standardization (new design) ===== */
.footer .dhealth-logo,.footer img{max-height:34px !important;width:auto !important;}
.navbar-dhealth .navbar-logo img,.navbar-dhealth .logo-rs{max-height:38px !important;width:auto !important;object-fit:contain;}
.logo-img{max-height:42px !important;width:auto !important;}
.site-index .navbar-logo img{max-height:38px !important;width:auto !important;}

/* ===== Icon standardization: unify color/size/treatment to new design ===== */
.fa,[class^="icon-"],[class*=" icon-"],.glyphicon{vertical-align:middle;line-height:1;}
/* default icon tone -> palette (cleaner, on-brand) */
.panel-body .fa,.panel-body [class^="icon-"],.form-group .fa,.control-label .fa,.control-label [class^="icon-"]{color:var(--dh-muted);}
.table .fa,.tbl .fa,.table [class^="icon-"],.tbl [class^="icon-"]{color:var(--dh-soft);}
/* buttons: icon color follows button */
.btn-primary .fa,.btn-primary [class^="icon-"]{color:#fff !important;}
.btn-default .fa,.btn-default [class^="icon-"]{color:#475467;}
.btn-success .fa,.btn-danger .fa,.btn-warning .fa,.btn-info .fa{color:#fff !important;}
/* links/actions hover -> teal */
a .fa,a [class^="icon-"]{color:inherit;}
a:hover .fa,a:hover [class^="icon-"],.rowact:hover .fa{color:var(--dh-primary);}
/* sidebar menu icons -> consistent */
.navbar-dhealth #mainmenu .fa,.navbar-dhealth #mainmenu [class^="icon-"]{color:#64748b;font-size:15px;width:18px;text-align:center;}
.navbar-dhealth #mainmenu > li.active > a .fa,.navbar-dhealth #mainmenu > li:hover > a .fa{color:var(--dh-primary-d);}
/* consistent icon sizes */
.btn .fa,.btn [class^="icon-"]{font-size:14px;}
.panel-title .fa{color:var(--dh-primary);}
/* status/legend dots already handled; soften heavy FA backgrounds if any */
.icon-2x{font-size:1.6em;} .icon-3x{font-size:2.2em;}

/* ===== FEATHER ICON CONVERSION (high-visibility) =====
   Replaces common FontAwesome glyphs with feather-stroke SVG via CSS mask.
   Unmapped fa-* classes keep the font (safe fallback). Color = currentColor,
   so the icon palette set earlier (muted/teal/white) still applies. */
.fa-info::before,.fa-info-circle::before,.fa-money::before,.fa-credit-card::before,.fa-database::before,.fa-cogs::before,.fa-cog::before,.fa-gear::before,.fa-gears::before,.fa-sliders::before,.fa-wrench::before,.fa-bar-chart::before,.fa-bar-chart-o::before,.fa-area-chart::before,.fa-trash::before,.fa-trash-o::before,.fa-plus::before,.fa-floppy-o::before,.fa-save::before,.fa-arrow-left::before,.fa-arrow-right::before,.fa-print::before,.fa-search::before,.fa-calendar::before,.fa-calendar-o::before,.fa-refresh::before,.fa-repeat::before,.fa-rotate-right::before,.fa-file-excel-o::before,.fa-file-pdf-o::before,.fa-file::before,.fa-file-o::before,.fa-file-text::before,.fa-file-text-o::before,.fa-file-word-o::before,.fa-eye::before,.fa-pencil::before,.fa-pencil-square-o::before,.fa-edit::before,.fa-pencil-square::before,.fa-list-ul::before,.fa-list::before,.fa-list-ol::before,.fa-user::before,.fa-user-circle::before,.fa-user-o::before,.fa-user-circle-o::before,.fa-chevron-down::before,.fa-angle-down::before,.fa-caret-down::before,.fa-chevron-up::before,.fa-angle-up::before,.fa-caret-up::before,.fa-chevron-right::before,.fa-angle-right::before,.fa-caret-right::before,.fa-chevron-left::before,.fa-angle-left::before,.fa-caret-left::before,.fa-exclamation-circle::before,.fa-exclamation-triangle::before,.fa-warning::before,.fa-download::before,.fa-upload::before,.fa-check-square-o::before,.fa-check-square::before,.fa-plus-square-o::before,.fa-plus-square::before,.fa-check::before,.fa-close::before,.fa-times::before,.fa-remove::before,.fa-times-circle::before,.fa-times-circle-o::before,.fa-thumbs-up::before,.fa-thumbs-o-up::before,.fa-ban::before,.fa-paper-plane::before,.fa-paper-plane-o::before,.fa-send::before,.fa-key::before,.fa-history::before,.fa-clock-o::before,.fa-clock::before,.fa-undo::before,.fa-navicon::before,.fa-bars::before,.fa-reorder::before,.fa-home::before,.fa-bell::before,.fa-bell-o::before,.fa-volume-up::before,.fa-spinner::before,.fa-circle-o-notch::before,.fa-ellipsis-v::before,.fa-ellipsis-h::before{content:"" !important;}
.fa-info,.fa-info-circle{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%2216%22%20x2%3D%2212%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%228%22%20x2%3D%2212.01%22%20y2%3D%228%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%2216%22%20x2%3D%2212%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%228%22%20x2%3D%2212.01%22%20y2%3D%228%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-credit-card,.fa-money{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%221%22%20y%3D%224%22%20width%3D%2222%22%20height%3D%2216%22%20rx%3D%222%22%20ry%3D%222%22%2F%3E%3Cline%20x1%3D%221%22%20y1%3D%2210%22%20x2%3D%2223%22%20y2%3D%2210%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%221%22%20y%3D%224%22%20width%3D%2222%22%20height%3D%2216%22%20rx%3D%222%22%20ry%3D%222%22%2F%3E%3Cline%20x1%3D%221%22%20y1%3D%2210%22%20x2%3D%2223%22%20y2%3D%2210%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-database{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cellipse%20cx%3D%2212%22%20cy%3D%225%22%20rx%3D%229%22%20ry%3D%223%22%2F%3E%3Cpath%20d%3D%22M21%2012c0%201.66-4%203-9%203s-9-1.34-9-3%22%2F%3E%3Cpath%20d%3D%22M3%205v14c0%201.66%204%203%209%203s9-1.34%209-3V5%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cellipse%20cx%3D%2212%22%20cy%3D%225%22%20rx%3D%229%22%20ry%3D%223%22%2F%3E%3Cpath%20d%3D%22M21%2012c0%201.66-4%203-9%203s-9-1.34-9-3%22%2F%3E%3Cpath%20d%3D%22M3%205v14c0%201.66%204%203%209%203s9-1.34%209-3V5%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-cog,.fa-cogs,.fa-gear,.fa-gears,.fa-sliders,.fa-wrench{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%223%22%2F%3E%3Cpath%20d%3D%22M19.4%2015a1.65%201.65%200%200%200%20.33%201.82l.06.06a2%202%200%200%201%200%202.83%202%202%200%200%201-2.83%200l-.06-.06a1.65%201.65%200%200%200-1.82-.33%201.65%201.65%200%200%200-1%201.51V21a2%202%200%200%201-2%202%202%202%200%200%201-2-2v-.09A1.65%201.65%200%200%200%209%2019.4a1.65%201.65%200%200%200-1.82.33l-.06.06a2%202%200%200%201-2.83%200%202%202%200%200%201%200-2.83l.06-.06a1.65%201.65%200%200%200%20.33-1.82%201.65%201.65%200%200%200-1.51-1H3a2%202%200%200%201-2-2%202%202%200%200%201%202-2h.09A1.65%201.65%200%200%200%204.6%209a1.65%201.65%200%200%200-.33-1.82l-.06-.06a2%202%200%200%201%200-2.83%202%202%200%200%201%202.83%200l.06.06a1.65%201.65%200%200%200%201.82.33H9a1.65%201.65%200%200%200%201-1.51V3a2%202%200%200%201%202-2%202%202%200%200%201%202%202v.09a1.65%201.65%200%200%200%201%201.51%201.65%201.65%200%200%200%201.82-.33l.06-.06a2%202%200%200%201%202.83%200%202%202%200%200%201%200%202.83l-.06.06a1.65%201.65%200%200%200-.33%201.82V9a1.65%201.65%200%200%200%201.51%201H21a2%202%200%200%201%202%202%202%202%200%200%201-2%202h-.09a1.65%201.65%200%200%200-1.51%201z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%223%22%2F%3E%3Cpath%20d%3D%22M19.4%2015a1.65%201.65%200%200%200%20.33%201.82l.06.06a2%202%200%200%201%200%202.83%202%202%200%200%201-2.83%200l-.06-.06a1.65%201.65%200%200%200-1.82-.33%201.65%201.65%200%200%200-1%201.51V21a2%202%200%200%201-2%202%202%202%200%200%201-2-2v-.09A1.65%201.65%200%200%200%209%2019.4a1.65%201.65%200%200%200-1.82.33l-.06.06a2%202%200%200%201-2.83%200%202%202%200%200%201%200-2.83l.06-.06a1.65%201.65%200%200%200%20.33-1.82%201.65%201.65%200%200%200-1.51-1H3a2%202%200%200%201-2-2%202%202%200%200%201%202-2h.09A1.65%201.65%200%200%200%204.6%209a1.65%201.65%200%200%200-.33-1.82l-.06-.06a2%202%200%200%201%200-2.83%202%202%200%200%201%202.83%200l.06.06a1.65%201.65%200%200%200%201.82.33H9a1.65%201.65%200%200%200%201-1.51V3a2%202%200%200%201%202-2%202%202%200%200%201%202%202v.09a1.65%201.65%200%200%200%201%201.51%201.65%201.65%200%200%200%201.82-.33l.06-.06a2%202%200%200%201%202.83%200%202%202%200%200%201%200%202.83l-.06.06a1.65%201.65%200%200%200-.33%201.82V9a1.65%201.65%200%200%200%201.51%201H21a2%202%200%200%201%202%202%202%202%200%200%201-2%202h-.09a1.65%201.65%200%200%200-1.51%201z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-area-chart,.fa-bar-chart,.fa-bar-chart-o{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2218%22%20y1%3D%2220%22%20x2%3D%2218%22%20y2%3D%2210%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%2220%22%20x2%3D%2212%22%20y2%3D%224%22%2F%3E%3Cline%20x1%3D%226%22%20y1%3D%2220%22%20x2%3D%226%22%20y2%3D%2214%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2218%22%20y1%3D%2220%22%20x2%3D%2218%22%20y2%3D%2210%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%2220%22%20x2%3D%2212%22%20y2%3D%224%22%2F%3E%3Cline%20x1%3D%226%22%20y1%3D%2220%22%20x2%3D%226%22%20y2%3D%2214%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-trash,.fa-trash-o{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%223%206%205%206%2021%206%22%2F%3E%3Cpath%20d%3D%22M19%206v14a2%202%200%200%201-2%202H7a2%202%200%200%201-2-2V6m3%200V4a2%202%200%200%201%202-2h4a2%202%200%200%201%202%202v2%22%2F%3E%3Cline%20x1%3D%2210%22%20y1%3D%2211%22%20x2%3D%2210%22%20y2%3D%2217%22%2F%3E%3Cline%20x1%3D%2214%22%20y1%3D%2211%22%20x2%3D%2214%22%20y2%3D%2217%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%223%206%205%206%2021%206%22%2F%3E%3Cpath%20d%3D%22M19%206v14a2%202%200%200%201-2%202H7a2%202%200%200%201-2-2V6m3%200V4a2%202%200%200%201%202-2h4a2%202%200%200%201%202%202v2%22%2F%3E%3Cline%20x1%3D%2210%22%20y1%3D%2211%22%20x2%3D%2210%22%20y2%3D%2217%22%2F%3E%3Cline%20x1%3D%2214%22%20y1%3D%2211%22%20x2%3D%2214%22%20y2%3D%2217%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-plus{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2212%22%20y1%3D%225%22%20x2%3D%2212%22%20y2%3D%2219%22%2F%3E%3Cline%20x1%3D%225%22%20y1%3D%2212%22%20x2%3D%2219%22%20y2%3D%2212%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2212%22%20y1%3D%225%22%20x2%3D%2212%22%20y2%3D%2219%22%2F%3E%3Cline%20x1%3D%225%22%20y1%3D%2212%22%20x2%3D%2219%22%20y2%3D%2212%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-floppy-o,.fa-save{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M19%2021H5a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h11l5%205v11a2%202%200%200%201-2%202z%22%2F%3E%3Cpolyline%20points%3D%2217%2021%2017%2013%207%2013%207%2021%22%2F%3E%3Cpolyline%20points%3D%227%203%207%208%2015%208%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M19%2021H5a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h11l5%205v11a2%202%200%200%201-2%202z%22%2F%3E%3Cpolyline%20points%3D%2217%2021%2017%2013%207%2013%207%2021%22%2F%3E%3Cpolyline%20points%3D%227%203%207%208%2015%208%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-arrow-left{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2219%22%20y1%3D%2212%22%20x2%3D%225%22%20y2%3D%2212%22%2F%3E%3Cpolyline%20points%3D%2212%2019%205%2012%2012%205%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2219%22%20y1%3D%2212%22%20x2%3D%225%22%20y2%3D%2212%22%2F%3E%3Cpolyline%20points%3D%2212%2019%205%2012%2012%205%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-arrow-right{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%225%22%20y1%3D%2212%22%20x2%3D%2219%22%20y2%3D%2212%22%2F%3E%3Cpolyline%20points%3D%2212%205%2019%2012%2012%2019%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%225%22%20y1%3D%2212%22%20x2%3D%2219%22%20y2%3D%2212%22%2F%3E%3Cpolyline%20points%3D%2212%205%2019%2012%2012%2019%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-print{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%206%202%2018%202%2018%209%22%2F%3E%3Cpath%20d%3D%22M6%2018H4a2%202%200%200%201-2-2v-5a2%202%200%200%201%202-2h16a2%202%200%200%201%202%202v5a2%202%200%200%201-2%202h-2%22%2F%3E%3Crect%20x%3D%226%22%20y%3D%2214%22%20width%3D%2212%22%20height%3D%228%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%206%202%2018%202%2018%209%22%2F%3E%3Cpath%20d%3D%22M6%2018H4a2%202%200%200%201-2-2v-5a2%202%200%200%201%202-2h16a2%202%200%200%201%202%202v5a2%202%200%200%201-2%202h-2%22%2F%3E%3Crect%20x%3D%226%22%20y%3D%2214%22%20width%3D%2212%22%20height%3D%228%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-search{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%228%22%2F%3E%3Cline%20x1%3D%2221%22%20y1%3D%2221%22%20x2%3D%2216.65%22%20y2%3D%2216.65%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%228%22%2F%3E%3Cline%20x1%3D%2221%22%20y1%3D%2221%22%20x2%3D%2216.65%22%20y2%3D%2216.65%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-calendar,.fa-calendar-o{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22%20ry%3D%222%22%2F%3E%3Cline%20x1%3D%2216%22%20y1%3D%222%22%20x2%3D%2216%22%20y2%3D%226%22%2F%3E%3Cline%20x1%3D%228%22%20y1%3D%222%22%20x2%3D%228%22%20y2%3D%226%22%2F%3E%3Cline%20x1%3D%223%22%20y1%3D%2210%22%20x2%3D%2221%22%20y2%3D%2210%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22%20ry%3D%222%22%2F%3E%3Cline%20x1%3D%2216%22%20y1%3D%222%22%20x2%3D%2216%22%20y2%3D%226%22%2F%3E%3Cline%20x1%3D%228%22%20y1%3D%222%22%20x2%3D%228%22%20y2%3D%226%22%2F%3E%3Cline%20x1%3D%223%22%20y1%3D%2210%22%20x2%3D%2221%22%20y2%3D%2210%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-refresh,.fa-repeat,.fa-rotate-right{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%2223%204%2023%2010%2017%2010%22%2F%3E%3Cpolyline%20points%3D%221%2020%201%2014%207%2014%22%2F%3E%3Cpath%20d%3D%22M3.51%209a9%209%200%200%201%2014.85-3.36L23%2010M1%2014l4.64%204.36A9%209%200%200%200%2020.49%2015%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%2223%204%2023%2010%2017%2010%22%2F%3E%3Cpolyline%20points%3D%221%2020%201%2014%207%2014%22%2F%3E%3Cpath%20d%3D%22M3.51%209a9%209%200%200%201%2014.85-3.36L23%2010M1%2014l4.64%204.36A9%209%200%200%200%2020.49%2015%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-file,.fa-file-excel-o,.fa-file-o,.fa-file-pdf-o,.fa-file-text,.fa-file-text-o,.fa-file-word-o{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%2F%3E%3Cpolyline%20points%3D%2214%202%2014%208%2020%208%22%2F%3E%3Cline%20x1%3D%2216%22%20y1%3D%2213%22%20x2%3D%228%22%20y2%3D%2213%22%2F%3E%3Cline%20x1%3D%2216%22%20y1%3D%2217%22%20x2%3D%228%22%20y2%3D%2217%22%2F%3E%3Cpolyline%20points%3D%2210%209%209%209%208%209%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%22%2F%3E%3Cpolyline%20points%3D%2214%202%2014%208%2020%208%22%2F%3E%3Cline%20x1%3D%2216%22%20y1%3D%2213%22%20x2%3D%228%22%20y2%3D%2213%22%2F%3E%3Cline%20x1%3D%2216%22%20y1%3D%2217%22%20x2%3D%228%22%20y2%3D%2217%22%2F%3E%3Cpolyline%20points%3D%2210%209%209%209%208%209%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-eye{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M1%2012s4-8%2011-8%2011%208%2011%208-4%208-11%208-11-8-11-8z%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%223%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M1%2012s4-8%2011-8%2011%208%2011%208-4%208-11%208-11-8-11-8z%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%223%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-edit,.fa-pencil,.fa-pencil-square,.fa-pencil-square-o{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M17%203a2.828%202.828%200%201%201%204%204L7.5%2020.5%202%2022l1.5-5.5L17%203z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M17%203a2.828%202.828%200%201%201%204%204L7.5%2020.5%202%2022l1.5-5.5L17%203z%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-list,.fa-list-ol,.fa-list-ul{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%228%22%20y1%3D%226%22%20x2%3D%2221%22%20y2%3D%226%22%2F%3E%3Cline%20x1%3D%228%22%20y1%3D%2212%22%20x2%3D%2221%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%228%22%20y1%3D%2218%22%20x2%3D%2221%22%20y2%3D%2218%22%2F%3E%3Cline%20x1%3D%223%22%20y1%3D%226%22%20x2%3D%223.01%22%20y2%3D%226%22%2F%3E%3Cline%20x1%3D%223%22%20y1%3D%2212%22%20x2%3D%223.01%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%223%22%20y1%3D%2218%22%20x2%3D%223.01%22%20y2%3D%2218%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%228%22%20y1%3D%226%22%20x2%3D%2221%22%20y2%3D%226%22%2F%3E%3Cline%20x1%3D%228%22%20y1%3D%2212%22%20x2%3D%2221%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%228%22%20y1%3D%2218%22%20x2%3D%2221%22%20y2%3D%2218%22%2F%3E%3Cline%20x1%3D%223%22%20y1%3D%226%22%20x2%3D%223.01%22%20y2%3D%226%22%2F%3E%3Cline%20x1%3D%223%22%20y1%3D%2212%22%20x2%3D%223.01%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%223%22%20y1%3D%2218%22%20x2%3D%223.01%22%20y2%3D%2218%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-user,.fa-user-circle,.fa-user-circle-o,.fa-user-o{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%2021v-2a4%204%200%200%200-4-4H8a4%204%200%200%200-4%204v2%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%227%22%20r%3D%224%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%2021v-2a4%204%200%200%200-4-4H8a4%204%200%200%200-4%204v2%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%227%22%20r%3D%224%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-angle-down,.fa-caret-down,.fa-chevron-down{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%226%209%2012%2015%2018%209%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-angle-up,.fa-caret-up,.fa-chevron-up{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%2218%2015%2012%209%206%2015%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%2218%2015%2012%209%206%2015%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-angle-right,.fa-caret-right,.fa-chevron-right{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%229%2018%2015%2012%209%206%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%229%2018%2015%2012%209%206%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-angle-left,.fa-caret-left,.fa-chevron-left{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%2215%2018%209%2012%2015%206%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%2215%2018%209%2012%2015%206%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-exclamation-circle,.fa-exclamation-triangle,.fa-warning{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%228%22%20x2%3D%2212%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%2216%22%20x2%3D%2212.01%22%20y2%3D%2216%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%228%22%20x2%3D%2212%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%2216%22%20x2%3D%2212.01%22%20y2%3D%2216%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-download{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%2015v4a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2v-4%22%2F%3E%3Cpolyline%20points%3D%227%2010%2012%2015%2017%2010%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%2215%22%20x2%3D%2212%22%20y2%3D%223%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%2015v4a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2v-4%22%2F%3E%3Cpolyline%20points%3D%227%2010%2012%2015%2017%2010%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%2215%22%20x2%3D%2212%22%20y2%3D%223%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-upload{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%2015v4a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2v-4%22%2F%3E%3Cpolyline%20points%3D%2217%208%2012%203%207%208%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%223%22%20x2%3D%2212%22%20y2%3D%2215%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%2015v4a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2v-4%22%2F%3E%3Cpolyline%20points%3D%2217%208%2012%203%207%208%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%223%22%20x2%3D%2212%22%20y2%3D%2215%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-check-square,.fa-check-square-o{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%229%2011%2012%2014%2022%204%22%2F%3E%3Cpath%20d%3D%22M21%2012v7a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h11%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%229%2011%2012%2014%2022%204%22%2F%3E%3Cpath%20d%3D%22M21%2012v7a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h11%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-plus-square,.fa-plus-square-o{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22%20ry%3D%222%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%228%22%20x2%3D%2212%22%20y2%3D%2216%22%2F%3E%3Cline%20x1%3D%228%22%20y1%3D%2212%22%20x2%3D%2216%22%20y2%3D%2212%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22%20ry%3D%222%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%228%22%20x2%3D%2212%22%20y2%3D%2216%22%2F%3E%3Cline%20x1%3D%228%22%20y1%3D%2212%22%20x2%3D%2216%22%20y2%3D%2212%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-check{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%2220%206%209%2017%204%2012%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%2220%206%209%2017%204%2012%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-close,.fa-remove,.fa-times,.fa-times-circle,.fa-times-circle-o{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2218%22%20y1%3D%226%22%20x2%3D%226%22%20y2%3D%2218%22%2F%3E%3Cline%20x1%3D%226%22%20y1%3D%226%22%20x2%3D%2218%22%20y2%3D%2218%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2218%22%20y1%3D%226%22%20x2%3D%226%22%20y2%3D%2218%22%2F%3E%3Cline%20x1%3D%226%22%20y1%3D%226%22%20x2%3D%2218%22%20y2%3D%2218%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-thumbs-o-up,.fa-thumbs-up{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14%209V5a3%203%200%200%200-3-3l-4%209v11h11.28a2%202%200%200%200%202-1.7l1.38-9a2%202%200%200%200-2-2.3zM7%2022H4a2%202%200%200%201-2-2v-7a2%202%200%200%201%202-2h3%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14%209V5a3%203%200%200%200-3-3l-4%209v11h11.28a2%202%200%200%200%202-1.7l1.38-9a2%202%200%200%200-2-2.3zM7%2022H4a2%202%200%200%201-2-2v-7a2%202%200%200%201%202-2h3%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-ban{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%2F%3E%3Cline%20x1%3D%224.93%22%20y1%3D%224.93%22%20x2%3D%2219.07%22%20y2%3D%2219.07%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%2F%3E%3Cline%20x1%3D%224.93%22%20y1%3D%224.93%22%20x2%3D%2219.07%22%20y2%3D%2219.07%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-paper-plane,.fa-paper-plane-o,.fa-send{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2222%22%20y1%3D%222%22%20x2%3D%2211%22%20y2%3D%2213%22%2F%3E%3Cpolygon%20points%3D%2222%202%2015%2022%2011%2013%202%209%2022%202%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2222%22%20y1%3D%222%22%20x2%3D%2211%22%20y2%3D%2213%22%2F%3E%3Cpolygon%20points%3D%2222%202%2015%2022%2011%2013%202%209%2022%202%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-key{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%202l-2%202m-7.61%207.61a5.5%205.5%200%201%201-7.778%207.778%205.5%205.5%200%200%201%207.777-7.777zm0%200L15.5%207.5m0%200l3%203L22%207l-3-3m-3.5%203.5L19%204%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%202l-2%202m-7.61%207.61a5.5%205.5%200%201%201-7.778%207.778%205.5%205.5%200%200%201%207.777-7.777zm0%200L15.5%207.5m0%200l3%203L22%207l-3-3m-3.5%203.5L19%204%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-clock,.fa-clock-o,.fa-history{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%2F%3E%3Cpolyline%20points%3D%2212%206%2012%2012%2016%2014%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22%2F%3E%3Cpolyline%20points%3D%2212%206%2012%2012%2016%2014%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-undo{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%221%204%201%2010%207%2010%22%2F%3E%3Cpath%20d%3D%22M3.51%2015a9%209%200%201%200%202.13-9.36L1%2010%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolyline%20points%3D%221%204%201%2010%207%2010%22%2F%3E%3Cpath%20d%3D%22M3.51%2015a9%209%200%201%200%202.13-9.36L1%2010%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-bars,.fa-navicon,.fa-reorder{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%223%22%20y1%3D%2212%22%20x2%3D%2221%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%223%22%20y1%3D%226%22%20x2%3D%2221%22%20y2%3D%226%22%2F%3E%3Cline%20x1%3D%223%22%20y1%3D%2218%22%20x2%3D%2221%22%20y2%3D%2218%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%223%22%20y1%3D%2212%22%20x2%3D%2221%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%223%22%20y1%3D%226%22%20x2%3D%2221%22%20y2%3D%226%22%2F%3E%3Cline%20x1%3D%223%22%20y1%3D%2218%22%20x2%3D%2221%22%20y2%3D%2218%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-home{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%209l9-7%209%207v11a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2z%22%2F%3E%3Cpolyline%20points%3D%229%2022%209%2012%2015%2012%2015%2022%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%209l9-7%209%207v11a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2z%22%2F%3E%3Cpolyline%20points%3D%229%2022%209%2012%2015%2012%2015%2022%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-bell,.fa-bell-o{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M18%208A6%206%200%200%200%206%208c0%207-3%209-3%209h18s-3-2-3-9%22%2F%3E%3Cpath%20d%3D%22M13.73%2021a2%202%200%200%201-3.46%200%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M18%208A6%206%200%200%200%206%208c0%207-3%209-3%209h18s-3-2-3-9%22%2F%3E%3Cpath%20d%3D%22M13.73%2021a2%202%200%200%201-3.46%200%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-volume-up{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolygon%20points%3D%2211%205%206%209%202%209%202%2015%206%2015%2011%2019%2011%205%22%2F%3E%3Cpath%20d%3D%22M19.07%204.93a10%2010%200%200%201%200%2014.14M15.54%208.46a5%205%200%200%201%200%207.07%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpolygon%20points%3D%2211%205%206%209%202%209%202%2015%206%2015%2011%2019%2011%205%22%2F%3E%3Cpath%20d%3D%22M19.07%204.93a10%2010%200%200%201%200%2014.14M15.54%208.46a5%205%200%200%201%200%207.07%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-circle-o-notch,.fa-spinner{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2212%22%20y1%3D%222%22%20x2%3D%2212%22%20y2%3D%226%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%2218%22%20x2%3D%2212%22%20y2%3D%2222%22%2F%3E%3Cline%20x1%3D%224.93%22%20y1%3D%224.93%22%20x2%3D%227.76%22%20y2%3D%227.76%22%2F%3E%3Cline%20x1%3D%2216.24%22%20y1%3D%2216.24%22%20x2%3D%2219.07%22%20y2%3D%2219.07%22%2F%3E%3Cline%20x1%3D%222%22%20y1%3D%2212%22%20x2%3D%226%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%2218%22%20y1%3D%2212%22%20x2%3D%2222%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%224.93%22%20y1%3D%2219.07%22%20x2%3D%227.76%22%20y2%3D%2216.24%22%2F%3E%3Cline%20x1%3D%2216.24%22%20y1%3D%227.76%22%20x2%3D%2219.07%22%20y2%3D%224.93%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cline%20x1%3D%2212%22%20y1%3D%222%22%20x2%3D%2212%22%20y2%3D%226%22%2F%3E%3Cline%20x1%3D%2212%22%20y1%3D%2218%22%20x2%3D%2212%22%20y2%3D%2222%22%2F%3E%3Cline%20x1%3D%224.93%22%20y1%3D%224.93%22%20x2%3D%227.76%22%20y2%3D%227.76%22%2F%3E%3Cline%20x1%3D%2216.24%22%20y1%3D%2216.24%22%20x2%3D%2219.07%22%20y2%3D%2219.07%22%2F%3E%3Cline%20x1%3D%222%22%20y1%3D%2212%22%20x2%3D%226%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%2218%22%20y1%3D%2212%22%20x2%3D%2222%22%20y2%3D%2212%22%2F%3E%3Cline%20x1%3D%224.93%22%20y1%3D%2219.07%22%20x2%3D%227.76%22%20y2%3D%2216.24%22%2F%3E%3Cline%20x1%3D%2216.24%22%20y1%3D%227.76%22%20x2%3D%2219.07%22%20y2%3D%224.93%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-ellipsis-v{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%221%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%225%22%20r%3D%221%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2219%22%20r%3D%221%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%221%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%225%22%20r%3D%221%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2219%22%20r%3D%221%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-ellipsis-h{display:inline-block;width:1em;height:1em;vertical-align:-0.125em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%221%22%2F%3E%3Ccircle%20cx%3D%2219%22%20cy%3D%2212%22%20r%3D%221%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2212%22%20r%3D%221%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%221%22%2F%3E%3Ccircle%20cx%3D%2219%22%20cy%3D%2212%22%20r%3D%221%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%2212%22%20r%3D%221%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;}
.fa-spin{animation:fa-spin 1.6s linear infinite;}
@keyframes fa-spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
.navbar-dhealth #mainmenu .fa,#navbar-second .fa{width:1.15em;height:1.15em;}


/* ===== MOBILE TOP-NAVBAR HEADER FIX (single clean row) ===== */
@media(max-width:991px){
  .navbar-dhealth .navbar-header{
    display:flex !important;align-items:center !important;flex-wrap:nowrap !important;
    gap:10px;padding:8px 14px !important;width:100% !important;min-height:56px;
  }
  /* logo: drop the absolute positioning from inline style, make it a normal inline box */
  .navbar-dhealth .navbar-header .navbar-logo{
    position:static !important;width:auto !important;height:auto !important;
    flex:0 0 auto;display:flex;align-items:center;margin:0 !important;
  }
  .navbar-dhealth .navbar-header .navbar-logo img,
  .site-index .navbar-header .navbar-logo img{
    position:static !important;top:auto !important;left:auto !important;transform:none !important;
    max-width:34px !important;max-height:34px !important;width:auto !important;height:auto !important;
  }
  /* title fills the middle, truncates instead of wrapping */
  .navbar-dhealth .navbar-header .navbar-title{
    flex:1 1 auto;min-width:0;display:flex;align-items:center;margin:0 !important;
  }
  .navbar-dhealth .navbar-header .navbar-title .rs-title{
    margin:0 !important;font-size:16px !important;line-height:1.2;font-weight:700;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  /* right cluster: notifications + user on one row, vertically centred */
  .navbar-dhealth .navbar-header .navbar-list{flex:0 0 auto;margin-left:auto;}
  .navbar-dhealth .navbar-header .navbar-list .navbar-right{
    display:flex !important;align-items:center;gap:2px;margin:0 !important;float:none !important;padding:0 !important;
  }
  .navbar-dhealth .navbar-header .navbar-list .navbar-right > li{
    float:none !important;display:flex !important;align-items:center;position:relative;
  }
  .navbar-dhealth .navbar-header .navbar-list .navbar-right > li > a{
    display:flex !important;align-items:center;gap:6px;padding:8px 8px !important;line-height:1;
  }
  /* notification badge: small inline pill next to the bell (not stacked below) */
  .navbar-dhealth .navbar-header .navbar-right .notifications-menu > a .label{
    position:static !important;margin:0 0 0 2px !important;font-size:10px;padding:2px 6px;border-radius:10px;line-height:1;
  }
  /* user dropdown: icon + name + caret inline; ellipsize long names */
  .navbar-dhealth .dropdown-user > a > span{
    max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  /* keep dropdowns anchored to the right edge so they don't overflow the screen */
  .navbar-dhealth .navbar-header .navbar-right .dropdown-menu{right:0;left:auto;}
}
@media(max-width:480px){
  /* on very small phones hide the username text, keep icon + caret to save room */
  .navbar-dhealth .dropdown-user > a > span{display:none !important;}
  .navbar-dhealth .navbar-header .navbar-title .rs-title{font-size:15px !important;}
}


/* ===== MOBILE SECOND-NAVBAR (module menu bar) FIX ===== */
@media(max-width:991px){
  #navbar-second .second-navbar{
    display:flex !important;align-items:center;flex-wrap:wrap;gap:6px;
    padding:6px 14px !important;min-height:50px;
  }
  /* redundant brand on mobile (top bar already shows it) */
  #navbar-second .navbar-logo{display:none !important;}
  /* hamburger (module-menu toggle) pinned left */
  #navbar-second .left-navbar{order:1;flex:0 0 auto;padding:0 !important;}
  #navbar-second .left-navbar .navbar-toggler.side-button{
    display:inline-flex !important;align-items:center;justify-content:center;
    margin:0;padding:7px 11px;border:1px solid var(--dh-line2);border-radius:9px;background:#fff;
  }
  /* Menu Utama + room selector grouped at the right, single line each */
  #navbar-second .right-navbar{order:2;margin-left:auto;flex:0 1 auto;border:0 !important;padding:0 !important;margin-top:0 !important;}
  #navbar-second .right-navbar .nav.navbar-right{
    display:flex !important;align-items:center;justify-content:flex-end;gap:4px;
    margin:0 !important;float:none !important;flex-wrap:nowrap;
  }
  #navbar-second .right-navbar .nav.navbar-right > li{float:none !important;margin:0 !important;}
  #navbar-second .right-navbar .nav.navbar-right > li > a{
    display:flex !important;align-items:center;gap:5px;padding:8px 10px !important;
    white-space:nowrap;color:#475467 !important;border-radius:9px;font-weight:500;
  }
  /* collapsed module menu drops full-width below the bar when toggled open */
  #navbar-second .navbar-collapse{order:3;flex:0 0 100%;width:100%;padding:0 !important;}
  #navbar-second #mainmenu{width:100%;}
  #navbar-second #mainmenu > li{width:100%;float:none !important;}
  #navbar-second #mainmenu > li > a{
    display:flex;align-items:center;gap:10px;padding:11px 8px;color:#475467 !important;border-radius:9px;
  }
  #navbar-second #mainmenu > li > a:hover,#navbar-second #mainmenu > li.open > a{
    background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;
  }
}


/* ===== Popup ruangan/workspace: feather icon (match launcher card) ===== */
.list-room .dh-room-ic{margin:0;width:58px;height:58px;border-radius:17px;background:var(--dh-primary-t);display:flex;align-items:center;justify-content:center;color:var(--dh-primary-d);transition:.15s;flex:0 0 auto;}
.list-room .dh-room-ic svg{width:29px;height:29px;}
@media(max-width:600px){ .list-room .dh-room-ic{width:50px;height:50px;} }
.list-room .list-room-min{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;min-height:138px;height:100%;padding:22px 12px;border:1px solid var(--dh-line2);border-radius:16px;background:#fff;box-shadow:var(--dh-shadow);cursor:pointer;transition:transform .15s,box-shadow .15s,border-color .15s;}
.list-room .list-room-min h7,.list-room .list-room-min h6,.list-room .list-room-min h8{display:block;margin:0 !important;text-align:center;line-height:1.25;font-size:13px;font-weight:600;color:var(--dh-ink) !important;}
.list-room .list-room-min:hover{border-color:var(--dh-primary);box-shadow:0 12px 26px -12px var(--dh-primary);transform:translateY(-3px);}
.list-room .list-room-min:hover .dh-room-ic{background:var(--dh-primary);color:#fff;}


/* ===== Popup ruangan: center the room cards within the modal ===== */
.cr-main.module-selection,.module-selection{
  display:flex !important;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:14px;width:100%;
}
.module-selection .list-room{
  float:none !important;width:160px !important;max-width:160px;padding:0 !important;margin:0 !important;
}

/* Popup container fits content (no clipping when many rooms); stays centered via translate */
#newsimrsCaraousel .carousel-inner{height:auto !important;max-height:88vh !important;overflow-y:auto !important;overflow-x:hidden !important;}
#newsimrsCaraousel .item{height:auto !important;}
.module-selection{height:auto !important;overflow:visible !important;}


/* ===== Popup modal (room picker) — redesigned background box ===== */
#newsimrsCaraousel{background:rgba(13,24,43,.48) !important;z-index:1050 !important;
  -webkit-backdrop-filter:saturate(120%) blur(2px);backdrop-filter:saturate(120%) blur(2px);}
#newsimrsCaraousel .carousel-inner{
  width:min(92vw,640px) !important;
  background:#fff !important;
  border:1px solid var(--dh-line2) !important;
  border-radius:22px !important;
  box-shadow:0 30px 70px -24px rgba(13,24,43,.45),0 10px 28px -14px rgba(13,24,43,.25) !important;
}
#newsimrsCaraousel .item{padding:26px 28px 34px !important;}
#newsimrsCaraousel .item br{display:none !important;}
#newsimrsCaraousel h3{font-size:20px !important;font-weight:700 !important;color:var(--dh-ink) !important;
  margin:2px 0 4px !important;text-align:center;}
#newsimrsCaraousel .module-selection{margin-top:20px;padding-bottom:4px;}
/* close button -> rounded teal */
#newsimrsCaraousel .close-carousel{
  position:absolute !important;top:14px;right:14px;width:34px;height:34px;border-radius:10px;
  display:flex !important;align-items:center;justify-content:center;
  background:var(--dh-primary-t);color:var(--dh-primary-d) !important;font-size:15px;line-height:1;
  cursor:pointer;opacity:1;z-index:5;transition:.15s;margin:0 !important;}
#newsimrsCaraousel .close-carousel:hover{background:var(--dh-primary);color:#fff !important;}


/* Popup modal — tighter spacing on phones so 2 room-cards fit per row */
@media(max-width:600px){
  #newsimrsCaraousel .carousel-inner{width:94vw !important;}
  #newsimrsCaraousel .item{padding:22px 14px 26px !important;}
  #newsimrsCaraousel .module-selection{gap:10px !important;margin-top:16px;}
  #newsimrsCaraousel .module-selection .list-room{width:150px !important;max-width:150px;}
  #newsimrsCaraousel .list-room .list-room-min{min-height:130px;padding:18px 10px;}
}

\n/* ============================================================\n   DHEALTH KIOSK / DISPLAY / PRINT — APPEND ONLY\n   Requires dhealth-v2.css tokens loaded first.\n   Scoped to kiosk/display classes; does NOT redefine globals.\n   NOTE: global already defines .site-index .btn-more/.btn-less — not redefined here.\n   NOTE: add class=\"dh-display\" to modules/antrian/views/layouts/display-antrian.php <body>.\n   ============================================================ */\n\n/* ---------- 1. Kiosk page shell ---------- */\n.login-container .site-index{max-width:1080px;margin:0 auto;padding:24px 16px}\nbody.login-container .content-wrapper{background:var(--dh-bg) !important;color:var(--dh-ink)}\n.content-wrapper .content-header-title{color:var(--dh-ink) !important;font-weight:600;letter-spacing:.02em}\n.content-wrapper .content-header a{color:var(--dh-primary) !important}\n\n/* picker container card (service pickers / launcher sections) */\n.site-index .data-module{\n  max-width:1100px;margin:24px auto;background:var(--dh-surface);\n  border:1px solid var(--dh-line2);border-radius:20px;box-shadow:var(--dh-shadow);\n  padding:28px 28px 18px}\n.site-index .data-module h2.content-group{font-size:24px;font-weight:600;color:var(--dh-ink);letter-spacing:-.01em;margin:0 0 4px}\n.site-index .data-module h5.content-group{font-size:14px;font-weight:600;color:var(--dh-muted);text-transform:uppercase;letter-spacing:.04em}\n\n/* ---------- 2. Launcher tiles (ambil-antrian index) ---------- */\n.site-index .list-antrian{padding:10px}\n.site-index .list-antrian .panel{\n  padding:28px 18px !important;border:1px solid var(--dh-line2) !important;\n  border-radius:20px !important;box-shadow:var(--dh-shadow) !important;\n  background:var(--dh-surface) !important;cursor:pointer;\n  transition:transform .15s,box-shadow .15s,border-color .15s}\n.site-index .list-antrian .panel:hover{\n  border-color:var(--dh-primary) !important;\n  box-shadow:0 14px 30px -14px var(--dh-primary) !important;transform:translateY(-3px)}\n.site-index .list-antrian .panel img{\n  width:72px !important;height:72px !important;object-fit:contain;padding:14px;\n  border-radius:18px !important;background:var(--dh-primary-t) !important;border:0 !important;box-shadow:none}\n.site-index .jenis-antrian{color:var(--dh-ink) !important;font-weight:600;font-size:15px;margin:14px 0 4px !important;line-height:1.3}\n\n/* prev/next arrow links -> pill buttons */\n.site-index .arrow a,\n.site-index .data-module .row.pd-20 .col-sm-4 a[role=\"button\"]{\n  display:inline-flex !important;align-items:center;gap:6px;\n  color:var(--dh-primary) !important;font-weight:600;font-size:13px;\n  background:var(--dh-primary-t);border:1px solid var(--dh-line2);\n  border-radius:999px;padding:8px 16px;text-decoration:none;transition:.15s}\n.site-index .arrow a:hover,\n.site-index .data-module .row.pd-20 .col-sm-4 a[role=\"button\"]:hover{background:var(--dh-primary);color:#fff !important}\n\n/* header collapse toggles */\n.site-index .hd-up,.site-index .hd-down,.hd-up,.hd-down{color:var(--dh-muted) !important;cursor:pointer}\n.hd-up:hover,.hd-down:hover{color:var(--dh-primary) !important}\n\n/* ---------- 3. Selection cards (pendaftaran/bpjs poli + service plans) ---------- */\n.content-wrapper .card,\n.modal-content .card-carabayar{\n  border:1px solid var(--dh-line2);border-radius:18px;box-shadow:var(--dh-shadow);background:var(--dh-surface)}\n.content-wrapper .card:hover{background:var(--dh-primary-t);border-color:var(--dh-primary)}\n.content-wrapper .card.active{background:var(--dh-primary-t) !important;border-color:var(--dh-primary)}\n.content-wrapper .card .nama,\n.content-wrapper .card .title-card{color:var(--dh-ink) !important}\n.content-wrapper .card .icon-chevron{color:var(--dh-primary) !important}\n.content-wrapper .card .quota .sisa-kuota{color:var(--dh-warn) !important}\n.content-wrapper .card-row > img{width:56px;height:56px;padding:10px;border-radius:14px;background:var(--dh-primary-t);box-sizing:content-box}\n\n/* radio-style service plan cards (lbl-on-cb / lbl-on) */\n.plan .lbl-on-cb,.plan .lbl-on{\n  background:var(--dh-primary-t);color:var(--dh-primary-d);\n  border:1px solid var(--dh-line2);border-radius:18px;box-shadow:var(--dh-shadow);padding:26px 18px;\n  transition:transform .15s,box-shadow .15s,border-color .15s}\n.plan .lbl-on-cb h4,.plan .lbl-on h4{color:var(--dh-primary-d);font-weight:600;margin:0}\n.plan .lbl-on-cb:hover,.plan .lbl-on:hover{\n  border-color:var(--dh-primary);box-shadow:0 10px 24px -10px var(--dh-primary);transform:translateY(-2px)}\n.plan input:checked + .lbl-on-cb,\n.plan input:checked + .lbl-on{background:var(--dh-primary);border-color:var(--dh-primary);color:#fff}\n.plan input:checked + .lbl-on-cb h4,\n.plan input:checked + .lbl-on h4{color:#fff}\n.plan input:checked + label:after{background:var(--dh-primary-d);border:0;box-shadow:0 2px 6px rgba(13,24,43,.25)}\n\n/* closed / disabled */\n.plan .lbl-off{background:var(--dh-danger-t);color:var(--dh-danger);border:1px solid #f5c2c2;border-radius:18px;box-shadow:var(--dh-shadow);padding:26px 18px}\n.plan .lbl-off h4{color:var(--dh-danger)}\n.opt-poly.is_disabled{opacity:.55}\n.opt-poly.is_disabled .lbl-on,.opt-poly.is_disabled .lbl-off{cursor:not-allowed}\n\n/* ---------- 4. Status pills ---------- */\n.label-btn-buka{background:var(--dh-ok-t);color:var(--dh-ok);border-radius:999px;border:0;padding:3px 12px;font-size:11px;letter-spacing:.04em}\n.label-btn-tutup{background:var(--dh-danger-t);color:var(--dh-danger);border-radius:999px;border:0;padding:3px 12px;font-size:11px;letter-spacing:.04em}\n.label-btn-penuh{background:var(--dh-warn-t);color:var(--dh-warn);border-radius:999px;border:0;padding:3px 12px;font-size:11px;letter-spacing:.04em}\n.split-card-antrian-on,.split-card-antrian-off{border-top:1px solid var(--dh-line)}\n\n/* ---------- 5. Buttons ---------- */\n.site-index .list-antrian .btn-info,\n.site-index .btn-layar,.site-index .btn-kembali,\n.content-wrapper .card button.btn-primary,\n.content-wrapper .button-print,\n.modal-content .btn-next{\n  background:var(--dh-primary) !important;border:0 !important;color:#fff !important;\n  border-radius:12px;padding:11px 22px;font-weight:600;font-size:14px;\n  box-shadow:0 8px 18px -8px var(--dh-primary)}\n.site-index .list-antrian .btn-info:hover,\n.site-index .btn-layar:hover,.site-index .btn-kembali:hover,\n.content-wrapper .card button.btn-primary:hover,\n.content-wrapper .button-print:hover,\n.modal-content .btn-next:hover{background:var(--dh-primary-d) !important}\n.site-index .btn-antrian{background:var(--dh-surface) !important;border:1px solid var(--dh-line2) !important;color:#344054 !important;border-radius:12px;padding:11px 22px;font-weight:600}\n.content-wrapper .button-print{border-radius:10px}\n.content-wrapper .card-checked{background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;border-radius:50%}\n\n/* big call-to-action / wizard tiles (btn3d, raised, btn-huge, btn-info kiosk) */\n.modal-body .btn3d,\n.box-antrian .btn.raised,.plan label.btn.raised,\na.btn3d,.text-center a.btn-info.btn-lg{\n  background:var(--dh-primary-t) !important;border:1px solid var(--dh-line2) !important;\n  color:var(--dh-primary-d) !important;border-radius:18px !important;\n  box-shadow:var(--dh-shadow) !important;transition:transform .15s,box-shadow .15s}\n.modal-body .btn3d:hover,\n.box-antrian .btn.raised:hover,.plan label.btn.raised:hover,\na.btn3d:hover,.text-center a.btn-info.btn-lg:hover{\n  border-color:var(--dh-primary) !important;box-shadow:0 10px 24px -10px var(--dh-primary) !important;transform:translateY(-2px)}\n.modal-body .btn3d h2,.modal-body .btn3d .text-black,\na.btn3d h2,.text-center a.btn-info.btn-lg h2{color:var(--dh-primary-d) !important;font-weight:700}\n.plan label .badge.bg-pink{background:var(--dh-primary) !important;color:#fff !important;border-radius:999px}\n\n/* clock chip */\n#clock1{background:var(--dh-primary-t);color:var(--dh-primary-d);border-radius:999px;padding:6px 16px;font-weight:600}\n\n/* ---------- 6. Back button (replace arrow-left.png) ---------- */\n.content-wrapper .wrapper-back-button a{\n  width:44px;height:44px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;\n  background:var(--dh-primary-t);border:1px solid var(--dh-line2);transition:background .15s}\n.content-wrapper .wrapper-back-button a:hover{background:#d7f0ed}\n.content-wrapper .wrapper-back-button a img{\n  width:18px !important;height:18px !important;\n  filter:invert(38%) sepia(86%) saturate(380%) hue-rotate(130deg)} /* tint arrow teal */\n\n/* ---------- 7. Headers / bands ---------- */\n.bgk-simrsdoco{\n  background:linear-gradient(135deg,var(--dh-primary),var(--dh-primary-d)) !important;\n  border-color:var(--dh-primary) !important;color:#fff !important}\n.bgk-simrsdoco h1,.bgk-simrsdoco h2{color:#fff !important}\n.title-antrian{color:var(--dh-ink) !important;letter-spacing:-.01em}\n.img-rs{border-right:1px solid rgba(255,255,255,.35)}\n.box-antrian.panel,\n.container-fluid > section.panel.box-antrian,\n.container-fluid > section.panel{\n  border:1px solid var(--dh-line2) !important;border-radius:var(--dh-radius) !important;\n  box-shadow:var(--dh-shadow) !important;overflow:hidden}\n.box-antrian .panel-body[style]{border-color:var(--dh-line2) !important} /* neutralize inline 10px #407e7a */\n.box-antrian .panel-footer{background:var(--dh-primary) !important;border-color:var(--dh-primary) !important}\n.box-antrian #default-antrian-btn.btn-huge,\n.box-antrian .btn-huge{background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;border-radius:14px;box-shadow:0 6px 14px -7px var(--dh-primary)}\n\n/* ---------- 8. Modal chrome ---------- */\n.modal-header.bg-inverse{background:var(--dh-surface) !important;color:var(--dh-ink) !important;border-bottom:1px solid var(--dh-line2) !important}\n.modal-header.bg-inverse .modal-title,.modal-content .modal-title{color:var(--dh-ink) !important;font-weight:600}\n.modal-content #nik{border:1px solid var(--dh-line2) !important;border-radius:9px !important}\n.modal-content #nik:focus{border-color:var(--dh-primary) !important;box-shadow:0 0 0 3px rgba(14,148,136,.15) !important}\n\n/* jQuery-Steps wizard */\n.wizard>.steps>ul>li.current>a,.wizard>.steps>ul>li.current>a:hover{background:var(--dh-primary) !important;color:#fff !important;border-radius:10px}\n.wizard>.steps>ul>li.done>a{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;border-radius:10px}\n.wizard>.actions>ul>li>a{background:var(--dh-primary) !important;border-radius:10px;color:#fff !important}\n\n/* ---------- 9. Kiosk service-screen extras ---------- */\n.content-screen{border:1px solid var(--dh-line2);border-bottom:3px solid var(--dh-primary);border-radius:16px}\n.big-icon{color:var(--dh-primary)}\n.content-link:hover{background:var(--dh-primary-t)}\n\n/* carousel controls (kiosk pickers) */\n.content-wrapper .carousel-control{box-shadow:var(--dh-shadow) !important;border:1px solid var(--dh-line2)}\n.content-wrapper .carousel-control i{color:var(--dh-primary)}\n.content-wrapper .carousel-indicators .active{background-color:var(--dh-primary);border-color:var(--dh-primary)}\n.content-wrapper .empty-state{background:var(--dh-bg);border:1px dashed var(--dh-line2);border-radius:18px}\n\n/* ============================================================\n   DISPLAY SCREENS (TV boards) — scoped under body.dh-display\n   ============================================================ */\nbody.dh-display{background:var(--dh-bg) !important;color:var(--dh-ink)}\nbody.dh-display[style*=\"background-image\"]{background-image:none !important;background:var(--dh-bg) !important}\n.dh-display .img-background{display:none !important}\n\n/* big called-number: orange/navy -> teal */\n.dh-display .prefix-color,\n.dh-display .nomer_panggil,.dh-display .nomer_panggil p,\n.dh-display .nomor-antrian,\n.dh-display .content-column-5,.dh-display .content-column-5-small,\n.dh-display .content-column-3-small-main{color:var(--dh-primary) !important}\n.dh-display .light-navy{color:var(--dh-ink) !important}\n.dh-display .dark-navy{color:var(--dh-primary-d) !important}\n\n/* poli doctor cards: replace card_antrian.png raster with token card */\n.dh-display .column-3-small-main{background:var(--dh-surface) !important;border:1px solid var(--dh-line2);border-radius:20px;box-shadow:var(--dh-shadow);overflow:hidden}\n.dh-display .column-3-small-main .img-responsive-hd{display:none !important}\n.dh-display .column-3-small-main .title-column-3-small-main{background:var(--dh-primary);color:#fff !important;border-radius:20px 20px 0 0;padding:.6vw 0}\n.dh-display .column-3-small-main .content-column-3-small-title{color:var(--dh-ink) !important}\n.dh-display .column-3-small-main .content-column-3-small-subtitle{color:var(--dh-muted) !important}\n\n/* farmasi: navy panels -> token cards, teal headers */\n.dh-display .border-antrian,.dh-display .card,.dh-display .card-dalam-proses{\n  border:1px solid var(--dh-line2) !important;border-radius:18px !important;\n  background:var(--dh-surface) !important;box-shadow:var(--dh-shadow) !important}\n.dh-display .wrapper-title,.dh-display .card-header,.dh-display .card-dalam-proses .card-header{\n  background:var(--dh-primary) !important;background-image:none !important; /* kills card-header-bg.png */\n  color:#fff !important;border:none !important;border-radius:18px 18px 0 0 !important}\n.dh-display .wrapper-title .title{color:#fff !important}\n.dh-display .table-dalam-proses,\n.dh-display .table-dalam-proses td,\n.dh-display .table-dalam-proses th{border-color:var(--dh-line2) !important;color:var(--dh-ink) !important}\n\n/* operasi schedule table: navy -> tokens, teal header */\n.dh-display .header-custom{background:var(--dh-primary) !important;background-image:none !important} /* kills panggil.png */\n.dh-display .header-custom th,.dh-display .header-custom .text-white{color:#fff !important}\n.dh-display .table > tbody > tr > td{color:var(--dh-ink) !important;border-color:var(--dh-line2) !important}\n\n/* display typography: legacy Helvetica -> theme font */\n.dh-display [class*=\"column-\"][class*=\"title\"],\n.dh-display [class*=\"column-\"][class*=\"content\"],\n.dh-display .nomer_panggil,.dh-display .title,.dh-display .header-dis-farmasi{\n  font-family:Roboto,system-ui,-apple-system,\"Segoe UI\",sans-serif !important}\n\n/* ============================================================\n   SHARED CHROME: top header, footer ticker, kamar board\n   ============================================================ */\n/* top header bar (navbar-antrian / navbar-fixed-top) */\n.navbar-fixed-top{background:var(--dh-surface) !important;color:var(--dh-ink) !important;box-shadow:var(--dh-shadow) !important;border-bottom:3px solid var(--dh-primary) !important}\n.navbar-fixed-top > img.img-responsive{display:none !important}\n.navbar-fixed-top .header-title{font-family:inherit !important;color:var(--dh-ink) !important;letter-spacing:-.01em !important;font-weight:700 !important}\n.navbar-fixed-top .header-subtitle{font-family:inherit !important;color:var(--dh-muted) !important;letter-spacing:.02em !important;font-weight:500 !important}\n\n/* display-kamar fixed header */\n.fixed-header{background:var(--dh-surface) !important;background-image:none !important;border-bottom:3px solid var(--dh-primary) !important;box-shadow:var(--dh-shadow) !important;font-family:inherit !important}\n.fixed-header .info .info-title{color:var(--dh-ink) !important;font-family:inherit !important;letter-spacing:-.01em !important}\n.fixed-header .info .info-subtitle{color:var(--dh-muted) !important;font-family:inherit !important;letter-spacing:.04em !important}\n\n/* footer ticker bar (single canonical treatment: surface + teal text) */\n.navbar-fixed-bottom{background:var(--dh-surface) !important;border-top:1px solid var(--dh-line2) !important;box-shadow:0 -1px 3px rgba(13,24,43,.05) !important}\n.navbar-fixed-bottom > img.img-responsive{display:none !important}\n.navbar-fixed-bottom .footer-time,.navbar-fixed-bottom .footer-date{color:var(--dh-ink) !important;font-family:inherit !important}\n.navbar-fixed-bottom .marquee,.marquee{color:var(--dh-primary-d) !important;font-family:inherit !important}\n.dis-footer{background:var(--dh-surface) !important;border-top:1px solid var(--dh-line2) !important}\n.marq-footer{color:var(--dh-primary-d) !important}\n\n/* bed-availability board */\n#dashboard-kamar{background:var(--dh-bg)}\n#dashboard-kamar:before{background-image:none !important;background:var(--dh-bg) !important}\n#dashboard-kamar .card{border:1px solid var(--dh-line2) !important;border-radius:18px !important;box-shadow:var(--dh-shadow) !important;background:var(--dh-surface) !important;overflow:hidden}\n#dashboard-kamar .card .card-header{background-image:none !important;background:linear-gradient(135deg,var(--dh-primary),var(--dh-primary-d)) !important;color:#fff !important;font-family:inherit !important;border-top-left-radius:18px !important;border-top-right-radius:18px !important}\n#dashboard-kamar .card .card-body h2.number{color:var(--dh-primary) !important;font-family:inherit !important}\n#dashboard-kamar .card .card-body h2.number.empty{color:#e03d3d !important} /* keep danger for 0 beds */\n#dashboard-kamar .card .card-body h4.text{color:var(--dh-muted) !important;font-family:inherit !important}\n#dashboard-kamar .carousel-indicators li{background-color:var(--dh-line2) !important;border-color:var(--dh-line2) !important}\n#dashboard-kamar .carousel-indicators .active{background-color:var(--dh-primary) !important;border-color:var(--dh-primary) !important}\n\n/* ============================================================\n   LEGACY KIOSK CLASSES (custom-style.scss / submodule.scss overrides)\n   ============================================================ */\n.isi-loket{border:1px solid var(--dh-primary) !important;border-radius:16px !important;box-shadow:var(--dh-shadow) !important;background:var(--dh-surface) !important}\n.isi-loket i{color:var(--dh-primary)}\n.login-loket{border:1px solid var(--dh-danger) !important;border-radius:16px !important;box-shadow:var(--dh-shadow) !important;background:var(--dh-surface) !important}\n.list-antrian div:hover,.list-loket div:hover,.list-room div:hover{background:var(--dh-primary-t) !important;color:var(--dh-ink) !important;box-shadow:var(--dh-shadow) !important;border-radius:16px}\n.cr-control,.cr-control-antrian{background:rgba(11,21,36,.45) !important;border-radius:14px}\n.cr-inner ::-webkit-scrollbar-thumb{background:var(--dh-primary) !important}\n.cr-inner ::-webkit-scrollbar-thumb:hover{background:var(--dh-primary-d) !important}\ninput:checked + .slider{background-color:var(--dh-primary) !important}\ninput:focus + .slider{box-shadow:0 0 0 3px rgba(14,148,136,.15) !important}\n\n/* ============================================================\n   PRINT SLIPS (on-screen preview themed; paper minimal)\n   ============================================================ */\nbody .cetak{border:1px solid var(--dh-line2) !important;border-radius:18px !important;box-shadow:var(--dh-shadow) !important;background:var(--dh-surface) !important;padding:18px 16px;font-family:\"Helvetica Neue\",Arial,sans-serif;color:var(--dh-ink)}\nbody .cetak .top-date{color:var(--dh-muted)}\nbody .cetak .text-no-antrian,body .cetak .no-antrian,body .cetak .no-antrian-poli{color:var(--dh-ink) !important;font-weight:700;letter-spacing:-.02em}\nbody .cetak .info-header,body .cetak .label-bottom,body .cetak .label-bottom-text{border-color:var(--dh-line2) !important}\nbody .button-home{background:var(--dh-primary) !important;border-radius:999px !important;box-shadow:0 6px 14px -7px var(--dh-primary);color:#fff;transition:background .15s,transform .12s}\nbody .button-home:hover{background:var(--dh-primary-d) !important;opacity:1 !important;transform:translateY(-1px)}\nbody .button-home .big-icon,body .button-home i{color:#fff !important}\n@media print{\n  body .cetak{border:none !important;border-radius:0 !important;box-shadow:none !important;padding:0 !important}\n}\n\n/* ============================================================\n   OPTIONAL: coba.php chat (only if kept)\n   ============================================================ */\n.box.box-success{border:1px solid var(--dh-line2) !important;border-radius:var(--dh-radius) !important;box-shadow:var(--dh-shadow) !important}\n.box.box-success>.box-header{background:var(--dh-surface) !important;border-bottom:1px solid var(--dh-line2) !important;color:var(--dh-ink) !important}\n.chat .me{background:var(--dh-primary) !important;color:#fff !important;border-radius:12px !important}\n.chat .friend{background:var(--dh-primary-t) !important;color:var(--dh-ink) !important;border-radius:12px !important}\n
/* Kiosk card icon tile (ambil-antrian) — larger feather tile */
.site-index .dh-kiosk-ic{width:84px;height:84px;border-radius:22px;margin:0 auto 4px;}
.site-index .dh-kiosk-ic svg{width:40px;height:40px;}
.site-index .list-antrian .panel:hover .dh-kiosk-ic{background:var(--dh-primary);color:#fff;}

/* Kiosk ambil-antrian cards: center content like launcher cards */
.site-index .list-antrian .panel{display:flex !important;flex-direction:column;align-items:center;justify-content:center;gap:14px;min-height:210px;}
.site-index .list-antrian .panel .jenis-antrian{margin:0 !important;}
.site-index .list-antrian .panel .btn-more{margin-top:2px;}

/* Kiosk pendaftaran: tint legacy navy PNG icons -> teal + teal chevrons */
.content-wrapper .card .card-row img,
.content-wrapper .card-poli img,
.content-wrapper .card-container img{
  filter:brightness(0) saturate(100%) invert(46%) sepia(64%) saturate(520%) hue-rotate(131deg) brightness(93%) contrast(92%);
}
.content-wrapper .card .icon-chevron,
.content-wrapper .card .fa-chevron-right,
.content-wrapper .card .fa-chevron-right:before{color:var(--dh-primary) !important;}

/* Kiosk back-arrow PNG -> teal tint */
.content-wrapper .back-antrian img,.content-wrapper .back-form img,
.content-wrapper .wrapper-back-button a img,.content-wrapper .arrow-back img{
  filter:brightness(0) saturate(100%) invert(46%) sepia(64%) saturate(520%) hue-rotate(131deg) brightness(93%) contrast(92%);
}

/* ============================================================
   TOUCHSCREEN KIOSK — big, touch-friendly (bank queue style)
   Scoped to body.dh-kiosk (antrian layout) only.
   ============================================================ */
body.dh-kiosk{font-size:19px;}
body.dh-kiosk .content-header-title,
body.dh-kiosk .title-antrian,
body.dh-kiosk .data-module h2.content-group{font-size:34px !important;font-weight:700 !important;letter-spacing:.04em;}

/* ambil-antrian launcher cards */
body.dh-kiosk .site-index .list-antrian .panel{min-height:340px;gap:22px;padding:42px 22px !important;border-radius:26px !important;}
body.dh-kiosk .site-index .dh-kiosk-ic{width:118px;height:118px;border-radius:30px;}
body.dh-kiosk .site-index .dh-kiosk-ic svg{width:58px;height:58px;}
body.dh-kiosk .site-index .jenis-antrian{font-size:26px !important;font-weight:700;line-height:1.25;}

/* big buttons everywhere on the kiosk */
body.dh-kiosk .btn,
body.dh-kiosk .site-index .btn-more,
body.dh-kiosk .btn-info,
body.dh-kiosk .btn-primary,
body.dh-kiosk .btn-layar,
body.dh-kiosk .btn-antrian{
  min-height:66px !important;font-size:21px !important;font-weight:700 !important;
  padding:16px 36px !important;border-radius:16px !important;}

/* prev/next pills */
body.dh-kiosk .site-index .arrow a,
body.dh-kiosk .arrow a{font-size:19px !important;font-weight:600;padding:14px 28px !important;border-radius:999px;}

/* Tipe Antrian registration cards */
body.dh-kiosk .content-wrapper .card{border-radius:22px;min-height:150px;}
body.dh-kiosk .content-wrapper .card .title-card{font-size:33px !important;font-weight:700 !important;line-height:1.15;}
body.dh-kiosk .content-wrapper .card .desc-card{font-size:18px !important;line-height:1.35;}
body.dh-kiosk .content-wrapper .card .card-row img,
body.dh-kiosk .content-wrapper .card-container img{width:86px !important;height:86px !important;}
body.dh-kiosk .content-wrapper .card .icon-chevron,
body.dh-kiosk .content-wrapper .card .fa-chevron-right{font-size:32px !important;}

/* poli selection cards */
body.dh-kiosk .card-poli{border-radius:22px;padding:26px 20px;}
body.dh-kiosk .card-poli .nama{font-size:25px !important;font-weight:700;}
body.dh-kiosk .card-poli .quota .sisa-kuota{font-size:32px !important;font-weight:800;}
body.dh-kiosk .card-poli .quota span,body.dh-kiosk .card-poli .jam-operasional span{font-size:16px !important;}
body.dh-kiosk .card-poli .jam-operasional h6{font-size:19px !important;}

/* form inputs + on-screen keyboard */
body.dh-kiosk input,body.dh-kiosk .form-control,body.dh-kiosk select{min-height:60px !important;font-size:21px !important;border-radius:12px !important;}
body.dh-kiosk label,body.dh-kiosk .control-label{font-size:19px !important;}
body.dh-kiosk #nik{font-size:28px !important;letter-spacing:3px;text-align:center;font-weight:700;}
body.dh-kiosk .ui-keyboard-button{min-width:56px;min-height:56px;font-size:21px !important;border-radius:10px;}
body.dh-kiosk .modal-title{font-size:26px !important;font-weight:700;}

/* back button bigger tap target */
body.dh-kiosk .back-antrian,body.dh-kiosk .back-form,body.dh-kiosk .wrapper-back-button a{width:62px !important;height:62px !important;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:var(--dh-primary-t);}
body.dh-kiosk .back-antrian img,body.dh-kiosk .back-form img,body.dh-kiosk .wrapper-back-button a img{width:26px !important;height:26px !important;}

/* Kiosk: whole card is a tap target + press feedback + disabled state */
body.dh-kiosk .list-antrian .panel,
body.dh-kiosk .content-wrapper .card-poli,
body.dh-kiosk .content-wrapper .card{cursor:pointer;-webkit-tap-highlight-color:transparent;user-select:none;transition:transform .08s ease,box-shadow .15s,border-color .15s;}
body.dh-kiosk .list-antrian .panel:active,
body.dh-kiosk .content-wrapper .card-poli:active,
body.dh-kiosk .content-wrapper .card:active{transform:scale(.975);border-color:var(--dh-primary) !important;box-shadow:0 8px 20px -10px var(--dh-primary) !important;}
body.dh-kiosk .inactive,body.dh-kiosk .is_disabled,body.dh-kiosk .disabled,body.dh-kiosk .empty-state{cursor:not-allowed;opacity:.5;}
body.dh-kiosk .inactive:active,body.dh-kiosk .is_disabled:active,body.dh-kiosk .empty-state:active{transform:none !important;}

/* ============================================================
   KIOSK selectable cards (INSTALASI / JENIS RESEP / cara bayar)
   override legacy green (.lbl-on/.lbl-on-cb in antrian.css)
   ============================================================ */
body.dh-kiosk .data-module h5.content-group{font-size:18px !important;color:var(--dh-muted) !important;text-transform:uppercase;letter-spacing:.06em;font-weight:700;margin:26px 0 12px !important;}
body.dh-kiosk .plan .lbl-on,
body.dh-kiosk .plan .lbl-on-cb{
  background:var(--dh-primary-t) !important;color:var(--dh-ink) !important;
  border:2px solid var(--dh-line2) !important;border-radius:18px !important;
  box-shadow:var(--dh-shadow) !important;
  display:flex !important;align-items:center;justify-content:center;text-align:center;
  min-height:120px;padding:18px !important;transition:transform .12s,box-shadow .15s,border-color .15s,background .15s;
}
body.dh-kiosk .plan .lbl-on h4,
body.dh-kiosk .plan .lbl-on-cb h4{margin:0 !important;font-size:22px !important;font-weight:700;color:inherit !important;line-height:1.25;}
body.dh-kiosk .plan .lbl-on:hover,
body.dh-kiosk .plan .lbl-on-cb:hover{
  background:#d6f0ec !important;color:var(--dh-ink) !important;
  border-color:var(--dh-primary) !important;box-shadow:0 12px 26px -12px var(--dh-primary) !important;transform:translateY(-2px);
}
body.dh-kiosk .plan .lbl-on:active,
body.dh-kiosk .plan .lbl-on-cb:active{transform:scale(.97);}
/* selected (radio checked) */
body.dh-kiosk .plan input:checked + .lbl-on-cb,
body.dh-kiosk .plan input:checked + .lbl-on{
  background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;color:#fff !important;
  box-shadow:0 12px 26px -12px var(--dh-primary) !important;
}
body.dh-kiosk .plan input:checked + .lbl-on-cb h4,
body.dh-kiosk .plan input:checked + .lbl-on h4{color:#fff !important;}
/* check badge */
body.dh-kiosk .plan input:checked + label:after{
  background:var(--dh-primary-d) !important;color:#fff !important;border:0 !important;
  width:36px !important;height:36px !important;line-height:36px !important;font-size:18px !important;
  border-radius:50% !important;box-shadow:0 2px 8px rgba(13,24,43,.28) !important;top:-8px;right:-8px;
}
/* closed/disabled option */
body.dh-kiosk .plan .lbl-off{
  background:var(--dh-danger-t) !important;color:var(--dh-danger) !important;
  border:2px solid #f3c2c2 !important;border-radius:18px !important;
  display:flex !important;align-items:center;justify-content:center;min-height:120px;font-weight:700;
}
body.dh-kiosk .plan .lbl-off h4{margin:0 !important;color:var(--dh-danger) !important;font-size:22px !important;}

/* ============================================================
   KIOSK ticket / receipt confirmation screen (cetak-*)
   ============================================================ */
body.dh-kiosk .cetak{
  border:1px solid var(--dh-line2) !important;border-radius:22px !important;
  box-shadow:var(--dh-shadow) !important;background:#fff !important;
  height:auto !important;min-height:auto !important;margin:48px auto 0 !important;
  padding:30px 26px 26px !important;max-width:440px;
}
body.dh-kiosk .cetak .top-date{color:var(--dh-muted) !important;font-size:14px !important;}
body.dh-kiosk .cetak .text-no-antrian,
body.dh-kiosk .cetak .no-antrian,
body.dh-kiosk .cetak .no-antrian-poli,
body.dh-kiosk .cetak h1{color:var(--dh-primary) !important;font-weight:800 !important;letter-spacing:-.02em;}
body.dh-kiosk .cetak hr{border-color:var(--dh-line2) !important;}
/* home button -> labelled teal pill, proper touch size */
body.dh-kiosk .home-icon{margin-top:40px !important;text-align:center;float:none !important;width:100% !important;}
body.dh-kiosk .button-home{
  background:var(--dh-primary) !important;border-radius:16px !important;
  width:auto !important;min-width:230px;display:inline-flex !important;align-items:center;justify-content:center;gap:12px;
  padding:16px 32px !important;box-shadow:0 8px 18px -8px var(--dh-primary);min-height:64px;transition:.15s;
}
body.dh-kiosk .button-home:hover{background:var(--dh-primary-d) !important;opacity:1 !important;}
body.dh-kiosk .button-home:active{transform:scale(.97);}
body.dh-kiosk .button-home .big-icon,body.dh-kiosk .button-home i{color:#fff !important;font-size:24px !important;}
body.dh-kiosk .button-home:after{content:"Beranda";color:#fff;font-size:20px;font-weight:700;}
@media print{
  body.dh-kiosk .cetak{border:1px solid #000 !important;border-radius:0 !important;box-shadow:none !important;max-width:none;margin:0 !important;}
}

/* ============================================================
   DISPLAY SCREENS (TV) — generic cleanup for ALL layar-antrian views
   kills legacy raster art + navy, scoped to body.dh-display
   ============================================================ */
.dh-display img.img-background,
.dh-display img.img-responsive-hd,
.dh-display img[src*="/layar-antrian/background.png"],
.dh-display img[src*="/layar-antrian/footer.png"],
.dh-display img[src*="/layar-antrian/header.png"],
.dh-display img[src*="/layar-antrian/panggil.png"],
.dh-display img[src*="card-header-bg"]{display:none !important;}
.dh-display [style*="panggil.png"],
.dh-display [style*="background.png"],
.dh-display [style*="card-header-bg"]{background-image:none !important;background-color:var(--dh-bg) !important;}
/* legacy navy header rows / bands -> teal */
.dh-display .header-custom,
.dh-display .header-custom th{background-image:none !important;background-color:var(--dh-primary) !important;color:#fff !important;border-color:var(--dh-primary) !important;}
.dh-display .wrapper-title,.dh-display .card-header,.dh-display .border-antrian{background-image:none !important;}
.dh-display table,.dh-display .table,.dh-display .table td,.dh-display .table th{color:var(--dh-ink) !important;border-color:var(--dh-line2) !important;}
/* footer bar teal/clean */
.dh-display .navbar-fixed-bottom{background:var(--dh-surface) !important;border-top:3px solid var(--dh-primary) !important;}
.dh-display .navbar-fixed-bottom .footer-time,.dh-display .navbar-fixed-bottom .footer-date{color:var(--dh-ink) !important;}
.dh-display .marquee{color:var(--dh-primary-d) !important;}

/* Kiosk "Tipe Antrian" cards: uniform height (symmetric) without breaking float layout */
body.dh-kiosk .get-parent .card.card-poli{min-height:170px;display:flex;align-items:center;}
body.dh-kiosk .get-parent .card.card-poli .card-container{width:100%;}
@media(min-width:768px){ body.dh-kiosk .get-parent .card.card-poli{min-height:190px;} }

/* ===== COLLAPSIBLE ICON-RAIL SIDEBAR (collapsed by default, expand on hover) ===== */
@media(min-width:992px){
  #navbar-second .second-navbar{
    width:74px !important;padding:10px 0 14px !important;overflow-x:hidden !important;overflow-y:auto;
    z-index:1041 !important;transition:width .18s ease, box-shadow .18s ease, padding .18s ease;
  }
  #navbar-second .second-navbar:hover{
    width:252px !important;padding:10px 10px 14px !important;
    box-shadow:10px 0 34px -12px rgba(13,24,43,.25) !important;
  }
  /* content uses rail width; sidebar overlays on hover (no reflow / no covering) */
  #navbar-second ~ .page-container{margin-left:74px !important;}
  body:has(#navbar-second) .page-container{margin-left:74px;} /* fallback if sibling combinator misses */

  /* NAVIGASI section label: hidden when collapsed */
  #navbar-second .left-navbar::before{opacity:0 !important;height:0 !important;padding:0 !important;overflow:hidden;white-space:nowrap;transition:opacity .12s;}
  #navbar-second .second-navbar:hover .left-navbar::before{opacity:1 !important;height:auto !important;padding:6px 12px 8px !important;}

  /* menu rows COLLAPSED: ICON ONLY (label hidden via font-size:0; icon keeps fixed px size) */
  #navbar-second #mainmenu > li{margin:3px 8px;}
  #navbar-second #mainmenu > li > a,
  #navbar-second .right-navbar .nav.navbar-right > li > a{
    padding:13px 0 13px 19px !important;gap:0 !important;justify-content:flex-start !important;
    white-space:nowrap;overflow:hidden;border-radius:10px;font-size:0 !important;
  }
  /* hide every non-icon child when collapsed so only the icon shows (deterministic align) */
  #navbar-second #mainmenu > li > a > *:not(i):not([class^="icon-"]):not([class*=" icon-"]):not(.caret),
  #navbar-second .right-navbar .nav.navbar-right > li > a > *:not(i):not([class^="icon-"]):not([class*=" icon-"]):not(.caret){display:none !important;}
  #navbar-second #mainmenu > li > a > i,#navbar-second #mainmenu > li > a > [class^="icon-"],#navbar-second #mainmenu > li > a > [class*=" icon-"],
  #navbar-second .right-navbar .nav.navbar-right > li > a > i,#navbar-second .right-navbar .nav.navbar-right > li > a > [class^="icon-"]{
    font-size:18px !important;width:20px !important;height:20px !important;min-width:20px !important;flex:0 0 20px !important;text-align:center !important;
  }
  #navbar-second #mainmenu > li > a .caret,#navbar-second .right-navbar .nav.navbar-right > li > a .caret{display:none !important;}
  /* uniform collapsed item height (symmetry) */
  #navbar-second #mainmenu > li > a,
  #navbar-second .right-navbar .nav.navbar-right > li > a{min-height:46px;align-items:center;}
  #navbar-second .right-navbar{padding-top:8px !important;margin-top:8px !important;}
  #navbar-second .right-navbar .nav.navbar-right > li{margin:3px 8px;}

  /* expanded (hover): show labels, normal padding */
  #navbar-second .second-navbar:hover #mainmenu > li,
  #navbar-second .second-navbar:hover .right-navbar .nav.navbar-right > li{margin:1px 0;}
  #navbar-second .second-navbar:hover #mainmenu > li > a,
  #navbar-second .second-navbar:hover .right-navbar .nav.navbar-right > li > a{padding:11px 13px !important;gap:10px !important;justify-content:flex-start !important;font-size:13.5px !important;}
  #navbar-second .second-navbar:hover #mainmenu > li > a > *,
  #navbar-second .second-navbar:hover .right-navbar .nav.navbar-right > li > a > *{display:inline-block !important;}
  #navbar-second .second-navbar:hover #mainmenu > li > a .caret,
  #navbar-second .second-navbar:hover .right-navbar .nav.navbar-right > li > a .caret{display:inline-block !important;}
  #navbar-second .second-navbar:hover #mainmenu > li > a > i,#navbar-second .second-navbar:hover .right-navbar .nav.navbar-right > li > a > i{width:18px !important;min-width:18px !important;flex:0 0 18px !important;font-size:15px !important;}
  #navbar-second .second-navbar:hover #mainmenu > li > a .caret,
  #navbar-second .second-navbar:hover .right-navbar .nav.navbar-right > li > a .caret{display:inline-block !important;margin-left:auto !important;}

}

/* ===== CONTENT READABILITY PASS (global, all content pages) ===== */
/* page content gets a touch more breathing room */
.content-wrapper{padding:6px 4px;}
.panel-body{padding:18px 20px;}
/* DataTables / tables: comfortable rows, zebra, sticky header, clearer type */
.dataTables_wrapper table.dataTable thead th,
.content-wrapper table.table thead th,.tbl thead th{
  background:#f1f5f8 !important;color:#475467 !important;font-weight:700 !important;
  font-size:12px !important;letter-spacing:.02em;text-transform:uppercase;
  padding:13px 14px !important;border-bottom:2px solid var(--dh-line2) !important;
  position:sticky;top:0;z-index:3;}
.dataTables_wrapper table.dataTable tbody td,
.content-wrapper table.table tbody td,.tbl tbody td{
  padding:12px 14px !important;font-size:13.5px !important;color:var(--dh-ink) !important;
  border-color:var(--dh-line) !important;vertical-align:middle;}
.dataTables_wrapper table.dataTable tbody tr:nth-child(even) td,
.content-wrapper table.table.table-striped tbody tr:nth-child(even) td{background:#f8fafc !important;}
.dataTables_wrapper table.dataTable tbody tr:hover td,
.content-wrapper table.table tbody tr:hover td{background:var(--dh-primary-t) !important;}
/* toolbar: group action buttons in a soft bar */
.panel-toolbar,.toolbar-title,.box-toolbar{
  background:#f8fafc !important;border:1px solid var(--dh-line2) !important;border-radius:12px !important;
  padding:10px 12px !important;display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px;}
/* filter labels clearer */
.content-wrapper .control-label,.content-wrapper label.control-label{
  color:#475467 !important;font-weight:600 !important;font-size:12.5px !important;margin-bottom:5px !important;}
/* page header/title spacing */
.content-wrapper .page-title,.content-wrapper h5.panel-title,.content-wrapper .content-header-title{
  letter-spacing:-.01em;}

/* ===== Sidebar structure: Menu Utama/room to TOP + drop NAVIGASI label ===== */
@media(min-width:992px){
  /* move the right-navbar (Menu Utama + room selector) above the module menu */
  #navbar-second .right-navbar{
    order:-1 !important;margin-top:0 !important;margin-bottom:8px !important;
    padding-top:0 !important;padding-bottom:8px !important;
    border-top:0 !important;border-bottom:1px solid var(--dh-line) !important;
  }
  /* NAVIGASI section label no longer needed */
  #navbar-second .left-navbar::before,
  #navbar-second .second-navbar:hover .left-navbar::before{display:none !important;content:none !important;height:0 !important;padding:0 !important;}
}

/* ============================================================
   NEW NAV LAYOUT: module RAIL (left, RBAC) + FEATURE top-nav
   ============================================================ */
@media(min-width:992px){
  /* hide old left-sidebar collapse hint, keep #navbar-second but reposition as TOP bar */
  #dh-rail{position:fixed;top:0;left:0;bottom:0;width:84px;background:#0b2e2a;z-index:1200;display:flex;flex-direction:column;padding:8px 0 14px;overflow-x:hidden;overflow-y:auto;transition:width .18s ease, box-shadow .18s ease;}
  #dh-rail:hover{width:238px;box-shadow:12px 0 36px -12px rgba(0,0,0,.55);}
  #dh-rail::-webkit-scrollbar{width:0;height:0;}
  #dh-rail .dh-rail-logo{display:flex;align-items:center;gap:11px;padding:10px 0 12px 27px;text-decoration:none;white-space:nowrap;color:#fff;}
  #dh-rail .dh-rail-mark{width:32px;min-width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,#16a394,#0c7a70);display:inline-flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;color:#fff;}
  #dh-rail .dh-rail-logo b{font-size:15px;font-weight:800;opacity:0;transition:opacity .15s;}
  #dh-rail:hover .dh-rail-logo b{opacity:1;}
  #dh-rail .dh-rail-item{display:flex;align-items:center;gap:13px;text-decoration:none;color:#bfe3dd;padding:0 0 0 28px;min-height:46px;margin:2px 10px;border-radius:10px;white-space:nowrap;font-size:13.5px;font-weight:600;}
  #dh-rail .dh-rail-item .ic{width:26px;min-width:26px;height:26px;flex:0 0 26px;display:flex;align-items:center;justify-content:center;color:#cdeee8;}
  #dh-rail .dh-rail-item .ic svg{width:21px;height:21px;}
  #dh-rail .dh-rail-item .lb{opacity:0;transition:opacity .12s;}
  #dh-rail:hover .dh-rail-item .lb{opacity:1;}
  #dh-rail .dh-rail-item:hover{background:rgba(255,255,255,.08);color:#fff;}
  #dh-rail .dh-rail-item:hover .ic{color:#fff;}
  #dh-rail .dh-rail-item.active{background:var(--dh-primary);color:#fff;}
  #dh-rail .dh-rail-item.active .ic{color:#fff;}
  #dh-rail .dh-rail-sep{height:1px;background:rgba(255,255,255,.12);margin:8px 16px;}

  /* #navbar-second -> TOP feature bar (override old left-sidebar rules) */
  #navbar-second .second-navbar{position:fixed !important;top:56px !important;left:84px !important;right:0 !important;bottom:auto !important;width:auto !important;height:50px !important;flex-direction:row !important;align-items:center !important;padding:0 14px !important;border-right:0 !important;border-bottom:1px solid var(--dh-line2) !important;overflow:visible !important;z-index:1100 !important;box-shadow:0 1px 3px rgba(13,24,43,.05) !important;}
  #navbar-second .second-navbar:hover{width:auto !important;padding:0 14px !important;box-shadow:0 1px 3px rgba(13,24,43,.05) !important;}
  #navbar-second .navbar-logo{display:none !important;}
  #navbar-second .left-navbar{display:flex !important;align-items:center;width:auto !important;}
  #navbar-second .left-navbar::before,#navbar-second .left-navbar::after{display:none !important;content:none !important;}
  #navbar-second #mainmenu{display:flex !important;flex-direction:row !important;align-items:center;width:auto !important;}
  #navbar-second #mainmenu > li{width:auto !important;margin:0 !important;position:relative;}
  #navbar-second #mainmenu > li > a{display:flex !important;align-items:center;gap:6px;height:50px;min-height:50px;padding:0 14px !important;border-radius:0 !important;border-bottom:2px solid transparent !important;color:#475467 !important;font-weight:600 !important;font-size:13.5px !important;justify-content:flex-start !important;background:transparent !important;}
  #navbar-second #mainmenu > li > a > i{width:auto !important;min-width:0 !important;flex:none !important;font-size:15px !important;}
  #navbar-second #mainmenu > li > a:hover,#navbar-second #mainmenu > li.open > a,#navbar-second #mainmenu > li:hover > a{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;}
  #navbar-second #mainmenu > li.active > a{color:var(--dh-primary-d) !important;border-bottom-color:var(--dh-primary) !important;background:transparent !important;box-shadow:none !important;}
  #navbar-second #mainmenu > li > a .caret{display:inline-block !important;margin-left:4px !important;}
  #navbar-second #mainmenu > li > .dropdown-menu{position:absolute !important;left:0 !important;top:100% !important;margin:0 !important;min-width:240px;}
  #navbar-second #mainmenu > li:hover > .dropdown-menu{display:block !important;}
  /* right-navbar: room selector at far right; hide Menu Utama (rail has home) */
  #navbar-second .right-navbar{order:0 !important;margin:0 0 0 auto !important;padding:0 !important;border:0 !important;width:auto !important;}
  #navbar-second .right-navbar .nav.navbar-right{flex-direction:row !important;width:auto !important;align-items:center;}
  #navbar-second .right-navbar .nav.navbar-right > li{width:auto !important;margin:0 0 0 6px !important;}
  #navbar-second .right-navbar .nav.navbar-right > li > a{display:flex !important;align-items:center;gap:7px;padding:7px 14px !important;border-radius:9px;background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;font-weight:600;font-size:13px;border:1px solid #d7e9e6;}
  #navbar-second .right-navbar li:has(> a[data-home="true"]){display:none !important;}
  #navbar-second .right-navbar .nav.navbar-right > li > a .caret{display:inline-block !important;}

  /* content offset: left rail + header(56)+feature(50) */
  #navbar-second ~ .page-container,body:has(#dh-rail) .page-container{margin-left:84px !important;margin-top:50px !important;width:calc(100vw - 84px) !important;max-width:calc(100vw - 84px) !important;box-sizing:border-box !important;overflow-x:hidden;}
}

/* new-layout fixes: room selector text visible + rail tweaks */
@media(min-width:992px){
  #navbar-second .right-navbar .nav.navbar-right > li > a{font-size:13px !important;}
  #navbar-second .right-navbar .nav.navbar-right > li > a > *{display:inline-block !important;}
  #navbar-second .right-navbar .nav.navbar-right > li > a::before{content:"Ruangan: ";font-weight:600;opacity:.7;}
}

/* new layout is desktop-only; mobile keeps existing top+hamburger nav */
@media(max-width:991px){ #dh-rail{display:none !important;} }

/* top-nav dropdowns: open on hover AND on click (.open) */
@media(min-width:992px){
  #navbar-second #mainmenu > li.open > .dropdown-menu,
  #navbar-second #mainmenu > li:hover > .dropdown-menu{display:block !important;position:absolute !important;left:0 !important;top:100% !important;margin:0 !important;min-width:240px;box-shadow:0 12px 30px rgba(13,24,43,.14) !important;border:1px solid var(--dh-line2) !important;border-radius:0 0 10px 10px;}
}

/* ===== SOAP / Pemeriksaan: grouped left-rail tab layout (dh-soap) ===== */
.dh-soap{display:flex;align-items:stretch;gap:0;position:relative;}
.dh-soap .dh-soap-rail{flex:0 0 238px;max-width:238px;border-right:1px solid var(--dh-line,#e6e9ef);
  background:var(--dh-surface,#fff);padding:6px 0 10px;align-self:flex-start;position:sticky;top:96px;
  max-height:calc(100vh - 120px);overflow-y:auto;}
.dh-soap .dh-soap-rail .nav,.dh-soap .nav-tab-periksa{display:block !important;border:0 !important;margin:0 !important;padding:0 !important;background:transparent !important;}
.dh-soap .dh-soap-group{margin-bottom:2px;}
.dh-soap .dh-soap-group.hidden{display:none !important;}
.dh-soap .dh-soap-grouplabel{display:block;font-size:10.5px;font-weight:800;letter-spacing:.07em;
  text-transform:uppercase;color:var(--dh-muted,#9aa4b8);padding:10px 18px 4px;}
.dh-soap .dh-soap-rail .nav-link,.dh-soap .nav-tab-periksa .nav-link{display:block;float:none;width:auto;margin:0 !important;
  padding:8px 16px 8px 22px !important;font-size:13px;line-height:1.3;color:var(--dh-ink,#0b1524) !important;
  text-decoration:none;border:0 !important;border-left:3px solid transparent !important;border-radius:0 !important;
  background:transparent !important;cursor:pointer;white-space:normal;}
.dh-soap .dh-soap-rail .nav-link:hover{background:var(--dh-primary-t,#e6f7f5) !important;}
.dh-soap .dh-soap-rail .nav-link.active,.dh-soap .nav-tab-periksa .nav-link.active{
  background:var(--dh-primary-t,#e6f7f5) !important;color:var(--dh-primary-d,#0c7a70) !important;
  border-left-color:var(--dh-primary,#0e9488) !important;font-weight:700;}
.dh-soap .dh-soap-panes{flex:1 1 auto;min-width:0;padding:16px 18px;}
/* sticky compact patient bar (wrapper added in periksa.php) */
.dh-soap-patientbar{position:sticky;top:54px;z-index:6;background:linear-gradient(90deg,var(--dh-primary-t,#e6f7f5),var(--dh-surface,#fff));
  border-bottom:1px solid var(--dh-line,#e6e9ef);margin:0 -15px 10px;padding:6px 15px;}
/* responsive: stack rail on top for narrow screens */
@media (max-width:991px){
  .dh-soap{display:block;}
  .dh-soap .dh-soap-rail{flex:none;max-width:none;width:auto;border-right:0;border-bottom:1px solid var(--dh-line,#e6e9ef);
    position:static;max-height:none;overflow:visible;}
  .dh-soap .dh-soap-rail .nav-tab-periksa{display:flex !important;flex-wrap:wrap !important;}
  .dh-soap .dh-soap-group{display:inline-block;vertical-align:top;margin-right:8px;}
  .dh-soap-patientbar{top:0;}
}

/* ===== Pendaftaran Pasien: section cards (dh-reg-sec) — visual grouping, no field moves ===== */
.dh-reg .div-pasien > .row{display:block;}
.dh-reg .dh-reg-sec{border:1px solid var(--dh-line,#e6e9ef);border-radius:10px;margin:0 0 14px;padding:0 0 4px;background:var(--dh-surface,#fff);float:none;width:100%;}
.dh-reg .dh-reg-sec-h{display:flex;align-items:center;gap:8px;padding:9px 14px;margin:0 0 8px;background:var(--dh-primary-t,#e6f7f5);border-bottom:1px solid var(--dh-line,#e6e9ef);border-radius:10px 10px 0 0;}
.dh-reg .dh-reg-sec-h .n{width:20px;height:20px;border-radius:50%;background:var(--dh-primary,#0e9488);color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;}
.dh-reg .dh-reg-sec-h b{font-size:12.5px;color:var(--dh-primary-d,#0c7a70);text-transform:uppercase;letter-spacing:.03em;}
.dh-reg .dh-reg-sec > .row,.dh-reg .dh-reg-sec > .row.col-md-12{padding:0 12px !important;}

/* ===================== GLOBAL POLISH PASS (all pages) ===================== */
/* Inputs & selects — consistent radius + teal focus ring (additive, safe) */
.form-control{border-radius:8px;border-color:var(--dh-line);transition:border-color .15s ease,box-shadow .15s ease;}
.form-control:focus{border-color:var(--dh-primary);box-shadow:0 0 0 3px var(--dh-primary-t);outline:0;}
textarea.form-control{border-radius:8px;}
/* kartik/select2 widgets — match input look + focus */
.select2-container--krajee .select2-selection,.select2-container--bootstrap .select2-selection,.select2-selection{border-radius:8px !important;border-color:var(--dh-line) !important;}
.select2-container--krajee.select2-container--focus .select2-selection,.select2-container--focus .select2-selection{border-color:var(--dh-primary) !important;box-shadow:0 0 0 3px var(--dh-primary-t) !important;}
/* labels a touch stronger */
.control-label,label.control-label{font-weight:600;}
/* buttons — consistent radius + subtle hover */
.btn{border-radius:8px;transition:filter .15s ease,box-shadow .15s ease;}
.btn:hover{filter:brightness(.96);}
.btn:active{filter:brightness(.92);}
/* panels / boxes — softer card look */
.panel,.box{border-radius:12px;border-color:var(--dh-line);}
.panel{box-shadow:0 1px 3px rgba(16,24,40,.05);}
.panel>.panel-heading{border-radius:12px 12px 0 0;}
/* modals — clean teal header, rounded */
.modal-content{border-radius:12px;border:1px solid var(--dh-line);overflow:hidden;box-shadow:0 18px 50px rgba(16,24,40,.22);}
.modal-header{background:var(--dh-primary-t);border-bottom:1px solid var(--dh-line);}
.modal-header .modal-title,.modal-header h4,.modal-header h5{color:var(--dh-primary-d);font-weight:700;}
.modal-header .close{opacity:.6;}
/* tables — tighten header label look (light, complements earlier table pass) */
.table thead th{font-size:11.5px;letter-spacing:.03em;}
/* empty state — friendlier */
td.dataTables_empty,.dataTables_empty{color:var(--dh-muted) !important;font-style:italic;padding:26px !important;}
/* pills / badges — rounded */
.label,.badge{border-radius:999px;font-weight:600;letter-spacing:.01em;}
/* date input addons + input-group radius consistency */
.input-group .form-control:first-child{border-top-left-radius:8px;border-bottom-left-radius:8px;}
.input-group .form-control:last-child{border-top-right-radius:8px;border-bottom-right-radius:8px;}

/* ============================================================
   KASIR — Detail Tagihan / Pembayaran Tagihan (scoped .dh-bill)
   Converts read-only "Informasi Pasien" form-rows -> definition grid,
   and tidies the payment summary fields. No JS/field-binding changes.
   ============================================================ */
.dh-bill .panel-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
/* patient identity bar */
.dh-bill-pt{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:12px 16px;
  background:linear-gradient(90deg,var(--dh-primary-t),transparent);
  border:1px solid var(--dh-line);border-radius:10px;margin-bottom:14px;}
.dh-bill-pt .nm{font-weight:800;font-size:16px;color:var(--dh-ink);}
.dh-bill-pt .it{font-size:12.5px;color:var(--dh-muted);}
.dh-bill-pt .it b{color:var(--dh-ink);font-weight:600;}
.dh-bill-pt .tag{font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px;
  background:var(--dh-primary-t);color:var(--dh-primary-d);}
/* definition grid for the remaining detail fields */
.dh-bill-info{display:grid;grid-template-columns:repeat(3,1fr);
  border:1px solid var(--dh-line);border-radius:10px;overflow:hidden;}
.dh-bill-info .it{display:flex;flex-direction:column;padding:9px 14px;
  border-bottom:1px solid var(--dh-line);border-right:1px solid var(--dh-line);}
.dh-bill-info .it:nth-child(3n){border-right:0;}
.dh-bill-info .it .k{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;
  color:var(--dh-muted);font-weight:700;margin-bottom:2px;}
.dh-bill-info .it .v{font-size:13.5px;color:var(--dh-ink);font-weight:600;min-height:18px;}
@media (max-width:991px){.dh-bill-info{grid-template-columns:repeat(2,1fr);}
  .dh-bill-info .it:nth-child(3n){border-right:1px solid var(--dh-line);}
  .dh-bill-info .it:nth-child(2n){border-right:0;}}

/* ============================================================
   FARMASI WORKLIST — dispensing lifecycle stepper (.dh-steps)
   Horizontal progress timeline; JS fills the per-step date/pegawai
   spans by id (#tgl_*, #pegawai_*) — markup IDs preserved.
   ============================================================ */
.dh-steps{display:flex;align-items:flex-start;gap:0;padding:10px 0 4px;flex-wrap:wrap;}
.dh-steps .dh-step{flex:1;min-width:120px;position:relative;text-align:center;padding:0 6px;}
.dh-steps .dh-step:not(:last-child)::after{content:"";position:absolute;top:16px;left:50%;width:100%;height:2px;background:var(--dh-line);z-index:0;}
.dh-steps .dh-step-dot{position:relative;z-index:1;width:34px;height:34px;border-radius:50%;
  background:var(--dh-primary-t);color:var(--dh-primary-d);border:2px solid var(--dh-primary);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;margin:0 auto 9px;}
.dh-steps .dh-step-label{font-size:12px;font-weight:700;color:var(--dh-ink);text-transform:uppercase;letter-spacing:.03em;}
.dh-steps .dh-step-meta{font-size:12px;color:var(--dh-muted);margin-top:4px;line-height:1.45;}
.dh-steps .dh-step-meta .bold{display:block;color:var(--dh-ink);font-weight:600;}
@media (max-width:767px){.dh-steps .dh-step{flex:0 0 33.33%;margin-bottom:14px;}
  .dh-steps .dh-step:not(:last-child)::after{display:none;}}

/* ============================================================
   THERMAL PRINT SLIPS — global @media print for ALL antrian
   cetak-antrian-* / .cetak slips (80mm roll, monochrome, big
   centered number, auto length). One place => every slip prints
   consistently. Screen preview untouched (handled per-view/global).
   ============================================================ */
@media print {
  @page { size: 80mm auto; margin: 0; }
  html, body { width: 80mm !important; margin: 0 !important; padding: 0 !important; background: #fff !important; }
  body .col-md-3, body .col-md-offset-4, body .col-md-1, body .cetak-wrap {
    width: 100% !important; margin: 0 !important; padding: 0 !important; float: none !important; }
  body .cetak {
    width: 76mm !important; margin: 0 auto !important; height: auto !important; min-height: 0 !important;
    border: none !important; border-radius: 0 !important; box-shadow: none !important;
    padding: 2mm 2mm 5mm !important; text-align: center !important;
    font-family: "Helvetica Neue", Arial, sans-serif !important; }
  body .cetak, body .cetak * {
    color: #000 !important; background: #fff !important;
    -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body .cetak img { filter: grayscale(1) contrast(1.4); max-width: 46px !important; height: auto !important; margin: 0 auto !important; }
  /* big queue number variants used across slips */
  body .cetak .text-no-antrian, body .cetak .no-antrian, body .cetak .no-antrian-poli,
  body .cetak .nomor-antrian-besar {
    font-size: 54px !important; font-weight: 900 !important; line-height: 1 !important; letter-spacing: .03em !important; }
  body .cetak .top-date { font-size: 11px !important; color: #000 !important; }
  body .cetak .info-header, body .cetak .label-bottom { border-color: #000 !important; }
  /* hide screen-only chrome on paper */
  body .home-icon, body .button-home, body embed, body .wrapper-back-button { display: none !important; }
}

/* ============================================================
   FORM UX PASS — all Yii2/kartik ActiveForm pages
   Fixes: tiny/grey native selects, inconsistent control widths,
   black error text, weak required markers, grey submit buttons,
   cramped spacing, checkbox/radio alignment. Global = lifts every form.
   ============================================================ */
.panel-body .form-control, form .form-control, .modal-content .form-control{
  min-height:38px; border:1px solid var(--dh-line); border-radius:8px;
  padding:7px 11px; font-size:13.5px; box-shadow:none; width:100%; background-color:#fff;}
.panel-body .form-control.input-sm, form .input-sm, .modal-content .input-sm{
  min-height:34px; font-size:13px; padding:5px 9px; border-radius:7px;}
.panel-body textarea.form-control, form textarea.form-control{min-height:76px;}
/* native <select>: custom chevron + same look as inputs (was tiny/grey) */
.panel-body select.form-control, form select.form-control, .modal-content select.form-control{
  -webkit-appearance:none;-moz-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath fill='none' stroke='%2367748e' stroke-width='1.6' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 11px center;padding-right:30px;}
.panel-body .form-control:focus, form .form-control:focus, .modal-content .form-control:focus{
  border-color:var(--dh-primary);box-shadow:0 0 0 3px var(--dh-primary-t);outline:none;}
/* labels + required marker */
.form-horizontal .control-label, .panel-body .control-label, form .control-label{font-weight:600;color:var(--dh-ink);}
label.has-star:after, .control-label.has-star:after{content:" *";color:#d33;font-weight:700;}
/* Yii auto-marks required fields with .required; color the label red-accent (no injected * to avoid doubling with forms' manual *) */
.form-group.required > .control-label{color:var(--dh-ink);}
/* breathing room between fields */
.panel-body .form-group{margin-bottom:14px;}
/* validation states */
.has-error .form-control{border-color:#e0584f !important;}
.has-error .form-control:focus{box-shadow:0 0 0 3px rgba(224,88,79,.15) !important;}
.has-error .control-label{color:#c0392b;}
.help-block, .invalid-feedback{color:#c0392b;font-size:12px;margin-top:4px;line-height:1.4;}
.has-success .form-control{border-color:#1c8b4b;}
/* checkbox / radio alignment + brand color */
.panel-body .form-group input[type=checkbox], .panel-body .form-group input[type=radio],
form .form-group input[type=checkbox], form .form-group input[type=radio]{
  width:16px;height:16px;vertical-align:-3px;margin-right:6px;accent-color:var(--dh-primary);cursor:pointer;}
/* submit/primary buttons in forms & toolbars -> teal, comfortable (scoped, not all btn-info) */
.panel-toolbar .btn-info, .panel-body form .btn-info, .modal-content .btn-info,
.panel-body .btn-primary, .modal-content .btn-primary, form button[type=submit].btn-info{
  background:var(--dh-primary);border-color:var(--dh-primary);color:#fff;border-radius:8px;font-weight:600;}
.panel-toolbar .btn-info:hover, .panel-body form .btn-info:hover, .modal-content .btn-info:hover,
.panel-body .btn-primary:hover, .modal-content .btn-primary:hover{background:var(--dh-primary-d);border-color:var(--dh-primary-d);color:#fff;}

/* ============================================================
   FORM SECTION CHROME — legend / fieldset / nested section
   panels / wizard headers inside dense multi-section forms
   (pegawai, form-update, daftar-ranap, pulang, ...). Global.
   ============================================================ */
.panel-body legend, form legend, fieldset > legend{
  font-size:13.5px;font-weight:800;color:var(--dh-primary-d);text-transform:uppercase;letter-spacing:.03em;
  border:0;border-bottom:2px solid var(--dh-primary-t);padding:0 0 8px;margin:10px 0 16px;width:100%;}
.panel-body fieldset, form fieldset{border:0;margin:0 0 6px;padding:0;min-width:0;}
/* section panels nested inside a form -> teal-tinted header, rounded */
.panel-body .panel.panel-default, .panel-body .panel.panel-white{border:1px solid var(--dh-line);border-radius:10px;box-shadow:none;margin-bottom:14px;overflow:hidden;}
.panel-body .panel.panel-default > .panel-heading, .panel-body .panel.panel-white > .panel-heading{background:var(--dh-primary-t);border-bottom:1px solid var(--dh-line);}
.panel-body .panel.panel-default > .panel-heading .panel-title, .panel-body .panel.panel-white > .panel-heading .panel-title{color:var(--dh-primary-d);font-weight:700;}
/* form section-group titles */
.panel-body .content-group, form .content-group{font-weight:700;color:var(--dh-ink);letter-spacing:.01em;}
/* jQuery-steps wizard content card (steps already teal in kiosk block) */
.panel-body .wizard > .content, form .wizard > .content{border:1px solid var(--dh-line);border-radius:10px;background:#fff;}
.panel-body .wizard > .steps > ul > li > a, form .wizard > .steps > ul > li > a{border-radius:8px;}

/* clinical/asesmen forms use plain <p> as section headers -> class dh-formsec */
.dh-formsec{font-size:13.5px !important;font-weight:800 !important;color:var(--dh-primary-d) !important;
  text-transform:uppercase;letter-spacing:.03em;border-bottom:2px solid var(--dh-primary-t);
  padding:0 0 8px !important;margin:20px 0 14px !important;}

/* ---- rail icon centering when collapsed (equal L/R space); expanded drawer keeps 28px gutter ---- */
#dh-rail:not(:hover) .dh-rail-item{padding-left:19px;padding-right:0;transition:padding .18s ease;}
#dh-rail:not(:hover) .dh-rail-logo{padding-left:26px;transition:padding .18s ease;}
#dh-rail .dh-rail-item{transition:padding .18s ease, background .12s;}

/* ============ Pendaftaran — Tipe Pasien registration card redesign (scoped #form-parent) ============ */
#form-parent .panel{overflow:visible;border-radius:14px;box-shadow:0 1px 3px rgba(16,40,60,.06);}
#form-parent .panel-body{padding:0 !important;}
/* section shell */
#form-parent .steps-basic{padding:20px 26px 8px;overflow:hidden;}
#form-parent .steps-basic > h6{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:800;letter-spacing:.2px;
  color:var(--dh-ink,#1f2d3d);margin:0 0 18px;padding-bottom:13px;border-bottom:1px solid var(--dh-line,#e6ebf1);}
#form-parent .steps-basic > h6::before{content:"";width:6px;height:20px;border-radius:4px;background:var(--dh-primary,#12b39a);display:inline-block;}
/* kill the wasteful floating step-icon whitespace above fields */
#form-parent .steps-basic > fieldset > .text-center,
#form-parent .steps-basic .form-nav-icon,
#form-parent .steps-basic > .row:empty{display:none !important;}
/* fields: widen the cramped 25% columns into a comfortable 2-column grid */
#form-parent .pasien-aps{display:flex !important;flex-wrap:wrap;gap:2px 30px;margin:0 !important;}
#form-parent .pasien-aps > [class*="col-sm-"],#form-parent .pasien-aps > [class*="col-md-"]{
  width:100% !important;max-width:560px;flex:1 1 380px;padding:0 !important;float:none !important;}
#form-parent .form-group{margin-bottom:15px;}
#form-parent .control-label{font-size:12.5px;font-weight:600;color:#5a6b7b;margin-bottom:5px;}
#form-parent .form-control,#form-parent .select2-selection,#form-parent .select2-container{min-height:38px;}
/* remove stray empty required-asterisk row */
#form-parent .steps-basic > fieldset > .row:first-child:has(> .col-sm-5 > .form-group:empty){display:none;}
/* action bar: keep buttons inside, no overflow cut-off */
#form-parent .panel,#form-parent .steps-basic,#form-parent fieldset{max-width:100%;box-sizing:border-box;}
#form-parent .row{margin-left:0;margin-right:0;}
#form-parent .text-right,#form-parent .form-actions,#form-parent .btn-toolbar{
  display:flex;justify-content:flex-end;gap:10px;padding:14px 26px;margin:8px -26px 0;border-top:1px solid var(--dh-line,#e6ebf1);background:#fbfcfd;}

/* ---- Pendaftaran wizard (jQuery Steps) cleanup: kill lone floating step icon, compact header ---- */
#form-parent .steps-basic .steps{display:none !important;}            /* single decorative step icon -> remove waste */
#form-parent .steps-basic .content{min-height:0 !important;margin:0 !important;overflow:visible;}
#form-parent .steps-basic .content > .title{position:static !important;display:flex;align-items:center;gap:9px;
  font-size:15px;font-weight:800;color:var(--dh-ink,#1f2d3d);margin:2px 0 18px !important;padding-bottom:13px;
  border-bottom:1px solid var(--dh-line,#e6ebf1);opacity:1 !important;height:auto !important;width:auto !important;clip:auto !important;}
#form-parent .steps-basic .content > .title::before{content:"";width:6px;height:20px;border-radius:4px;background:var(--dh-primary,#12b39a);}
#form-parent .steps-basic .content > .body{width:auto !important;position:static !important;padding:0 !important;float:none !important;}
#form-parent .steps-basic .actions{margin-top:6px;}
/* overflow guard so action buttons never clip on this page */
body:has(#form-parent) .content-wrapper,body:has(#form-parent) .page-content{overflow-x:hidden;}
#form-parent .panel,#form-parent .panel-body,#form-parent .steps-basic{max-width:100%;box-sizing:border-box;}

/* neutralize residual bootstrap row negative-margin overflow under the rail layout */
body:has(#dh-rail) .content-wrapper{padding-left:2px;padding-right:12px;box-sizing:border-box;}

/* hide stray empty required-asterisk above Pendaftaran Bayi; align checkbox neatly */
#form-parent .steps-basic .control-label:empty,
#form-parent .steps-basic label:empty{display:none !important;}
#form-parent .steps-basic .pasien-aps > [class*="col-"]:has(input[type=checkbox]):not(:has(select)):not(:has(.form-control)){
  flex:0 0 auto;max-width:210px;align-self:flex-start;padding-top:26px !important;}
/* stronger residual-overflow clamp */
html,body{overflow-x:hidden;}

/* hide form-groups that contain only a stray required-asterisk (no actual input) */
#form-parent .steps-basic .body .form-group:not(:has(input)):not(:has(select)):not(:has(textarea)):not(:has(button)){display:none !important;}

/* ============ Pendaftaran FULL CARD REDESIGN (scoped #form-parent) — 2026-07-03 ============ */
/* card shell */
#form-parent{margin-top:4px;}
#form-parent > .panel{border:1px solid var(--dh-line,#e6ebf1);border-radius:16px;box-shadow:0 2px 10px rgba(16,40,60,.05);overflow:hidden;background:#fff;}
#form-parent > .panel > .panel-heading{background:#fff;border-bottom:1px solid var(--dh-line,#e6ebf1);padding:16px 26px;}
#form-parent > .panel > .panel-heading .panel-title{font-size:15px;font-weight:800;color:#1f2d3d;letter-spacing:.2px;}
/* section header */
#form-parent .steps-basic .content > .title{position:static!important;display:flex;align-items:center;gap:10px;font-size:13.5px;
  font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:#12b39a;margin:20px 0 20px!important;padding:0 0 0 0;border:0;
  opacity:1!important;height:auto!important;width:auto!important;clip:auto!important;}
#form-parent .steps-basic .content > .title::before{content:"";width:6px;height:18px;border-radius:4px;background:#12b39a;}
#form-parent .steps-basic{padding:0 26px 8px;}
/* responsive 2-column grid for fields */
#form-parent .pasien-aps{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 30px;margin:0!important;align-items:start;}
#form-parent .pasien-aps > [class*="col-"]{width:100%!important;max-width:none!important;flex:none!important;padding:0!important;float:none!important;grid-column:auto;}
/* No RM search spans full width (first field) */
#form-parent .pasien-aps > [class*="col-"]:has(#no_rekam_medik){grid-column:1 / -1;}
#form-parent .form-group{margin-bottom:16px;}
/* labels */
#form-parent .control-label,#form-parent label.control-label{font-size:12px!important;font-weight:700;color:#6b7a89;
  text-transform:none;margin-bottom:6px;letter-spacing:.1px;}
#form-parent .form-group .required,#form-parent label .required{color:#e5484d;}
/* uniform inputs + select2 */
#form-parent .form-control{height:40px;border:1px solid #dbe2ea;border-radius:9px;font-size:13.5px;box-shadow:none;transition:border .12s,box-shadow .12s;}
#form-parent .form-control:focus{border-color:#12b39a;box-shadow:0 0 0 3px rgba(18,179,154,.14);}
#form-parent .select2-container--krajee .select2-selection,
#form-parent .select2-selection{min-height:40px!important;border:1px solid #dbe2ea!important;border-radius:9px!important;display:flex;align-items:center;background:#fff!important;}
#form-parent .select2-container--krajee.select2-container--focus .select2-selection{border-color:#12b39a!important;box-shadow:0 0 0 3px rgba(18,179,154,.14)!important;}
#form-parent .select2-selection__rendered{line-height:38px!important;font-size:13.5px;color:#1f2d3d;padding-left:12px!important;}
#form-parent .select2-selection__arrow{height:38px!important;}
#form-parent .input-group{border-radius:9px;}
#form-parent .input-group .form-control,#form-parent .input-group .select2-selection{border-radius:9px;}
#form-parent .input-group-addon,#form-parent .input-group-btn > .btn{border-radius:9px;border:1px solid #dbe2ea;background:#f4f7fa;}
/* neutralize odd green field highlight -> consistent look (keep only real focus) */
#form-parent .select2-selection[style*="background"],#form-parent .form-control[style*="background"]{background:#fff!important;}
/* checkbox row: inline, not isolated */
#form-parent .pasien-aps > [class*="col-"]:has(input[type=checkbox]):not(:has(select)):not(:has(.form-control)):not(:has(#no_rekam_medik)){
  grid-column:1 / -1;display:flex;align-items:center;gap:10px;padding:2px 0 6px!important;max-width:none!important;}
#form-parent .checkbox,#form-parent .radio{margin:0;}
/* hide stray marker-only groups */
#form-parent .steps-basic .body .form-group:not(:has(input)):not(:has(select)):not(:has(textarea)):not(:has(button)){display:none!important;}
/* sticky action bar */
#form-parent .actions,#form-parent .steps-basic > .actions,#form-parent .text-right:last-child{
  display:flex!important;justify-content:flex-end;gap:10px;padding:14px 26px;margin:12px -26px -8px;
  border-top:1px solid var(--dh-line,#e6ebf1);background:#fbfcfd;}
#form-parent .actions .btn,#form-parent .text-right .btn{border-radius:9px;padding:9px 22px;font-weight:700;font-size:13.5px;}
#form-parent .btn-primary,#form-parent .btn-info{background:#12b39a;border-color:#12b39a;}
#form-parent .btn-default{background:#fff;border:1px solid #dbe2ea;color:#5a6b7b;}
@media(max-width:900px){#form-parent .pasien-aps{grid-template-columns:1fr;}}

/* ---- Pendaftaran card: CORRECTED field layout (fields live inside one col-sm-3) ---- */
#form-parent .pasien-aps{display:block!important;}
/* checkbox row: inline at top, full width, hide empty stray-asterisk checkbox */
#form-parent .pasien-aps > .chkbox-multi{display:flex!important;align-items:center;gap:10px;margin:0 0 16px!important;padding:0!important;width:100%!important;}
#form-parent .pasien-aps > .chkbox-multi .checkbox:empty,
#form-parent .pasien-aps > .chkbox-multi .checkbox:not(:has(input)):not(:has(label)){display:none!important;}
#form-parent .pasien-aps > .chkbox-multi .checkbox{margin:0!important;}
/* primary field column -> full width + 2-col grid of its form-groups */
#form-parent .pasien-aps > .col-sm-3:not([class*="multi"]){width:100%!important;max-width:none!important;float:none!important;
  padding:0!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 30px;}
#form-parent .pasien-aps > .col-sm-3:not([class*="multi"]) > .form-group,
#form-parent .pasien-aps > .col-sm-3:not([class*="multi"]) > .highlight-addon{margin-bottom:16px;min-width:0;}
/* full-width fields: No RM search + No Asuransi */
#form-parent .pasien-aps > .col-sm-3:not([class*="multi"]) > .form-group:has(#no_rekam_medik),
#form-parent .pasien-aps > .col-sm-3:not([class*="multi"]) > [class*="highlight-addon"]:has(input[id*="asuransi" i]),
#form-parent .pasien-aps > .col-sm-3:not([class*="multi"]) > .form-group:has(textarea){grid-column:1 / -1;}
/* multi-carabayar extra columns: keep on their own full-width row when visible */
#form-parent .pasien-aps > [class*="form-multi-carabayar"]{width:auto!important;float:none!important;display:inline-block;vertical-align:top;}

/* ---- Pendaftaran card: final polish (stray asterisk + green select2 sliver) ---- */
/* kill the lone required-asterisk before Pendaftaran Bayi checkbox */
#form-parent .chkbox-multi .checkbox:first-child{display:none!important;}
#form-parent .chkbox-multi > .required,#form-parent .chkbox-multi label > .required:first-child{display:none!important;}
/* neutralize the green highlight tail on select2 addons -> flat consistent look */
#form-parent .highlight-addon .input-group-addon,
#form-parent .highlight-addon .select2-selection,
#form-parent [class*="highlight"] .input-group-addon{background:#fff!important;}
#form-parent .highlight-addon .input-group-addon{border-left:0!important;}
#form-parent .select2-container--krajee .select2-selection--single{background-image:none!important;}
/* remove green filled bg some select2 carry */
#form-parent .select2-selection--single[style*="rgb(2"],#form-parent .form-control.bg-success,
#form-parent .has-success .form-control,#form-parent .has-success .select2-selection{background:#fff!important;border-color:#dbe2ea!important;}

/* ---- kill residual green sliver on right of select2 dropdowns ---- */
#form-parent .steps-basic .select2-container .select2-selection,
#form-parent .steps-basic .select2-selection__arrow b,
#form-parent .steps-basic .input-group-btn.dropdown-list,
#form-parent .steps-basic .select2-selection--single{background:#fff!important;background-color:#fff!important;}
#form-parent .steps-basic [class*="select2"] *[style*="background"]{background-color:transparent!important;}
#form-parent .steps-basic .select2-container--krajee .select2-selection{background-image:none!important;box-shadow:none;}

/* remove krajee green arrow-box background on select2 dropdowns in pendaftaran */
#form-parent .select2-selection__arrow{background:transparent!important;background-color:transparent!important;border-left:0!important;}

/* ---- top feature bar: icons ALWAYS visible (not only on hover) ---- */
@media(min-width:992px){
  #navbar-second #mainmenu > li > a > i,
  #navbar-second #mainmenu > li > a > [class^="icon-"]{
    width:18px !important;min-width:18px !important;flex:0 0 18px !important;
    font-size:15px !important;text-align:center !important;display:inline-block !important;}
  /* ---- rail expanded (hover): align logo '+' center with item icon centers (43px -> 51px) ---- */
  #dh-rail:hover .dh-rail-logo{padding-left:35px;}
}

/* ---- top feature bar: caret ALWAYS visible & fixed-size -> hover only changes color, no layout shift ---- */
@media(min-width:992px){
  #navbar-second #mainmenu > li > a .caret,
  #navbar-second .second-navbar:hover #mainmenu > li > a .caret{
    display:inline-block !important;width:16px !important;min-width:16px !important;flex:0 0 16px !important;
    margin-left:4px !important;border-top-color:currentColor;}
}

/* ---- top bar: hover must NOT change geometry (padding/gap/font identical to base) ---- */
@media(min-width:992px){
  #navbar-second .second-navbar:hover #mainmenu > li{margin:0 !important;width:auto !important;}
  #navbar-second .second-navbar:hover #mainmenu > li > a{
    padding:0 14px !important;gap:6px !important;font-size:13.5px !important;min-height:50px;height:50px;}
  #navbar-second .second-navbar:hover #mainmenu > li > a > i{
    width:18px !important;min-width:18px !important;flex:0 0 18px !important;font-size:15px !important;text-align:center !important;}
  #navbar-second .second-navbar:hover #mainmenu > li > a .caret{margin-left:4px !important;}
}

/* ---- top bar: base gap must equal hover gap (kill old gap:0 collapsed rule) ---- */
@media(min-width:992px){
  #navbar-second #mainmenu > li > a{gap:6px !important;}
}

/* ---- dropdown menu: slim modern scrollbar + tidy max-height ---- */
#navbar-second #mainmenu > li > .dropdown-menu{max-height:min(68vh,560px);overflow-y:auto;overscroll-behavior:contain;
  scrollbar-width:thin;scrollbar-color:#c9d4dd transparent;border-radius:12px;padding:6px 4px;}
#navbar-second #mainmenu > li > .dropdown-menu::-webkit-scrollbar{width:6px;height:6px;}
#navbar-second #mainmenu > li > .dropdown-menu::-webkit-scrollbar-track{background:transparent;margin:8px 0;}
#navbar-second #mainmenu > li > .dropdown-menu::-webkit-scrollbar-thumb{background:#c9d4dd;border-radius:8px;}
#navbar-second #mainmenu > li > .dropdown-menu::-webkit-scrollbar-thumb:hover{background:#9fb0be;}
/* same slim scrollbar for nested submenus & right navbar dropdowns */
#navbar-second .dropdown-menu::-webkit-scrollbar{width:6px;}
#navbar-second .dropdown-menu::-webkit-scrollbar-track{background:transparent;margin:8px 0;}
#navbar-second .dropdown-menu::-webkit-scrollbar-thumb{background:#c9d4dd;border-radius:8px;}
#navbar-second .dropdown-menu{scrollbar-width:thin;scrollbar-color:#c9d4dd transparent;}

/* ---- Ruangan chip (top-right): vertically centered with breathing room, fixed height ---- */
@media(min-width:992px){
  #navbar-second .right-navbar .nav.navbar-right > li{display:flex;align-items:center;height:50px;}
  #navbar-second .right-navbar .nav.navbar-right > li > a{
    height:34px !important;min-height:34px !important;padding:0 14px !important;margin:0 !important;
    display:inline-flex !important;align-items:center !important;border-radius:9px !important;}
}

/* ---- Ruangan chip: balanced vertical centering + subtle separation from content ---- */
@media(min-width:992px){
  #navbar-second .right-navbar{display:flex;align-items:center;height:50px;}
  #navbar-second .right-navbar .nav.navbar-right{align-items:center;}
  #navbar-second .right-navbar .nav.navbar-right > li{display:flex;align-items:center;}
  #navbar-second .right-navbar .nav.navbar-right > li > a{
    height:34px !important;line-height:1 !important;padding:0 14px !important;
    display:inline-flex !important;align-items:center !important;gap:7px;}
  /* clean gap under the whole feature bar so the Ruangan row isn't flush with content */
  #navbar-second .second-navbar{box-shadow:0 2px 4px rgba(13,24,43,.06) !important;}
}

/* ---- more breathing room between feature bar (Ruangan row) and content below ---- */
@media(min-width:992px){
  body:has(#dh-rail) .page-container{margin-top:66px !important;}
}

/* ---- dropdown scrollbar flush to right edge (remove container right padding) ---- */
#navbar-second #mainmenu > li > .dropdown-menu,
#navbar-second .dropdown-menu{padding:6px 0 6px 6px !important;}
#navbar-second .dropdown-menu > li > a,#navbar-second .dropdown-menu li a{margin-right:6px;}
#navbar-second #mainmenu > li > .dropdown-menu::-webkit-scrollbar-track,
#navbar-second .dropdown-menu::-webkit-scrollbar-track{margin:6px 0;}

/* ============ fix flyout submenu clipping (Informasi -> Barang -> ...) ============ */
@media(min-width:992px){
  /* parent dropdowns that CONTAIN a submenu must not clip it (overflow-y:auto clips flyouts).
     Menus without submenus keep the slim scrollbar for long lists. */
  #navbar-second #mainmenu > li > .dropdown-menu:has(.dropdown-menu){overflow:visible !important;max-height:none !important;}
  /* nested submenu: sit flush to the RIGHT of its parent item, never overlap, full text */
  #navbar-second .dropdown-menu .dropdown-menu{
    position:absolute !important;left:100% !important;right:auto !important;top:-6px !important;
    margin:0 0 0 4px !important;min-width:230px;max-width:340px;display:none;
    border:1px solid var(--dh-line2) !important;border-radius:12px !important;
    box-shadow:0 12px 30px rgba(13,24,43,.14) !important;background:#fff !important;
    padding:6px !important;overflow:visible !important;z-index:1200 !important;}
  #navbar-second .dropdown-menu li:hover > .dropdown-menu,
  #navbar-second .dropdown-menu li.open > .dropdown-menu{display:block !important;}
  /* submenu items: single line so text is never cut; container widens to fit longest */
  #navbar-second .dropdown-menu .dropdown-menu > li > a{white-space:nowrap !important;overflow:visible !important;
    text-overflow:clip !important;padding:9px 14px !important;border-radius:8px;}
  /* parent item that opens a submenu: caret hint on the right */
  #navbar-second .dropdown-menu > li.dropdown-submenu > a,
  #navbar-second .dropdown-menu > li:has(> .dropdown-menu) > a{position:relative;padding-right:26px !important;}
  /* if submenu would overflow viewport right edge, flip to the left of parent */
  #navbar-second .dropdown-menu .dropdown-menu.flip-left{left:auto !important;right:100% !important;margin:0 4px 0 0 !important;}
}

/* ==================================================================================
   MEGA-PANEL DROPDOWN (recreate) — replaces flyout submenu. Everything visible in columns.
   ================================================================================== */
@media(min-width:992px){
  /* level-1 dropdown becomes a multi-column panel, opens straight down from the menu */
  #navbar-second #mainmenu > li > .dropdown-menu{
    display:none;position:absolute !important;left:0 !important;right:auto !important;top:100% !important;
    margin-top:8px !important;columns:3 200px;column-gap:4px;
    width:auto !important;min-width:440px;max-width:780px;max-height:none !important;overflow:visible !important;
    padding:12px 14px !important;border-radius:14px !important;
    box-shadow:0 16px 40px -8px rgba(13,24,43,.22) !important;border:1px solid var(--dh-line2) !important;}
  #navbar-second #mainmenu > li:hover > .dropdown-menu,
  #navbar-second #mainmenu > li.open > .dropdown-menu{display:block !important;}
  /* each top-level entry stays intact within a column */
  #navbar-second #mainmenu > li > .dropdown-menu > li{
    break-inside:avoid;-webkit-column-break-inside:avoid;page-break-inside:avoid;display:block;width:100%;}
  /* leaf item */
  #navbar-second #mainmenu > li > .dropdown-menu > li > a{
    display:block !important;padding:8px 12px !important;border-radius:8px;white-space:normal !important;
    font-size:13px;font-weight:500;color:#344054 !important;margin-right:0 !important;}
  #navbar-second #mainmenu > li > .dropdown-menu > li > a:hover{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;}
  /* group with children: header + inline column of children (no flyout) */
  #navbar-second #mainmenu > li > .dropdown-menu > li:has(> .dropdown-menu){margin:8px 0 6px;}
  #navbar-second #mainmenu > li > .dropdown-menu > li:has(> .dropdown-menu) > a{
    font-size:11px !important;font-weight:800 !important;text-transform:uppercase;letter-spacing:.7px;
    color:#12b39a !important;padding:6px 12px 4px !important;background:transparent !important;}
  #navbar-second #mainmenu > li > .dropdown-menu > li:has(> .dropdown-menu) > a:hover{background:transparent !important;}
  #navbar-second #mainmenu > li > .dropdown-menu > li:has(> .dropdown-menu) > a .caret,
  #navbar-second #mainmenu > li > .dropdown-menu > li:has(> .dropdown-menu) > a::after{display:none !important;}
  /* inline submenu list (was the floating flyout) */
  #navbar-second #mainmenu > li > .dropdown-menu > li > .dropdown-menu{
    position:static !important;display:block !important;float:none !important;left:auto !important;top:auto !important;
    right:auto !important;margin:0 !important;padding:0 !important;min-width:0 !important;max-width:none !important;
    background:transparent !important;border:0 !important;box-shadow:none !important;border-radius:0 !important;columns:auto !important;}
  #navbar-second #mainmenu > li > .dropdown-menu > li > .dropdown-menu > li > a{
    display:block !important;padding:7px 12px 7px 16px !important;border-radius:8px;white-space:normal !important;
    font-size:13px;font-weight:500;color:#475467 !important;}
  #navbar-second #mainmenu > li > .dropdown-menu > li > .dropdown-menu > li > a:hover{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;}
  /* thin divider between column groups for clarity */
  #navbar-second #mainmenu > li > .dropdown-menu > li:has(> .dropdown-menu){border-top:1px solid #eef2f6;padding-top:4px;}
}

/* ===== MEGA-PANEL corrected selectors (items live in ul.dropdown-content-body) ===== */
@media(min-width:992px){
  #navbar-second #mainmenu > li > .dropdown-menu{columns:auto !important;column-gap:normal !important;padding:12px 14px !important;}
  /* the real list becomes the multi-column grid */
  #navbar-second #mainmenu > li > .dropdown-menu > .dropdown-content-body{
    columns:3 190px !important;column-gap:8px;display:block !important;margin:0 !important;padding:0 !important;list-style:none;}
  #navbar-second #mainmenu > li > .dropdown-menu > .dropdown-content-body > li{
    break-inside:avoid !important;-webkit-column-break-inside:avoid;page-break-inside:avoid;display:block !important;width:100%;float:none !important;}
  #navbar-second #mainmenu > li > .dropdown-menu > .dropdown-content-body > li > a{
    display:block !important;padding:8px 12px !important;border-radius:8px;white-space:normal !important;
    font-size:13px;font-weight:500;color:#344054 !important;margin:0 !important;}
  #navbar-second #mainmenu > li > .dropdown-menu > .dropdown-content-body > li > a:hover{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;}
  /* group (dropdown-submenu): header + inline children column */
  #navbar-second #mainmenu .dropdown-content-body > li.dropdown-submenu{margin:6px 0 4px;border-top:1px solid #eef2f6;padding-top:4px;}
  #navbar-second #mainmenu .dropdown-content-body > li.dropdown-submenu > a{
    font-size:11px !important;font-weight:800 !important;text-transform:uppercase;letter-spacing:.7px;
    color:#12b39a !important;padding:6px 12px 2px !important;background:transparent !important;pointer-events:none;}
  #navbar-second #mainmenu .dropdown-content-body > li.dropdown-submenu > a .caret,
  #navbar-second #mainmenu .dropdown-content-body > li.dropdown-submenu > a::after,
  #navbar-second #mainmenu .dropdown-content-body > li.dropdown-submenu > a::before{display:none !important;}
  /* inline submenu (kill the flyout) */
  #navbar-second #mainmenu .dropdown-submenu > .dropdown-menu{
    position:static !important;display:block !important;float:none !important;left:auto !important;right:auto !important;top:auto !important;
    margin:0 !important;padding:0 !important;min-width:0 !important;max-width:none !important;width:auto !important;
    background:transparent !important;border:0 !important;box-shadow:none !important;border-radius:0 !important;columns:auto !important;overflow:visible !important;}
  #navbar-second #mainmenu .dropdown-submenu > .dropdown-menu > .dropdown-content-body{columns:auto !important;padding:0 !important;margin:0 !important;}
  #navbar-second #mainmenu .dropdown-submenu > .dropdown-menu > .dropdown-content-body > li > a{
    display:block !important;padding:7px 12px 7px 16px !important;border-radius:8px;white-space:normal !important;
    font-size:13px;font-weight:500;color:#475467 !important;}
  #navbar-second #mainmenu .dropdown-submenu > .dropdown-menu > .dropdown-content-body > li > a:hover{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;}
}

/* mega panel needs explicit width for multicol; only menus that HAVE submenu groups */
@media(min-width:992px){
  #navbar-second #mainmenu > li > .dropdown-menu:has(.dropdown-submenu){
    width:620px !important;min-width:620px !important;max-width:660px !important;}
  #navbar-second #mainmenu > li > .dropdown-menu:has(.dropdown-submenu) > .dropdown-content-body{
    column-count:3 !important;column-width:auto !important;column-gap:14px;}
  /* keep visual column separators */
  #navbar-second #mainmenu > li > .dropdown-menu:has(.dropdown-submenu) > .dropdown-content-body{column-rule:1px solid #f0f3f7;}
}

/* DEFINITIVE: div panel = plain block (no multicol); the BODY ul = 3 columns full-width */
@media(min-width:992px){
  #navbar-second #mainmenu > li > .dropdown-menu:has(.dropdown-submenu){
    column-count:auto !important;column-width:auto !important;display:block !important;}
  #navbar-second #mainmenu > li > .dropdown-menu:has(.dropdown-submenu) > .dropdown-content-body{
    width:100% !important;box-sizing:border-box !important;display:block !important;
    column-count:3 !important;column-width:auto !important;column-gap:16px !important;column-rule:1px solid #f0f3f7;}
  #navbar-second #mainmenu > li > .dropdown-menu:has(.dropdown-submenu) > .dropdown-content-body > li > a,
  #navbar-second #mainmenu .dropdown-submenu > .dropdown-menu > .dropdown-content-body > li > a{
    white-space:normal !important;overflow:visible !important;text-overflow:clip !important;}
}

/* FIX: mega panels must be hidden by default, shown only on hover (previous display:block forced all open) */
@media(min-width:992px){
  #navbar-second #mainmenu > li > .dropdown-menu:has(.dropdown-submenu){display:none !important;}
  #navbar-second #mainmenu > li:hover > .dropdown-menu:has(.dropdown-submenu),
  #navbar-second #mainmenu > li.open > .dropdown-menu:has(.dropdown-submenu){display:block !important;}
}

/* ==================================================================================
   PILIH LOKET — total redesign (modern status cards)
   ================================================================================== */
.dh-loket-page .dh-loket-wrap{max-width:1160px;margin:0 auto;padding:8px 8px 24px;}
.dh-loket-page .dh-loket-head{text-align:center;margin:6px 0 26px;}
.dh-loket-page .dh-loket-title{font-size:22px;font-weight:800;letter-spacing:.5px;color:#1f2d3d;margin:0 0 8px;}
.dh-loket-page .dh-loket-sub{font-size:13px;color:#6b7a89;margin:0;display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:center;}
.dh-loket-page .dh-loket-sub b{color:#1f2d3d;}
.dh-loket-page .dh-loket-sep{color:#c7d0d9;margin:0 4px;}
.dh-loket-page .dh-dot{width:9px;height:9px;border-radius:50%;display:inline-block;}
.dh-loket-page .dh-dot.free{background:#12b39a;} .dh-loket-page .dh-dot.busy{background:#e5484d;}

.dh-loket-page .dh-loket-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;}

/* card base */
.dh-loket-page .dh-loket-card{position:relative;display:flex;align-items:center;gap:16px;
  background:#fff;border:1px solid #e6ebf1;border-radius:16px;padding:18px 18px;overflow:hidden;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;}
.dh-loket-page .dh-loket-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;border-radius:16px 0 0 16px;}

/* icon */
.dh-loket-page .dh-loket-ico{position:relative;flex:0 0 auto;width:64px;height:64px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;background:#f2f7f6;}
.dh-loket-page .dh-loket-ico img{width:42px;height:42px;object-fit:contain;}
.dh-loket-page .dh-loket-no{position:absolute;right:-6px;bottom:-6px;min-width:22px;height:22px;padding:0 5px;
  border-radius:11px;background:#12b39a;color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 6px rgba(18,179,154,.4);border:2px solid #fff;}

/* body */
.dh-loket-page .dh-loket-body{min-width:0;flex:1;}
.dh-loket-page .dh-loket-kicker{font-size:10px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:#9aa7b4;margin-bottom:2px;}
.dh-loket-page .dh-loket-name{font-size:15px;font-weight:700;color:#1f2d3d;line-height:1.3;margin-bottom:6px;}
.dh-loket-page .dh-loket-user{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:#8a97a4;}
.dh-loket-page .dh-loket-user svg{color:#e5484d;}
.dh-loket-page .dh-loket-cta{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:#12b39a;opacity:.85;}

/* status badge */
.dh-loket-page .dh-loket-badge{position:absolute;top:12px;right:12px;font-size:10.5px;font-weight:800;letter-spacing:.4px;
  text-transform:uppercase;padding:4px 10px;border-radius:999px;display:inline-flex;align-items:center;gap:5px;}
.dh-loket-page .dh-loket-badge::before{content:"";width:6px;height:6px;border-radius:50%;}
.dh-loket-page .dh-loket-badge.free{background:#e6f7f3;color:#0d9488;}
.dh-loket-page .dh-loket-badge.free::before{background:#12b39a;}
.dh-loket-page .dh-loket-badge.busy{background:#fdeaea;color:#d13b40;}
.dh-loket-page .dh-loket-badge.busy::before{background:#e5484d;}

/* available: interactive */
.dh-loket-page .dh-loket-card.available{cursor:pointer;}
.dh-loket-page .dh-loket-card.available::before{background:linear-gradient(180deg,#16c4a9,#0d9488);}
.dh-loket-page .dh-loket-card.available:hover{transform:translateY(-3px);border-color:#12b39a;
  box-shadow:0 16px 32px -14px rgba(18,179,154,.55);}
.dh-loket-page .dh-loket-card.available:hover .dh-loket-ico{background:#e6f7f3;}
.dh-loket-page .dh-loket-card.available:hover .dh-loket-cta{opacity:1;}
.dh-loket-page .dh-loket-card.available:focus-visible{outline:none;border-color:#12b39a;box-shadow:0 0 0 3px rgba(18,179,154,.25);}

/* occupied: muted, not clickable */
.dh-loket-page .dh-loket-card.occupied{background:#fbfcfd;cursor:not-allowed;}
.dh-loket-page .dh-loket-card.occupied::before{background:#e5484d;opacity:.55;}
.dh-loket-page .dh-loket-card.occupied .dh-loket-ico{background:#f4f6f8;filter:grayscale(.35);}
.dh-loket-page .dh-loket-card.occupied .dh-loket-no{background:#b6c0c9;box-shadow:none;}
.dh-loket-page .dh-loket-card.occupied .dh-loket-name{color:#66727e;}

@media(max-width:640px){.dh-loket-page .dh-loket-grid{grid-template-columns:1fr;}}

/* ---- PILIH LOKET refine: bigger type, more space, stronger contrast/tint ---- */
.dh-loket-page .dh-loket-wrap{max-width:1220px;padding:8px 8px 32px;}
.dh-loket-page .dh-loket-head{margin:6px 0 32px;}
.dh-loket-page .dh-loket-title{font-size:26px;margin:0 0 10px;}
.dh-loket-page .dh-loket-sub{font-size:14.5px;gap:7px;}
.dh-loket-page .dh-dot{width:10px;height:10px;}
.dh-loket-page .dh-loket-grid{grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:20px;}

/* card: more padding, elevation, subtle status tint + stronger border */
.dh-loket-page .dh-loket-card{gap:18px;padding:22px 22px;border-width:1.5px;
  box-shadow:0 4px 14px -6px rgba(16,40,60,.14);}
.dh-loket-page .dh-loket-card::before{width:6px;}
.dh-loket-page .dh-loket-card.available{background:#f4faf9;border-color:#cfe4df;}
.dh-loket-page .dh-loket-card.occupied{background:#fcf5f5;border-color:#ecd6d6;}
.dh-loket-page .dh-loket-card.available:hover{background:#eef8f6;border-color:#12b39a;
  box-shadow:0 18px 36px -14px rgba(18,179,154,.5);}

/* icon bigger */
.dh-loket-page .dh-loket-ico{width:74px;height:74px;border-radius:18px;background:#e9f5f2;}
.dh-loket-page .dh-loket-ico img{width:48px;height:48px;}
.dh-loket-page .dh-loket-card.occupied .dh-loket-ico{background:#f6 eeee;background:#f7eded;}
.dh-loket-page .dh-loket-no{min-width:24px;height:24px;font-size:13px;border-radius:12px;}

/* text bigger */
.dh-loket-page .dh-loket-kicker{font-size:11px;letter-spacing:1.6px;margin-bottom:3px;}
.dh-loket-page .dh-loket-name{font-size:17px;line-height:1.35;margin-bottom:9px;}
.dh-loket-page .dh-loket-user{font-size:14px;gap:7px;}
.dh-loket-page .dh-loket-user svg{width:16px;height:16px;}
.dh-loket-page .dh-loket-cta{font-size:14.5px;gap:7px;}
.dh-loket-page .dh-loket-cta svg{width:17px;height:17px;}
.dh-loket-page .dh-loket-badge{font-size:11.5px;padding:5px 12px;top:14px;right:14px;}

/* ---- PILIH LOKET: loading spinner (replaces plain "loading...") ---- */
.dh-loket-page .dh-loket-card.available.disabled,
.dh-loket-page .dh-loket-card.available[disabled]{opacity:1;pointer-events:none;}
.dh-loket-loading{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
  font-size:15px;font-weight:700;color:#0d9488;padding:8px 0;}
.dh-spin{width:20px;height:20px;border-radius:50%;border:2.5px solid #cdeae4;border-top-color:#12b39a;
  display:inline-block;animation:dh-spin .7s linear infinite;}
@keyframes dh-spin{to{transform:rotate(360deg)}}

/* ==================================================================================
   THEMED CONFIRM DIALOG (docoHealth question dialog) — matches DHealth theme
   ================================================================================== */
#confirm-dialog-overlay{background:rgba(13,24,43,.55) !important;opacity:1 !important;
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:1080 !important;}
#confirm-dialog{width:min(430px,92vw) !important;height:auto !important;min-height:0 !important;
  background:#fff !important;border-radius:18px !important;overflow:hidden !important;
  box-shadow:0 30px 70px -20px rgba(0,0,0,.55) !important;z-index:1081 !important;padding:0 !important;
  animation:dh-pop .16s ease-out;}
@keyframes dh-pop{from{opacity:0;transform:translate(-50%,-46%) scale(.96)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
#confirm-dialog .confirm-message-text{display:block !important;height:auto !important;
  padding:30px 28px 22px !important;text-align:center !important;font-size:15px !important;color:#5a6b7b;line-height:1.5;}
/* rich confirm content */
.dh-cf-ico{width:66px;height:66px;margin:0 auto 14px;border-radius:18px;background:#e9f5f2;
  display:flex;align-items:center;justify-content:center;}
.dh-cf-ico img{width:40px;height:40px;object-fit:contain;}
.dh-cf-title{display:block;font-size:18px;font-weight:800;color:#1f2d3d;margin-bottom:8px;}
.dh-cf-loket{display:block;font-size:16px;font-weight:700;color:#0d9488;background:#e6f7f3;
  border-radius:10px;padding:9px 14px;margin:0 auto 12px;max-width:320px;}
.dh-cf-note{display:block;font-size:13.5px;color:#8a97a4;max-width:330px;margin:0 auto;}
/* buttons */
#confirm-dialog .button-place{padding:6px 20px 20px !important;gap:12px !important;background:transparent !important;}
#confirm-dialog button{border-radius:12px !important;padding:12px 16px !important;font-weight:700 !important;
  font-size:14.5px !important;border:0 !important;transition:background .15s, transform .1s !important;flex:1;}
#confirm-dialog button:active{transform:translateY(1px);}
#confirm-dialog .button-yes{background:var(--dh-primary,#12b39a) !important;color:#fff !important;
  box-shadow:0 8px 18px -8px rgba(18,179,154,.7) !important;order:2;}
#confirm-dialog .button-yes:hover{background:var(--dh-primary-d,#0d8478) !important;}
#confirm-dialog .button-no{background:#eef2f6 !important;color:#5a6b7b !important;order:1;}
#confirm-dialog .button-no:hover{background:#e2e8ee !important;color:#1f2d3d !important;}

/* ==================================================================================
   PENDAFTARAN daftar/index — declutter recent-patients print toolbar + polish
   ================================================================================== */
@media(min-width:992px){
  /* the print "action soup" -> tidy labelled toolbar of outline chips */
  .panel-toolbar:has(.btn-print-pasien-terakhir){
    display:flex !important;flex-wrap:wrap;gap:8px;align-items:center;
    padding:12px 18px !important;background:#fbfcfd;border-bottom:1px solid var(--dh-line,#e6ebf1);}
  .panel-toolbar:has(.btn-print-pasien-terakhir)::before{
    content:"CETAK";font-size:10.5px;font-weight:800;letter-spacing:1px;color:#9aa7b4;margin-right:6px;}
  .btn-print-pasien-terakhir{
    background:#fff !important;border:1px solid #d7e0e8 !important;color:#475467 !important;
    border-radius:9px !important;padding:7px 13px 7px 32px !important;font-size:12.5px !important;font-weight:600 !important;
    box-shadow:none !important;margin:0 !important;position:relative !important;overflow:visible;min-width:0;transition:.13s;}
  .btn-print-pasien-terakhir:hover{background:var(--dh-primary-t) !important;border-color:var(--dh-primary) !important;color:var(--dh-primary-d) !important;}
  /* Limitless btn-labeled icon block -> simple inline teal icon */
  .btn-print-pasien-terakhir > b{background:transparent !important;border:0 !important;padding:0 !important;margin:0 !important;
    position:absolute !important;left:11px !important;top:50% !important;transform:translateY(-50%) !important;width:auto !important;}
  .btn-print-pasien-terakhir > b .fa,.btn-print-pasien-terakhir .fa{color:var(--dh-primary) !important;font-size:13px !important;}
  .btn-print-pasien-terakhir:hover > b .fa,.btn-print-pasien-terakhir:hover .fa{color:var(--dh-primary-d) !important;}
}
/* recent-patients panel: clean card */
.panel:has(.btn-print-pasien-terakhir){border:1px solid var(--dh-line,#e6ebf1) !important;border-radius:14px !important;
  box-shadow:0 1px 3px rgba(16,40,60,.05) !important;overflow:hidden;}
.panel:has(.btn-print-pasien-terakhir) > .panel-heading{background:#fff !important;border-bottom:1px solid var(--dh-line,#e6ebf1);padding:16px 18px;}
.panel:has(.btn-print-pasien-terakhir) .panel-title h3{font-size:15px !important;font-weight:800 !important;color:#1f2d3d !important;margin:0 !important;}

/* ==================================================================================
   DAFTAR/INDEX fixes: content gutters + flatten nested form boxes + bigger fonts
   ================================================================================== */
@media(min-width:992px){
  /* point 2: real breathing room (replaces old 2px hack) */
  body:has(#dh-rail) .content-wrapper{padding-left:22px !important;padding-right:22px !important;}
}
/* point 1: inner TIPE PASIEN is a SECTION, not a nested box (outer "Form Pendaftaran" panel is the box) */
#form-parent > .panel{border:0 !important;box-shadow:none !important;background:transparent !important;border-radius:0 !important;}
#form-parent > .panel > .panel-heading{display:none !important;} /* drop duplicate inner heading if any */
#form-parent{margin-top:0 !important;}
#form-parent .steps-basic{padding:4px 6px 8px !important;}
/* bigger, clearer form typography */
#form-parent .control-label,#form-parent label.control-label{font-size:13px !important;}
#form-parent .form-control{font-size:14px !important;height:42px !important;}
#form-parent .select2-selection{min-height:42px !important;}
#form-parent .select2-selection__rendered{font-size:14px !important;line-height:40px !important;}
#form-parent .steps-basic .content > .title{font-size:14px !important;letter-spacing:.7px;}
#form-parent .dh-loket-name,#form-parent .form-group{margin-bottom:18px;}
/* outer Form Pendaftaran panel heading: a bit larger */
#form-parent .steps-basic .body{padding-top:6px;}

/* ==================================================================================
   STANDARD DATA TABLE (global standard — akan dipakai semua tabel, disisir bertahap)
   ================================================================================== */
.content-wrapper table.table,
.content-wrapper table.dataTable{width:100% !important;border-collapse:separate !important;border-spacing:0 !important;
  font-size:13.5px !important;color:#344054;margin:0;}
/* header */
.content-wrapper table.table > thead > tr > th,
.content-wrapper table.dataTable > thead > tr > th{
  background:#f6f8fa !important;color:#64748b !important;font-weight:700 !important;font-size:11.5px !important;
  text-transform:uppercase;letter-spacing:.5px;padding:13px 14px !important;border:0 !important;
  border-bottom:1px solid #e6ebf1 !important;white-space:nowrap;vertical-align:middle;text-align:left;}
/* body cells */
.content-wrapper table.table > tbody > tr > td,
.content-wrapper table.dataTable > tbody > tr > td{
  padding:13px 14px !important;border:0 !important;border-bottom:1px solid #f0f3f7 !important;
  vertical-align:middle;color:#3a4756 !important;background:transparent !important;font-size:13.5px;}
/* remove heavy striping -> clean; subtle hover */
.content-wrapper table.table-striped > tbody > tr:nth-of-type(odd) > td,
.content-wrapper table.table-striped > tbody > tr:nth-of-type(odd){background:transparent !important;}
.content-wrapper table.table > tbody > tr:hover > td,
.content-wrapper table.dataTable > tbody > tr:hover > td{background:#f2faf8 !important;}
.content-wrapper table.dataTable > tbody > tr:last-child > td{border-bottom:0 !important;}
/* sort header interactive */
.content-wrapper table.dataTable > thead > tr > th.sorting,
.content-wrapper table.dataTable > thead > tr > th.sorting_asc,
.content-wrapper table.dataTable > thead > tr > th.sorting_desc{cursor:pointer;}
.content-wrapper table.dataTable > thead > tr > th.sorting_asc,
.content-wrapper table.dataTable > thead > tr > th.sorting_desc{color:var(--dh-primary,#12b39a) !important;}
/* checkbox column tidy */
.content-wrapper table.table > tbody > tr > td input[type=checkbox],
.content-wrapper table.table > thead > tr > th input[type=checkbox]{width:16px;height:16px;accent-color:var(--dh-primary,#12b39a);}
/* wrapper spacing */
.content-wrapper .dataTables_wrapper{padding:0 4px 4px;}
/* DataTables controls (when shown) themed */
.content-wrapper .dataTables_paginate .paginate_button{border-radius:8px !important;border:1px solid #e6ebf1 !important;padding:5px 11px !important;margin:0 2px;color:#475467 !important;background:#fff !important;}
.content-wrapper .dataTables_paginate .paginate_button.current{background:var(--dh-primary,#12b39a) !important;border-color:var(--dh-primary,#12b39a) !important;color:#fff !important;}
.content-wrapper .dataTables_paginate .paginate_button:hover{background:var(--dh-primary-t,#e6f7f3) !important;color:var(--dh-primary-d,#0d8478) !important;}
.content-wrapper .dataTables_length select,.content-wrapper .dataTables_filter input{border:1px solid #dbe2ea !important;border-radius:8px !important;height:34px;padding:0 10px;}

/* wide data tables: scroll horizontally INSIDE their card (no clipping / no page overflow) */
.content-wrapper .dataTables_wrapper{overflow-x:auto !important;overflow-y:visible;}
.content-wrapper .dataTables_wrapper::-webkit-scrollbar{height:8px;}
.content-wrapper .dataTables_wrapper::-webkit-scrollbar-thumb{background:#c9d4dd;border-radius:8px;}
.content-wrapper .dataTables_wrapper::-webkit-scrollbar-track{background:transparent;}
/* recent-patients panel & its toolbar must not clip content */
.panel:has(.btn-print-pasien-terakhir){overflow:visible !important;}
.panel-toolbar:has(.btn-print-pasien-terakhir){overflow:visible !important;}

/* force wide-table horizontal scroll on the wrapper directly (robust) */
div.dataTables_wrapper{overflow-x:auto !important;}
.panel-body:has(> .dataTables_wrapper),.panel-body:has(.btn-print-pasien-terakhir){overflow:visible !important;}

/* hide stray required-* from empty-label multi_payer field in the checkbox row */
#form-parent .chkbox-multi > .form-group > label.control-label,
#form-parent .chkbox-multi .field-tipepasienform-is_multi_payer label.control-label{display:none !important;}

/* (removed risky multi_payer hide — could hide the real Multi Payer field) */

/* ==================================================================================
   DAFTAR/INDEX: compact the top (header+form) so the TABLE rises above the fold
   ================================================================================== */
@media(min-width:992px){
  /* less top offset under fixed bars */
  body:has(#dh-rail) .page-container{margin-top:58px !important;}
  /* header panel: smaller icon + tighter padding */
  .content-wrapper .panel-heading .column-1 img{width:44px !important;height:44px !important;}
  .content-wrapper .panel-heading{padding-top:11px !important;padding-bottom:11px !important;}
}
/* form: tighten vertical rhythm */
#form-parent{margin-top:0 !important;}
#form-parent .steps-basic{padding:2px 6px 2px !important;}
#form-parent .steps-basic .content > .title{margin:6px 0 12px !important;}
#form-parent .form-group{margin-bottom:12px !important;}
#form-parent .control-label{margin-bottom:4px !important;}
#form-parent .form-control{height:40px !important;}
#form-parent .select2-selection{min-height:40px !important;}
#form-parent .select2-selection__rendered{line-height:38px !important;}
/* outer form panel body: trim padding */
.content-wrapper .panel-body.no-border{padding-top:6px !important;padding-bottom:4px !important;}
/* form action bar compact */
#form-parent .actions,#form-parent .text-right:last-child,#form-parent .panel-toolbar{padding:10px 22px !important;}
/* trim gaps between stacked panels */
.content-wrapper > .row,.content-wrapper .row > .col-md-12 > .panel{margin-bottom:12px !important;}
/* print toolbar: denser, aim for one row */
.btn-print-pasien-terakhir{padding:5px 11px 5px 28px !important;font-size:12px !important;}
.panel-toolbar:has(.btn-print-pasien-terakhir){padding:9px 16px !important;gap:6px !important;}
/* elevate + highlight the recent-patients table (the key info) */
.panel:has(.btn-print-pasien-terakhir){box-shadow:0 6px 22px -10px rgba(16,40,60,.16) !important;border-color:#dbe4ec !important;}
.panel:has(.btn-print-pasien-terakhir) .panel-title h3{font-size:16px !important;}
.panel:has(.btn-print-pasien-terakhir) .panel-title h3::before{content:"";display:inline-block;width:5px;height:17px;border-radius:3px;background:var(--dh-primary,#12b39a);margin-right:9px;vertical-align:-2px;}

/* daftar/index: fields in ONE row (3 cols) to shrink form height; header tighter */
@media(min-width:992px){
  #form-parent .pasien-aps > .col-sm-3:not([class*="multi"]){grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:0 22px !important;}
  /* header row tighter: breadcrumb closer to title */
  .content-wrapper .panel-heading .column-2 h3.panel-title{margin-bottom:2px !important;font-size:16px !important;}
  .content-wrapper .panel-heading .breadcrumb{margin:0 !important;padding:0 !important;font-size:12px;}
  /* Keterangan legend compact + inline */
  .content-wrapper .panel:has(.btn-print-pasien-terakhir) .keterangan,
  .content-wrapper [class*="keterangan"]{margin:4px 0 !important;padding:0 16px !important;font-size:12px;}
}

/* ==================================================================================
   DAFTAR/INDEX: kill wasted vertical space so the table dominates
   ================================================================================== */
@media(min-width:992px){
  /* (a) trim the empty grey gap above the first panel */
  body:has(#dh-rail) .content-wrapper{padding-top:6px !important;}
  body:has(#dh-rail) .page-container{margin-top:52px !important;}
  .content-wrapper > .row:first-child,.content-wrapper .row:first-of-type{margin-top:0 !important;}
  /* header panel: compact */
  .content-wrapper .panel-heading{padding-top:9px !important;padding-bottom:9px !important;}
  .content-wrapper .panel-heading .column-1 img{width:40px !important;height:40px !important;}
  /* (b) form: shrink to content, kill empty bottom, compact action bar */
  #form-parent .steps-basic{padding:2px 6px 0 !important;}
  #form-parent .steps-basic .content > .title{margin:4px 0 10px !important;}
  #form-parent .form-group{margin-bottom:10px !important;}
  #form-parent .steps-basic .content > .body{padding-bottom:0 !important;}
  #form-parent .actions,#form-parent .text-right:last-child{padding:8px 22px !important;margin-top:4px !important;}
  .content-wrapper .panel-body.no-border{padding:4px 14px !important;}
  /* (c) gaps between the 3 stacked panels -> tight */
  .content-wrapper .row > .col-md-12 > .panel,.content-wrapper .row > .col-md-12{margin-bottom:10px !important;}
  /* print toolbar + legend: compact */
  .panel-toolbar:has(.btn-print-pasien-terakhir){padding:8px 16px !important;}
  .panel:has(.btn-print-pasien-terakhir) .panel-heading{padding:12px 16px !important;}
}

/* daftar/index: compact the recent-patients panel top so table rows rise */
@media(min-width:992px){
  /* first panel body padding trim */
  .content-wrapper .panel-white > .panel-body{padding:8px 14px !important;}
  /* recent-patients heading tighter */
  .panel:has(.btn-print-pasien-terakhir) > .panel-heading{padding:10px 16px !important;}
  /* CETAK toolbar: denser chips, tighter row gap */
  .btn-print-pasien-terakhir{padding:4px 10px 4px 26px !important;font-size:11.5px !important;}
  .btn-print-pasien-terakhir > b{left:9px !important;}
  .panel-toolbar:has(.btn-print-pasien-terakhir){padding:7px 16px !important;gap:5px !important;}
  /* Keterangan legend -> compact single line */
  .panel:has(.btn-print-pasien-terakhir) .dataTables_wrapper,
  .panel:has(.btn-print-pasien-terakhir) .panel-body{padding-top:2px !important;}
}
/* Keterangan block: inline, small */
.keterangan,[id*="keterangan" i],.legend-keterangan{margin:2px 0 !important;font-size:11.5px;}

/* daftar/index: kill the empty grey gap above the first panel (content starts right under fixed bars) */
@media(min-width:992px){
  body:has(#dh-rail) .page-container{margin-top:8px !important;}
  body:has(#dh-rail) .content-wrapper{padding-top:4px !important;}
}

/* ==================================================================================
   PENDAFTARAN FORM — HOLISTIC CLEAN REDESIGN (authoritative; overrides earlier layers)
   ================================================================================== */
@media(min-width:992px){
  /* --- 1. NO inner boxes: TIPE PASIEN is a plain section, proper spacing to first field --- */
  #form-parent, #form-parent > .panel, #form-parent .steps-basic, #form-parent .steps-basic .content,
  #form-parent fieldset, #form-parent fieldset > .row{
    border:0 !important;box-shadow:none !important;background:transparent !important;border-radius:0 !important;}
  #form-parent{padding:4px 8px 0 !important;}
  #form-parent .steps-basic{padding:0 !important;}
  #form-parent .steps-basic .content > .title{margin:2px 0 18px !important;padding:0 !important;}
  #form-parent .steps-basic .content > .body{padding:0 !important;}

  /* --- 2. UNIFIED responsive field grid: fields fill width, no empty right --- */
  #form-parent .pasien-aps,
  #form-parent .pasien-aps > .col-sm-3:not([class*="multi"]){
    display:grid !important;grid-template-columns:repeat(auto-fit,minmax(300px,1fr)) !important;gap:2px 28px !important;align-items:start;}
  #form-parent .pasien-aps > *{width:auto !important;max-width:none !important;float:none !important;padding:0 !important;grid-column:auto !important;}
  /* full-width fields (No RM search) span all columns */
  #form-parent .pasien-aps > *:has(#no_rekam_medik){grid-column:1 / -1 !important;}
  #form-parent .form-group{margin-bottom:16px !important;}
  #form-parent .control-label{font-size:13px !important;font-weight:700;color:#5a6b7b;margin-bottom:6px;}
  #form-parent .form-control,#form-parent .select2-selection{height:42px !important;min-height:42px !important;}

  /* --- 3. CLEAN action bar (wizard Kembali/Submit): transparent, separator, themed buttons --- */
  #form-parent .actions,#form-parent .steps-basic > .actions{
    background:transparent !important;border-top:1px solid var(--dh-line,#e6ebf1) !important;
    padding:14px 4px 2px !important;margin:14px 0 0 !important;display:flex;justify-content:flex-end;gap:10px;}
  #form-parent .actions ul{display:flex;gap:10px;margin:0;padding:0;}
  #form-parent .actions a,#form-parent .actions .btn{border-radius:10px !important;padding:10px 24px !important;font-weight:700 !important;font-size:14px !important;border:0 !important;}
  #form-parent .actions [href*="previous"],#form-parent .actions li:first-child a{background:#eef2f6 !important;color:#5a6b7b !important;}
  #form-parent .actions [href*="finish"],#form-parent .actions [href*="next"],#form-parent .actions li:last-child a{
    background:var(--dh-primary,#12b39a) !important;color:#fff !important;box-shadow:0 8px 18px -8px rgba(18,179,154,.6) !important;}

  /* --- 4. Header toolbar (antrian): vertically centered, not touching bottom border --- */
  .content-wrapper .panel-heading{display:flex;align-items:center;min-height:64px;}
  .content-wrapper .panel-heading .heading-elements{position:static !important;display:flex;align-items:center;gap:10px;margin-left:auto;padding:0 !important;}
  .content-wrapper .panel-heading .heading-elements .form-group{margin:0 !important;}
}

/* FIX: don't flex the whole panel-heading (broke icon/title); only center the antrian toolbar */
@media(min-width:992px){
  .content-wrapper .panel-heading{display:block !important;min-height:0 !important;position:relative !important;padding:12px 16px !important;}
  .content-wrapper .panel-heading .heading-elements{position:absolute !important;top:50% !important;right:16px !important;
    transform:translateY(-50%) !important;left:auto !important;margin:0 !important;display:flex !important;align-items:center;gap:10px;}
  .content-wrapper .panel-heading .heading-elements .icons-list{display:flex !important;align-items:center;gap:10px;margin:0 !important;}
  .content-wrapper .panel-heading .heading-elements .form-group{margin:0 !important;}
}

/* ==================================================================================
   PENDAFTARAN FORM — BPJS/asuransi fixes: datepicker clipping + sane field widths
   ================================================================================== */
@media(min-width:992px){
  /* (a) date-picker & dropdowns inside the form must NOT be clipped by any ancestor overflow */
  #form-parent, #form-parent .steps-basic, #form-parent .steps-basic .content, #form-parent fieldset,
  #form-parent fieldset > .row, #form-parent .pasien-aps, #form-parent [class*="col-"],
  #form-parent #form-bpjs, #form-parent #form-bpjs .col-sm-3,
  #form-parent #form-bpjs-content, #form-parent #form-rujukan-content,
  #form-parent .panel, #form-parent .panel-white,
  .content-wrapper .panel-white > .panel-body{overflow:visible !important;}
  /* datepicker popup above everything */
  .datepicker,.datepicker-dropdown,.bootstrap-datetimepicker-widget,.kv-datepicker,.dropdown-menu.datepicker{z-index:1200 !important;}
  /* pickadate (theme's date widget) uses .picker__* — its absolute holder had no z-index,
     so later siblings (a .col-md-12 block after the fieldset) painted OVER the day grid.
     Lift the whole picker into its own high stacking context so the days show on top. */
  #form-parent .picker,.picker__holder,.picker__frame,.picker__box{z-index:1300 !important;}
  #form-parent .picker{position:absolute !important;}
  /* the pickadate panel had no opaque background of its own — it only "looked" fine where it
     overlapped the white card; the day grid extends BELOW the card edge onto the grey page,
     where its light-grey numbers were invisible. Give the popup a real floating white panel. */
  #form-parent .picker__holder,#form-parent .picker__frame,#form-parent .picker__box{
    background:#fff !important;}
  #form-parent .picker__box{
    box-shadow:0 10px 30px rgba(16,24,40,.20) !important;border:1px solid #e3e8ef !important;
    border-radius:12px !important;padding:14px 16px 16px !important;}
  /* keep the popup's own layers from re-introducing an inner clip */
  #form-parent .picker__holder,#form-parent .picker__frame,#form-parent .picker__box{overflow:visible !important;max-height:none !important;}
  /* REAL clipper: the app's main scroll containers .content-wrapper/.page-content have
     overflow hidden/auto (bottom ~680px) and cut the calendar (extends to ~936px). Relax
     them ONLY on the pendaftaran form page (scoped by :has(#form-parent)) so no global
     layout regression; the wide "10 terakhir" table keeps its own inner overflow-x scroll. */
  body:has(#form-parent) .content-wrapper,
  body:has(#form-parent) .page-content{overflow:visible !important;}
  /* nested cards: the OUTER .panel-white wrapping the form also has overflow:hidden and clips
     the calendar at the card edge. Relax every card on the form page (their wide inner tables
     keep their own .dataTables_wrapper overflow-x scroll, so no layout harm). */
  body:has(#form-parent) .panel.panel-white{overflow:visible !important;}





  /* (c) BPJS field re-arrangement: NOT applied blind — needs live BPJS state to verify safely (input+button groups must stay paired). To be done with user testing. */
}

/* ---- Pendaftaran form: UNIFORM spacing (safe, doesn't restructure input-groups) ---- */
#form-parent .form-group{margin-bottom:16px !important;}
#form-parent .control-label{margin-bottom:6px !important;line-height:1.3;}
/* keep bootstrap input-groups intact & adjacent (undo any width tampering) */
#form-parent .input-group{width:100% !important;}
#form-parent .input-group > .form-control,#form-parent .input-group > .select2-container{float:none !important;}

/* ==================================================================================
   PENDAFTARAN FORM — CLEAN FIELD SYSTEM v2 (authoritative; uniform spacing, input-groups safe)
   ================================================================================== */
@media(min-width:992px){
  /* A. all field areas -> responsive auto-fit grid (fills width, no empty right) */
  #form-parent .pasien-aps,
  #form-parent #form-bpjs-content,
  #form-parent #form-rujukan-content,
  #form-parent #form-asuransi-content{
    display:grid !important;grid-template-columns:repeat(auto-fit,minmax(330px,1fr)) !important;
    gap:0 30px !important;align-items:start !important;}
  /* B. flatten bootstrap col wrappers so each FIELD (form-group) becomes a grid item */
  #form-parent #form-bpjs-content > .col-sm-6,
  #form-parent #form-rujukan-content > .col-sm-6,
  #form-parent #form-rujukan-content > [class*="col-"],
  #form-parent #form-asuransi-content > .col-sm-6{display:contents !important;}
  #form-parent .pasien-aps > *{width:auto !important;max-width:none !important;float:none !important;padding:0 !important;grid-column:auto;}
  /* C. each field vertical: label on top + input full width of its cell */
  #form-parent .form-group{margin-bottom:16px !important;}
  #form-parent .form-group > .control-label[class*="col-"]{
    width:100% !important;float:none !important;text-align:left !important;padding:0 0 6px !important;margin:0 !important;}
  #form-parent .form-group > [class*="col-md-"]:not(.control-label),
  #form-parent .form-group > [class*="col-sm-"]:not(.control-label){width:100% !important;float:none !important;padding:0 !important;}
  /* D. PRESERVE input-groups: input + addon buttons stay adjacent (bootstrap-3 table model) */
  #form-parent .input-group{display:table !important;width:100% !important;}
  #form-parent .input-group > .form-control{display:table-cell !important;float:none !important;}
  #form-parent .input-group-addon,#form-parent .input-group-btn{display:table-cell !important;width:1% !important;white-space:nowrap;vertical-align:middle;}
  /* E. No RM search spans full width */
  #form-parent .pasien-aps > *:has(#no_rekam_medik){grid-column:1 / -1 !important;}
  /* consistent control sizing */
  #form-parent .form-control,#form-parent .select2-selection{height:42px !important;min-height:42px !important;}
}

/* ---- input-group fields (No Asuransi, No RM, datepicker): cap width so addon buttons stay next to input ---- */
@media(min-width:992px){
  #form-parent .input-group{max-width:600px !important;}
  #form-parent .input-group-btn > .btn,#form-parent .input-group-btn > a{padding:0 14px !important;height:42px;display:inline-flex;align-items:center;}
  #form-parent .input-group-addon{padding:0 13px !important;}
  /* No RM 'Pasien lama' prepend: comfy padding, clear separation */
  #form-parent .input-group-addon:first-child{padding:0 14px !important;background:#f4f7fa !important;}
}

/* ==================================================================================
   PENDAFTARAN — BPJS SEP block: REAL rendered structure is #form-bpjs.row > ONE .col-sm-3
   (25% wide) holding jenis_rujukan, tanggal_sep, #asal_rujukan_manual, #base-rujukan.
   That single narrow column is why every SEP field stacked left with the right half empty.
   Fix: expand the column to full width and flow its field-groups across an auto-fit grid.
   ================================================================================== */
@media(min-width:992px){
  /* the lone .col-sm-3 must own the full row width */
  #form-parent #form-bpjs > .col-sm-3{
    width:100% !important;float:none !important;padding:0 !important;
    display:grid !important;
    grid-template-columns:repeat(auto-fit,minmax(330px,1fr)) !important;
    gap:0 30px !important;align-items:start !important;}
  /* each SEP field-group / wrapper becomes a grid cell that fills its column */
  #form-parent #form-bpjs > .col-sm-3 > .form-group,
  #form-parent #form-bpjs > .col-sm-3 > #asal_rujukan_manual,
  #form-parent #form-bpjs > .col-sm-3 > #base-rujukan,
  #form-parent #form-bpjs > .col-sm-3 > #base-rujukan-manual{
    width:100% !important;float:none !important;margin:0 0 16px !important;min-width:0 !important;}
  /* the plain-div wrappers carry a single field each — no extra inner spacing */
  #form-parent #form-bpjs #asal_rujukan_manual > .form-group,
  #form-parent #form-bpjs #base-rujukan > .form-group{margin:0 !important;}
  /* the Jenis Pencarian radios read better spanning the top row */
  #form-parent #form-bpjs > .col-sm-3 > .form-group:has(#jenis_rujukan){grid-column:1 / -1 !important;}
}


/* ==================================================================================
   PENDAFTARAN — "10 Pasien Terakhir" table: show ALL 10 rows (DataTables scrollX split
   the body into .dataTables_scroll/.dataTables_scrollBody and clipped it to ~6 rows) + polish.
   ================================================================================== */
/* A. kill the vertical clip; keep horizontal scroll for the wide (12-col) table */
#table-daftar-terakhir_wrapper .dataTables_scroll{overflow:visible !important;}
#table-daftar-terakhir_wrapper .dataTables_scrollBody{
  max-height:none !important;height:auto !important;overflow-y:visible !important;overflow-x:auto !important;}
#table-daftar-terakhir_wrapper .dataTables_scrollHead{overflow:visible !important;}
/* B. table polish */
#table-daftar-terakhir_wrapper{border:1px solid var(--dh-line2);border-radius:12px;overflow:visible;background:#fff;}
#table-daftar-terakhir.dataTable{margin:0 !important;border-collapse:separate !important;border-spacing:0 !important;}
#table-daftar-terakhir_wrapper .dataTables_scrollHead thead th,
#table-daftar-terakhir thead th{
  background:#f6f8fb !important;color:#475467 !important;font-weight:700 !important;
  font-size:11.5px !important;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;
  padding:12px 14px !important;border-bottom:2px solid var(--dh-line2) !important;}
#table-daftar-terakhir tbody td{
  padding:11px 14px !important;font-size:13px !important;color:var(--dh-ink) !important;
  border-bottom:1px solid var(--dh-line) !important;vertical-align:middle;white-space:nowrap;}
#table-daftar-terakhir tbody tr:last-child td{border-bottom:0 !important;}
#table-daftar-terakhir tbody tr:nth-child(even) td{background:#f9fbfc !important;}
#table-daftar-terakhir tbody tr:hover td{background:var(--dh-primary-t) !important;cursor:pointer;}
#table-daftar-terakhir tbody tr.selected td,
#table-daftar-terakhir tbody tr.active td{background:#d7efe9 !important;}
/* Cara Bayar / status readability */
#table-daftar-terakhir tbody td:nth-child(11){font-weight:600;}

/* ==================================================================================
   REDESIGN-ALL (task#72) — konformitas design-system per KELUARGA masalah
   Sesuai design-guidelines.html: teks putih hanya di atas warna solid; solid teal
   maks 1 per bar aksi; sisanya pill putih ikon teal; token --dh-* saja.
   ================================================================================== */

/* ---- KELUARGA A: tombol toolbar (generateToolbar/report bar) ----
   Sebelum: banyak .btn-info teal + teks putih (washed/kontras lemah, solid semua).
   Sesudah: pill putih + teks gelap + ikon teal (pola bar CETAK); SOLID teal hanya
   tombol pencarian/submit utama. */
.panel-toolbar .btn-info,
.panel-toolbar .btn.btn-labeled{
  background:#fff !important;border:1px solid var(--dh-line2) !important;color:#344054 !important;
  border-radius:999px !important;font-weight:600;box-shadow:none !important;}
.panel-toolbar .btn-info .fa,.panel-toolbar .btn-info [class^="icon-"],
.panel-toolbar .btn.btn-labeled .fa,.panel-toolbar .btn.btn-labeled [class^="icon-"]{color:var(--dh-primary) !important;}
.panel-toolbar .btn-info > b,.panel-toolbar .btn.btn-labeled > b{
  background:transparent !important;border:0 !important;padding:0 4px 0 0 !important;margin:0 !important;}
.panel-toolbar .btn-info:hover,.panel-toolbar .btn.btn-labeled:hover{
  background:var(--dh-primary-t) !important;border-color:var(--dh-primary) !important;color:var(--dh-primary-d) !important;}
/* aksi utama bar: tombol cari/submit tetap SOLID teal (satu-satunya) */
.panel-toolbar .btn-info.data-search,.panel-toolbar .data-search,
.panel-toolbar button[type=submit].btn-info{
  background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;color:#fff !important;}
.panel-toolbar .data-search .fa{color:#fff !important;}
.panel-toolbar .data-search:hover{background:var(--dh-primary-d) !important;}
/* disabled: pill pudar, bukan teal pucat+putih */
.panel-toolbar .btn[disabled],.panel-toolbar .btn.disabled{
  background:#f7f9fb !important;color:#98a2b3 !important;border-color:var(--dh-line) !important;opacity:1 !important;}
.panel-toolbar .btn[disabled] .fa{color:#c3ccd6 !important;}

/* ---- KELUARGA B: .btn-info liar di konten (dcms nestable, baris aksi, dsb) ----
   cyan mentah Limitless -> tint teal + teks/ikon teal-gelap; hover solid.
   (rule umum; varian toolbar/modal di-assert ULANG di bawah agar menang kaskade) */
.content-wrapper .btn-info{
  background:var(--dh-primary-t) !important;border:1px solid #cdeae4 !important;color:var(--dh-primary-d) !important;
  text-shadow:none !important;}
.content-wrapper .btn-info:hover{
  background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;color:#fff !important;}
.content-wrapper .btn-info .fa{color:inherit !important;}
/* tombol hapus per-baris: tint danger + ikon merah (bukan blok merah menyala) */
.content-wrapper .dd-item .btn-danger,.content-wrapper .dd3-content .btn-danger,
.content-wrapper td .btn-danger.btn-xs,.content-wrapper td .btn-danger.btn-sm{
  background:var(--dh-danger-t) !important;border:1px solid #f5c2c2 !important;color:var(--dh-danger) !important;}
.content-wrapper .dd-item .btn-danger:hover,.content-wrapper .dd3-content .btn-danger:hover,
.content-wrapper td .btn-danger.btn-xs:hover,.content-wrapper td .btn-danger.btn-sm:hover{
  background:var(--dh-danger) !important;color:#fff !important;}

/* ---- KELUARGA C: sisa .bg-inverse (band navy) di area konten ---- */
.content-wrapper table .bg-inverse,.content-wrapper table .bg-inverse th,.content-wrapper table .bg-inverse td,
.content-wrapper .panel .bg-inverse:not(.modal-header){
  background:#f6f8fb !important;color:#475467 !important;border-color:var(--dh-line2) !important;}
.content-wrapper table .bg-inverse th{font-weight:700 !important;}
/* blok gelap lain (slate/grey-800) di konten tabel/panel */
.content-wrapper table .bg-slate,.content-wrapper table .bg-grey,.content-wrapper table [class*="bg-grey-"]{
  background:#f6f8fb !important;color:#475467 !important;}

/* ---- KELUARGA E: tombol/blok inverse gelap (kotak search besar dsb) ---- */
.content-wrapper .btn-inverse,.content-wrapper .btn.bg-slate,.content-wrapper .btn.bg-grey{
  background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;color:#fff !important;border-radius:10px !important;}
.content-wrapper .btn-inverse:hover{background:var(--dh-primary-d) !important;}

/* re-assert (harus MENANG dari rule umum .btn-info di atas) */
.content-wrapper .panel-toolbar .btn-info{
  background:#fff !important;border:1px solid var(--dh-line2) !important;color:#344054 !important;
  border-radius:999px !important;}
.content-wrapper .panel-toolbar .btn-info .fa{color:var(--dh-primary) !important;}
.content-wrapper .panel-toolbar .btn-info:hover{
  background:var(--dh-primary-t) !important;border-color:var(--dh-primary) !important;color:var(--dh-primary-d) !important;}
.content-wrapper .panel-toolbar .btn-info.data-search,
.content-wrapper .panel-toolbar button[type=submit].btn-info{
  background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;color:#fff !important;}
.content-wrapper .panel-toolbar .btn-info.data-search .fa{color:#fff !important;}
.content-wrapper .panel-toolbar .btn[disabled],.content-wrapper .panel-toolbar .btn.disabled{
  background:#f7f9fb !important;color:#98a2b3 !important;border-color:var(--dh-line) !important;}
.modal-content .btn-info{background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;color:#fff !important;}
.modal-content .btn-info .fa{color:#fff !important;}
/* custom app class btn-dark-turquise (DarkTurquoise hardcode, 42 pemakaian) -> tint teal */
.content-wrapper .btn-dark-turquise{
  background:var(--dh-primary-t) !important;border:1px solid #cdeae4 !important;color:var(--dh-primary-d) !important;}
.content-wrapper .btn-dark-turquise:hover{
  background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;color:#fff !important;}
.content-wrapper .btn-dark-turquise .fa{color:inherit !important;}
/* blok toggle filter (informasi-pasien/worklist): slate gelap -> pill TINT teal (toggle, bukan aksi utama) */
.content-wrapper .more-filter{
  background:var(--dh-primary-t) !important;border:1px solid #cdeae4 !important;border-radius:999px !important;
  color:var(--dh-primary-d) !important;cursor:pointer;box-shadow:none !important;}
.content-wrapper .more-filter p,.content-wrapper .more-filter .fa,.content-wrapper .more-filter i{
  color:var(--dh-primary-d) !important;}
.content-wrapper .more-filter:hover{background:var(--dh-primary) !important;}
.content-wrapper .more-filter:hover p,.content-wrapper .more-filter:hover .fa,.content-wrapper .more-filter:hover i{color:#fff !important;}

/* ==================================================================================
   WORKLIST PASIEN (task#73) — /rajal /igd /ranap /bedah — rekomendasi UX 1-7
   ================================================================================== */
/* #1 legend dikolaps: bar ringkas satu baris */
.dh-legend-bar{margin:2px 0 10px;}
.dh-legend-toggle{background:#fff !important;border:1px solid var(--dh-line2) !important;color:#475467 !important;
  border-radius:999px !important;font-weight:600;font-size:12.5px;padding:6px 14px;box-shadow:none !important;}
.dh-legend-toggle .fa-info-circle{color:var(--dh-primary);}
.dh-legend-toggle:hover{background:var(--dh-primary-t) !important;border-color:var(--dh-primary) !important;color:var(--dh-primary-d) !important;}
.dh-legend-count{background:var(--dh-primary-t);color:var(--dh-primary-d);border-radius:999px;padding:1px 8px;font-size:11px;margin:0 4px;}
.dh-legend-chev{font-size:10px;opacity:.6;}
.legend-index.dh-collapsed{display:none !important;}
.legend-index{border:1px solid var(--dh-line);border-radius:12px;background:#fbfcfe;padding:12px 6px 4px;margin-bottom:12px;}
.legend-index .legend-header{font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#98a2b3;margin-bottom:8px;}
/* #6 tab kategori: underline teal + count badge */
.nav-tab-worklist{border-bottom:1px solid var(--dh-line2) !important;margin-bottom:14px;display:flex;flex-wrap:wrap;}
.nav-tab-worklist .nav-link{border:0 !important;border-bottom:2px solid transparent !important;border-radius:0 !important;
  background:transparent !important;color:var(--dh-muted) !important;font-weight:600;padding:10px 14px !important;}
.nav-tab-worklist .nav-link:hover{color:var(--dh-primary-d) !important;background:transparent !important;}
.nav-tab-worklist .nav-link.active{color:var(--dh-primary) !important;border-bottom-color:var(--dh-primary) !important;background:transparent !important;}
.dh-tab-count{background:var(--dh-primary-t);color:var(--dh-primary-d);border-radius:999px;padding:1px 8px;font-size:11px;font-weight:700;}
/* #2 tombol Periksa: aksi primer solid teal berlabel */
.dh-actions{white-space:nowrap;}
.dh-actions .dh-periksa{background:var(--dh-primary) !important;border:1px solid var(--dh-primary) !important;color:#fff !important;
  border-radius:8px !important;font-weight:600 !important;padding:5px 11px !important;margin:0 4px;box-shadow:0 4px 10px -5px var(--dh-primary);}
.dh-actions .dh-periksa:hover{background:var(--dh-primary-d) !important;}
.dh-actions .dh-periksa .fa{color:#fff !important;}
/* #3 kebab tunggal: target sentuh lebih besar + menu berlabel rapi */
.dh-actions .dropdown-toggle{width:32px;height:32px;border-radius:8px !important;border:1px solid var(--dh-line2) !important;
  background:#fff !important;color:#475467 !important;}
.dh-actions .dropdown-toggle:hover{background:var(--dh-primary-t) !important;border-color:var(--dh-primary) !important;color:var(--dh-primary-d) !important;}
.dh-actions .dropdown-menu{border:1px solid var(--dh-line2);border-radius:10px;box-shadow:0 10px 24px rgba(16,24,40,.14);padding:6px;min-width:200px;}
.dh-actions .dropdown-menu>li>a{border-radius:7px;padding:8px 12px;font-weight:500;color:#344054;}
.dh-actions .dropdown-menu>li>a:hover{background:var(--dh-primary-t);color:var(--dh-primary-d);}
.dh-actions .dropdown-menu>li.disabled>a{color:#b6bfca;}
/* #7 antrian: pill "Panggil" jelas */
.dh-antrian{background:#fff !important;border:1px solid var(--dh-line2) !important;color:var(--dh-primary-d) !important;
  border-radius:999px !important;font-weight:700;padding:4px 12px 4px 8px !important;}
.dh-antrian > b{background:transparent !important;border:0 !important;padding:0 4px 0 0 !important;margin:0 !important;}
.dh-antrian .fa{color:var(--dh-primary) !important;}
.dh-antrian:hover{background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;color:#fff !important;}
.dh-antrian:hover .fa{color:#fff !important;}
.dh-antrian-lbl{display:inline-block;margin-left:6px;padding-left:8px;border-left:1px solid var(--dh-line2);font-size:11px;font-weight:600;opacity:.85;}
.dh-antrian:hover .dh-antrian-lbl{border-left-color:rgba(255,255,255,.4);}
/* #5 filter bar */
.dh-cari{background:var(--dh-primary) !important;border-color:var(--dh-primary) !important;color:#fff !important;
  border-radius:9px !important;font-weight:600;padding:8px 16px !important;width:auto !important;}
.dh-cari:hover{background:var(--dh-primary-d) !important;}
.dh-cari .fa{color:#fff !important;}
.dh-reset{background:#fff !important;border:1px solid var(--dh-line2) !important;color:#667085 !important;
  border-radius:9px !important;padding:8px 12px !important;width:auto !important;}
.dh-reset:hover{background:var(--dh-primary-t) !important;color:var(--dh-primary-d) !important;border-color:var(--dh-primary) !important;}
.dh-reset .fa{color:inherit !important;}

/* ==================================================================================
   WORKLIST v2 (task#73b) — "Meja Kendali Klinik": pita alur + baris-kartu pasien
   ================================================================================== */
/* ---- PITA ALUR KLINIK (signature) ---- */
#dh-flow{display:flex;align-items:stretch;gap:6px;flex-wrap:wrap;margin:4px 0 16px;}
.dh-flow-seg{display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:118px;
  background:#fff;border:1px solid var(--dh-line2);border-radius:12px;padding:9px 16px 8px;
  cursor:pointer;text-align:left;transition:border-color .15s,transform .12s,box-shadow .15s;}
.dh-flow-seg:hover{border-color:var(--dh-primary);transform:translateY(-1px);box-shadow:0 8px 18px -10px var(--dh-primary);}
.dh-flow-n{font-size:21px;font-weight:800;line-height:1.1;color:var(--dh-primary-d);font-variant-numeric:tabular-nums;}
.dh-flow-l{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#98a2b3;white-space:nowrap;}
.dh-flow-seg.active{background:var(--dh-primary);border-color:var(--dh-primary);box-shadow:0 10px 22px -10px var(--dh-primary);}
.dh-flow-seg.active .dh-flow-n,.dh-flow-seg.active .dh-flow-l{color:#fff;}
.dh-flow-seg:focus-visible{outline:2px solid var(--dh-primary);outline-offset:2px;}
.dh-flow-arr{align-self:center;color:#c3ccd6;font-size:17px;font-weight:700;}
@media(prefers-reduced-motion:reduce){.dh-flow-seg{transition:none;}}

/* ---- BARIS-KARTU PASIEN: tabel tetap DataTables, tampil sebagai kartu ---- */
#table-patient{border-collapse:separate !important;border-spacing:0 10px !important;background:transparent !important;}
#table-patient tbody tr{background:#fff;}
#table-patient tbody tr:nth-child(even) td{background:#fff !important;}
#table-patient tbody td{
  background:#fff !important;border-top:1px solid var(--dh-line2) !important;border-bottom:1px solid var(--dh-line2) !important;
  padding:13px 14px !important;vertical-align:middle !important;}
#table-patient tbody td:first-child{border-left:1px solid var(--dh-line2) !important;border-radius:12px 0 0 12px;}
#table-patient tbody td:last-child{border-right:1px solid var(--dh-line2) !important;border-radius:0 12px 12px 0;}
#table-patient tbody tr:hover td{background:#f6fdfb !important;border-color:#bfe6df !important;}
#table-patient tbody tr:hover td:first-child{box-shadow:inset 3px 0 0 var(--dh-primary);}
#table-patient.dataTable tbody tr.selected td{background:#e6f7f3 !important;}
/* header scroll-head menyatu tenang */
.dataTables_scrollHead th{border-bottom:0 !important;}

/* ---- BLOK IDENTITAS PASIEN ---- */
.dh-pt{display:flex;align-items:center;gap:11px;min-width:230px;}
.dh-pt-av{flex:0 0 40px;width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:14px;letter-spacing:.02em;}
.dh-pt-av--0{background:var(--dh-primary-t);color:var(--dh-primary-d);}
.dh-pt-av--1{background:var(--dh-info-t);color:#1d4ed8;}
.dh-pt-av--2{background:var(--dh-warn-t);color:#92560a;}
.dh-pt-av--3{background:var(--dh-ok-t);color:#0c6b3d;}
.dh-pt-body{display:flex;flex-direction:column;gap:1px;min-width:0;}
.dh-pt-nm{font-size:14.5px;font-weight:700;color:var(--dh-ink);line-height:1.25;}
.dh-pt-nm small{color:var(--dh-muted);font-weight:600;}
.dh-pt-meta{font-size:12px;color:var(--dh-muted);font-variant-numeric:tabular-nums;}

/* ---- PILL STATUS SEMANTIK ---- */
.dh-st{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:5px 12px;font-size:12px;font-weight:700;white-space:nowrap;}
.dh-st i{width:7px;height:7px;border-radius:50%;display:inline-block;}
.dh-st-wait{background:var(--dh-warn-t);color:#92560a;}   .dh-st-wait i{background:var(--dh-warn);}
.dh-st-proc{background:var(--dh-info-t);color:#1d4ed8;}   .dh-st-proc i{background:var(--dh-info);}
.dh-st-done{background:var(--dh-ok-t);color:#0c6b3d;}     .dh-st-done i{background:var(--dh-ok);}
.dh-st-cancel{background:var(--dh-danger-t);color:#a31919;} .dh-st-cancel i{background:var(--dh-danger);}
.dh-st-any{background:#eef2f6;color:#475467;}             .dh-st-any i{background:#98a2b3;}
/* worklist v2 — empty state + responsif */
.dh-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:34px 16px;color:var(--dh-muted);}
.dh-empty .fa{font-size:30px;opacity:.35;}
.dh-empty b{color:#475467;font-size:14px;}
.dh-empty span{font-size:12.5px;}
@media(max-width:1240px){
  .dh-flow-seg{min-width:96px;padding:7px 12px 6px;}
  .dh-flow-n{font-size:17px;}
  .dh-flow-l{font-size:9.5px;letter-spacing:.04em;}
  .dh-flow-arr{font-size:14px;}
}
/* worklist v2 — sticky header saat scroll */
.dataTables_scrollHead{position:relative;z-index:15;will-change:transform;}
.dataTables_scrollHead.dh-stuck{background:var(--dh-bg);box-shadow:0 8px 16px -10px rgba(13,24,43,.28);}
.dataTables_scrollHead.dh-stuck th{background:#eef3f7 !important;}
/* worklist v2 — polish mobile/tablet sempit */
@media(max-width:900px){
  .nav-tab-worklist{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
  .nav-tab-worklist::-webkit-scrollbar{display:none;}
  .nav-tab-worklist .nav-link{white-space:nowrap;padding:10px 10px !important;font-size:12.5px;}
  #dh-flow{gap:6px;}
  #dh-flow .dh-flow-arr{display:none;}
  .dh-flow-seg{flex:1 1 calc(33.33% - 6px);min-width:92px;}
  [id$="--filter"]{width:100% !important;margin-bottom:8px;float:none !important;}
  [id$="--filter"] .form-control,[id$="--filter"] .select2-container{width:100% !important;}
  .dh-cari{flex:1 1 auto;}
  .dh-antrian-lbl{display:none;} /* hemat ruang: pill antrian cukup ikon+nomor */
}

/* ==================================================================================
   ASESMEN / PEMERIKSAAN FORM (dh-soap) — rapikan form vendor ber-grid col-sm-1
   Scope: .form-asesmen (rajal/ranap/igd pemeriksaan memakai kelas yang sama).
   Prinsip: baris = FLOW flex (label · kontrol · input mengalir dgn gap seragam),
   label opsi SELALU di samping kontrolnya, heading bagian ber-aksen teal.
   ================================================================================== */
.form-asesmen{padding:6px 10px !important;}
/* baris: grid 12-kolom kaku -> flow dengan gap seragam */
.form-asesmen .form-row{display:flex;flex-wrap:wrap;align-items:center;
  column-gap:18px;row-gap:8px;margin:0 0 14px !important;}
.form-asesmen .form-row > [class*="col-"]{
  width:auto !important;max-width:none !important;flex:0 0 auto;min-width:0;
  float:none !important;padding:0 !important;margin:0 !important;overflow:visible;}
/* field lebar (kartik form-group / col-12) tetap satu baris penuh */
.form-asesmen .form-row > .form-group,
.form-asesmen .form-row > [class*="col-lg-12"],
.form-asesmen .form-row > [class*="col-sm-12"]{flex:1 1 100%;}
/* label NAMA FIELD (tanpa kontrol di dalamnya): kolom rata 170px agar nilai sejajar */
.form-asesmen .form-row > [class*="col-"]:first-child:has(> label:only-child:not(:has(input))){
  flex:0 0 170px;min-width:170px;}
.form-asesmen label:not(:has(input)):not(:has(.choice)):not(:has(.checker)){
  font-weight:700;color:#475467;font-size:12.5px;margin:0;}
/* label OPSI (radio/checkbox): teks selalu DI SAMPING kontrol, tak pernah turun */
.form-asesmen label:has(.choice),.form-asesmen label:has(.checker),
.form-asesmen label:has(input[type=radio]),.form-asesmen label:has(input[type=checkbox]){
  display:inline-flex;align-items:center;gap:7px;margin:0;white-space:nowrap;
  font-weight:500;color:var(--dh-ink);cursor:pointer;}
.form-asesmen .choice,.form-asesmen .checker{flex:0 0 auto;margin:0 !important;}
/* titik dua "Agama : Moslem" dsb ikut rapi */
.form-asesmen .form-row p{margin:0;}
/* heading bagian: "1. / 2. / 3." ber-strip teal; huruf A./B. lebih kecil */
.form-asesmen .sub-header-form,.form-asesmen .header-form{
  display:flex;align-items:center;gap:9px;font-size:14.5px;font-weight:800;
  color:var(--dh-ink);margin:24px 0 12px;padding-top:16px;border-top:1px dashed var(--dh-line2);
  width:100%;}
.form-asesmen .sub-header-form::before,.form-asesmen .header-form::before{
  content:"";width:5px;height:17px;border-radius:4px;background:var(--dh-primary);flex:0 0 auto;}
.form-asesmen .sub-header-form:first-of-type{border-top:0;padding-top:2px;margin-top:8px;}
/* sub-bagian "A. …" / "- Pernah Dirawat" (b/strong lepas) */
.form-asesmen b:not(.dh-keep),.form-asesmen strong{color:#344054;}
/* kontrol: tinggi & radius seragam; teks bebas sempit */
.form-asesmen .form-control{min-height:36px;border-radius:8px !important;font-size:13px;}
.form-asesmen input[type=text].form-control{min-width:170px;}
.form-asesmen textarea.form-control{width:100%;min-width:300px;}
.form-asesmen select.form-control{min-width:150px;}
/* input-group tanggal (kalender + clear + input) menyatu rapi */
.form-asesmen .input-group{display:inline-flex !important;width:auto !important;align-items:stretch;}
.form-asesmen .input-group .form-control{min-width:130px;}
.form-asesmen .input-group .input-group-btn{width:auto !important;display:flex;}
.form-asesmen .input-group .btn{height:36px;padding:0 11px;}
/* asterisk wajib menempel, tidak melayang */
.form-asesmen sup{color:var(--dh-danger);font-weight:800;top:-2px;position:relative;}
.form-asesmen span[style*="color:red"],.form-asesmen span[style*="color: red"]{margin-left:2px;}
/* jarak antar-sub-blok (- Pernah Dirawat, dst) */
.form-asesmen .form-row + .form-row{margin-top:2px !important;}
/* asesmen: label field jangan patah; sup nempel */
.form-asesmen label:not(:has(input)):not(:has(.choice)):not(:has(.checker)){white-space:nowrap;display:inline-flex;align-items:center;gap:2px;}
.form-asesmen label sup{position:static;margin-left:1px;}
/* susunan sticky dh-soap: kartu pasien layer teratas, toolbar Simpan/Cetak menyusul di bawahnya */
.dh-soap-patientbar{z-index:8 !important;box-shadow:0 8px 14px -12px rgba(13,24,43,.35);}
/* asesmen v2: generalisasi ke SEMUA .row di dalam form (banyak baris tanpa .form-row) */
.form-asesmen form > .row,.form-asesmen .row{display:flex;flex-wrap:wrap;align-items:center;
  column-gap:18px;row-gap:8px;margin:0 0 12px !important;}
.form-asesmen .row > [class*="col-"]{width:auto !important;max-width:none !important;flex:0 0 auto;
  float:none !important;padding:0 !important;margin:0 !important;}
/* kontainer field kartik: bagi ruang rata (min 240px), stack di sempit */
.form-asesmen .row > [class*="col-"]:has(> .form-group),
.form-asesmen .row > .form-group[class*="col-"]{flex:1 1 240px;max-width:460px;}
.form-asesmen .row > [class*="col-lg-12"],.form-asesmen .row > [class*="col-sm-12"]{
  flex:1 1 100% !important;max-width:none !important;}
/* kartik horizontal -> label DI ATAS field (pola guide) */
.form-asesmen .form-group > .control-label[class*="col-"]{
  width:100% !important;float:none !important;text-align:left !important;
  padding:0 0 4px !important;margin:0 !important;white-space:normal !important;display:block;}
.form-asesmen .form-group > [class*="col-"]:not(.control-label){
  width:100% !important;float:none !important;padding:0 !important;}
.form-asesmen .form-group{margin-bottom:6px;}
/* input-group dlm form-group boleh melebar penuh sel */
.form-asesmen .form-group .input-group{display:flex !important;width:100% !important;}
.form-asesmen .form-group .input-group .form-control{flex:1 1 auto;min-width:90px;}
/* skala nyeri: chip angka 0-10 modern, selaras wajah baru */
.box-scale{background:#fbfdfe;border:1px solid var(--dh-line);border-radius:14px;padding:16px 18px !important;}
.box-scale-header img{max-width:100%;height:auto;}
.box-scale-info{font-size:12px;font-weight:700;color:#667085;letter-spacing:.02em;margin:6px 0 10px;}
.box-scale-line__btn{width:34px;height:34px;line-height:32px;border-radius:50% !important;
  border:1.5px solid var(--dh-line2) !important;background:#fff !important;color:#475467 !important;
  font-weight:700;text-align:center;cursor:pointer;transition:all .12s;}
.box-scale-line__btn:hover{border-color:var(--dh-primary) !important;color:var(--dh-primary-d) !important;
  background:var(--dh-primary-t) !important;transform:translateY(-1px);}
.box-scale-line__btn.active,.box-scale-line__btn.selected{background:var(--dh-primary) !important;
  border-color:var(--dh-primary) !important;color:#fff !important;box-shadow:0 6px 12px -6px var(--dh-primary);}
/* gambar tubuh: bingkai rapi */
.image-frame{border:1px solid var(--dh-line);border-radius:14px;overflow:hidden;background:#fff;}
.image-frame img{max-width:100%;height:auto;display:block;}
/* ---- widget skala nyeri v2: label sejajar, track gradasi, caption chip ---- */
/* label & caption menyebar penuh (pulihkan dari aturan flex form-asesmen) */
.form-asesmen .box-scale .row > [class*="col-"],.box-scale .row > [class*="col-"]{flex:1 1 0 !important;}
.box-scale-info [class*="col-"]{font-size:12.5px;font-weight:700;color:#475467;}
/* bar putih misterius -> track gradasi nyeri hijau->merah */
.box-scale-line__separator{display:block !important;height:8px !important;border-radius:999px;
  background:linear-gradient(90deg,#22c55e,#84cc16,#eab308,#f59e0b,#f97316,#ef4444) !important;
  margin:4px 2px 14px !important;overflow:hidden;}
.box-scale-line__separator .box-scale-line__point,.box-scale-line__hidePercentage{
  visibility:hidden;height:0 !important;padding:0 !important;}
/* barisan angka: sebar rata & sejajar track */
.box-scale-line:not(.box-scale-line__separator){display:flex !important;align-items:center;}
.box-scale-line:not(.box-scale-line__separator) .box-scale-line__point{
  flex:1 1 0;display:flex;justify-content:center;float:none !important;width:auto !important;}
/* caption dosis -> chip rapi */
.box-scale-info span{display:inline-block;background:#fff;border:1px solid var(--dh-line2);
  border-radius:999px;padding:5px 14px;font-size:12px;font-weight:600;color:#667085;
  margin:6px 5px 0;white-space:nowrap;}
/* ---- DH PAIN v3: rombak total widget skala nyeri ---- */
.dh-pain{margin-bottom:6px;}
.dh-pain-top{display:flex;align-items:center;gap:18px;margin-bottom:16px;}
.dh-pain-face{width:96px;height:96px;border-radius:28px;background:#eef2f6;display:flex;align-items:center;
  justify-content:center;transition:background .25s;}
.dh-pain-face svg{width:72px;height:72px;transition:transform .18s;}
.dh-pain-btn:active ~ *{}
.dh-pain-score{display:flex;align-items:baseline;gap:6px;}
.dh-pain-score b{font-size:42px;font-weight:800;line-height:1;color:var(--dh-ink);font-variant-numeric:tabular-nums;}
.dh-pain-score span{font-size:14px;font-weight:700;color:#98a2b3;}
.dh-pain-name{font-size:15px;font-weight:800;color:#344054;margin-top:2px;}
.dh-pain-hint{font-size:12.5px;color:var(--dh-muted);}
.dh-pain-seg{display:flex;gap:6px;}
.dh-pain-btn{flex:1 1 0;height:42px;border-radius:11px;border:1.5px solid var(--dh-line2);background:#f4f7fa;
  color:#8a97a4;font-weight:800;font-size:14px;cursor:pointer;transition:all .13s;padding:0;}
.dh-pain-btn:hover{border-color:var(--c);color:#344054;transform:translateY(-1px);}
.dh-pain-btn.fill{background:color-mix(in srgb,var(--c) 26%, #fff);border-color:color-mix(in srgb,var(--c) 45%, #fff);color:#1f2d3d;}
.dh-pain-btn.sel{background:var(--c);border-color:var(--c);color:#fff;box-shadow:0 8px 16px -8px var(--c);transform:translateY(-2px);}
/* sembunyikan visual legacy (logic tetap hidup tersembunyi) */
.box-scale.dh-pain-done .box-scale-header,
.box-scale.dh-pain-done .box-scale-line,
.box-scale.dh-pain-done .box-scale-info:not(:last-of-type){display:none !important;}
.box-scale.dh-pain-done .box-scale-info:last-of-type{margin-top:12px;}
@media(max-width:700px){.dh-pain-seg{flex-wrap:wrap;}.dh-pain-btn{flex:1 1 calc(20% - 6px);}}
/* ---- OPT-OUT: halaman spesialis (gigi/tht/mata/obgyn) = instrumen bespoke,
   kembalikan grid Bootstrap asli, batalkan aturan flow form-asesmen ---- */
.form-asesmen .dh-spesialis-raw .row{display:block !important;margin:0 -15px 8px !important;}
.form-asesmen .dh-spesialis-raw .row::after{content:"";display:table;clear:both;}
.form-asesmen .dh-spesialis-raw .row > [class*="col-"]{float:left !important;position:relative;
  min-height:1px;padding:0 15px !important;margin:0 !important;flex:none !important;max-width:none !important;}
@media(min-width:768px){
  .form-asesmen .dh-spesialis-raw .col-sm-1{width:8.333% !important;}
  .form-asesmen .dh-spesialis-raw .col-sm-2{width:16.666% !important;}
  .form-asesmen .dh-spesialis-raw .col-sm-3{width:25% !important;}
  .form-asesmen .dh-spesialis-raw .col-sm-4{width:33.333% !important;}
  .form-asesmen .dh-spesialis-raw .col-sm-5{width:41.666% !important;}
  .form-asesmen .dh-spesialis-raw .col-sm-6{width:50% !important;}
  .form-asesmen .dh-spesialis-raw .col-sm-7{width:58.333% !important;}
  .form-asesmen .dh-spesialis-raw .col-sm-8{width:66.666% !important;}
  .form-asesmen .dh-spesialis-raw .col-sm-9{width:75% !important;}
  .form-asesmen .dh-spesialis-raw .col-sm-10{width:83.333% !important;}
  .form-asesmen .dh-spesialis-raw .col-sm-12{width:100% !important;}
}
.form-asesmen .dh-spesialis-raw label{white-space:normal !important;display:inline-block !important;}
.form-asesmen .dh-spesialis-raw .form-control{min-width:0 !important;}
.form-asesmen .dh-spesialis-raw .form-group{margin-bottom:12px;}
.form-asesmen .dh-spesialis-raw .form-group > .control-label[class*="col-"],
.form-asesmen .dh-spesialis-raw .form-group > [class*="col-"]:not(.control-label){
  float:left !important;padding:0 15px !important;text-align:inherit !important;display:block;}
/* tabel odontogram: input gigi kompak & rapi */
.table-odontogram table td{padding:3px 6px !important;vertical-align:middle;}
.table-odontogram .form-control{min-width:0 !important;height:32px;min-height:32px !important;font-size:12.5px;}
.table-odontogram td[colspan="2"]{font-weight:700;color:#475467;}

/* ==================================================================================
   FIX SOAP sticky (periksa): panel induk overflow:hidden mematahkan sticky rail+patientbar,
   + plugin nav-sticky JS lama (#nav-sticky) menaruh inline position -> kotak mengambang.
   ================================================================================== */
/* 1. buka clip panel yg membungkus dh-soap (halaman periksa) */
.content-wrapper .panel.panel-white:has(.dh-soap),
.content-wrapper .panel:has(.dh-soap),
.panel-body:has(.dh-soap){overflow:visible !important;}
/* 2. paksa rail = sticky CSS bersih, batalkan inline dari plugin nav-sticky JS */
#nav-sticky.dh-soap-rail,.dh-soap .dh-soap-rail#nav-sticky{
  position:sticky !important;top:96px !important;left:auto !important;right:auto !important;
  bottom:auto !important;width:238px !important;max-width:238px !important;margin:0 !important;
  transform:none !important;z-index:9 !important;box-shadow:none !important;background:var(--dh-surface,#fff) !important;}
/* 3. patient bar SELALU di atas rail (fix "kepotong kiri") */
.dh-soap-patientbar{z-index:20 !important;}
/* 4. placeholder saat plugin memindah rail (kalau ada) tak menyisakan gap */
.nav-sticky-wrapper.dh-soap-rail + .nav-sticky-placeholder,.nav-sticky-placeholder{display:none !important;}
/* 5. buka clip content-wrapper/page-content di halaman SOAP agar sticky menahan */
body:has(.dh-soap) .content-wrapper,
body:has(.dh-soap) .page-content{overflow:visible !important;}
/* 6. patient bar span bersih di atas rail (tepi kiri tak terpotong) */
.dh-soap-patientbar{margin-left:0 !important;padding-left:22px !important;}