:root{
  color-scheme:light;
  --bg:#f4f7ff;
  --bg-soft:#f8faff;
  --panel:#ffffff;
  --panel-2:#fbfcff;
  --text:#15203b;
  --muted:#7c86a4;
  --muted-2:#a0a8bd;
  --brand:#3657d6;
  --brand-2:#263b9d;
  --brand-3:#1e2f7f;
  --brand-soft:#eef2ff;
  --blue:#3186f6;
  --purple:#8a55ea;
  --green:#31bf8a;
  --orange:#ff9d32;
  --danger:#d94b54;
  --warning:#d98016;
  --success:#139f70;
  --border:#e3e8f3;
  --border-strong:#d5dcea;
  --shadow:0 10px 34px rgba(35,55,125,.08);
  --shadow-soft:0 4px 18px rgba(35,55,125,.06);
  --sidebar-width:272px;
}

:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0e1323;
  --bg-soft:#12192c;
  --panel:#171f34;
  --panel-2:#1b253c;
  --text:#eef2ff;
  --muted:#a7b0c8;
  --muted-2:#7f8ba8;
  --brand-soft:#202b50;
  --border:#2a3550;
  --border-strong:#36425f;
  --shadow:0 12px 36px rgba(0,0,0,.2);
  --shadow-soft:0 5px 20px rgba(0,0,0,.16);
}

*{box-sizing:border-box}
html{min-height:100%;background:var(--bg)}
body{margin:0;min-height:100vh;font-family:"Segoe UI",Tahoma,Arial,sans-serif;background:var(--bg);color:var(--text);font-size:15px}
button,input,select,textarea{font:inherit}
button{border:0;cursor:pointer}
a{color:inherit}
svg{display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
[hidden]{display:none!important}

/* Authentication */
.auth-page{min-height:100vh;display:grid;place-items:center;background:linear-gradient(145deg,#edf2ff,#fafbff)}
.auth-card{width:min(430px,92vw);background:#fff;padding:42px;border-radius:24px;box-shadow:var(--shadow);text-align:center}
.brand-mark{width:68px;height:68px;margin:0 auto 18px;border-radius:20px;display:grid;place-items:center;background:var(--brand);color:#fff;font-size:36px;font-weight:700}
.auth-card h1{font-size:25px;margin:0 0 8px}.auth-card p{color:var(--muted)}

/* Main shell */
.app-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) var(--sidebar-width);grid-template-areas:"main sidebar";direction:ltr}
.sidebar{grid-area:sidebar;direction:rtl;position:sticky;top:0;height:100vh;overflow:auto;padding:30px 18px 22px;background:linear-gradient(165deg,#283f9f 0%,#1f347f 48%,#19265f 100%);color:#fff;display:flex;flex-direction:column;gap:26px;z-index:40;box-shadow:-14px 0 45px rgba(30,48,125,.14)}
.sidebar-brand{display:flex;align-items:center;gap:14px;padding:4px 14px 10px}.sidebar-brand strong{display:block;font-size:23px;line-height:1.3}.sidebar-brand small{display:block;margin-top:4px;color:#b9c5f0;font-size:12px}.tooth-logo{width:54px;height:54px;display:grid;place-items:center;color:#fff}.tooth-logo svg{width:48px;height:48px;stroke:none}
.sidebar-nav{display:grid;gap:6px}.nav-item{width:100%;min-height:55px;border-radius:11px;padding:12px 16px;background:transparent;color:#eef2ff;display:flex;align-items:center;gap:14px;text-align:right;transition:.2s ease}.nav-item svg{width:25px;height:25px;flex:0 0 auto}.nav-item span{font-size:16px;font-weight:600}.nav-item:hover{background:rgba(255,255,255,.08);transform:translateX(-2px)}.nav-item.active{background:linear-gradient(100deg,rgba(111,137,255,.75),rgba(75,102,223,.8));box-shadow:0 8px 20px rgba(9,22,77,.22)}
.sidebar-footer{margin-top:auto;display:grid;gap:7px;padding-top:14px}.sidebar-utility{width:100%;min-height:48px;border-radius:11px;padding:11px 14px;background:rgba(255,255,255,.07);color:#e8edff;display:flex;align-items:center;gap:12px;text-align:right}.sidebar-utility:hover{background:rgba(255,255,255,.12)}.sidebar-utility svg{width:23px;height:23px}.sidebar-utility .switch{margin-inline-start:auto;width:34px;height:19px;border-radius:999px;background:rgba(255,255,255,.22);position:relative}.sidebar-utility .switch::after{content:"";position:absolute;top:3px;right:3px;width:13px;height:13px;border-radius:50%;background:#dbe3ff;transition:.2s}.sidebar-utility[aria-pressed="true"] .switch{background:#7e94ff}.sidebar-utility[aria-pressed="true"] .switch::after{right:18px;background:#fff}.logout{color:#ffd6dc}

.main-content{grid-area:main;direction:rtl;min-width:0;padding:22px 28px 0;display:flex;flex-direction:column}
.topbar{min-height:92px;border:1px solid var(--border);border-radius:17px;background:var(--panel);box-shadow:var(--shadow-soft);display:grid;grid-template-columns:minmax(260px,1fr) minmax(280px,410px) auto;align-items:center;gap:22px;padding:18px 24px;margin-bottom:22px;position:relative;z-index:20}
.welcome-block h1{margin:0;font-size:24px;letter-spacing:-.02em}.welcome-block p{margin:7px 0 0;color:var(--muted);font-size:14px}.global-search{height:48px;border:1px solid var(--border);border-radius:12px;background:var(--bg-soft);display:flex;align-items:center;gap:10px;padding:0 14px}.global-search:focus-within{border-color:#9baceb;box-shadow:0 0 0 3px rgba(54,87,214,.08)}.global-search svg{width:21px;height:21px;color:#66749d}.global-search input{width:100%;border:0;outline:0;background:transparent;color:var(--text);font-size:14px}.global-search input::placeholder{color:var(--muted-2)}
.topbar-actions{display:flex;align-items:center;gap:13px}.icon-button{width:44px;height:44px;border-radius:12px;background:var(--bg-soft);color:#50618e;border:1px solid var(--border);display:grid;place-items:center;position:relative}.icon-button:hover{background:var(--brand-soft);color:var(--brand)}.icon-button svg{width:22px;height:22px}.notification-count{position:absolute;top:-5px;left:-5px;min-width:19px;height:19px;border-radius:999px;background:#2d64e8;color:#fff;border:2px solid var(--panel);font-size:10px;font-weight:700;display:grid;place-items:center;padding:0 4px}.profile-chip{display:flex;align-items:center;gap:10px;min-width:178px}.profile-avatar{width:43px;height:43px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#e4ecff,#cfdcff);color:#2949bf;font-weight:800;border:2px solid #fff;box-shadow:0 0 0 1px var(--border)}.profile-chip strong{display:block;font-size:14px;max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-chip small{display:block;margin-top:3px;color:var(--muted);font-size:11px}
.mobile-only{display:none}.sidebar-backdrop{position:fixed;inset:0;background:rgba(10,18,45,.48);z-index:35;backdrop-filter:blur(2px)}
.app-content{flex:1;min-height:0}.app-footer{display:flex;justify-content:center;gap:7px;color:var(--muted);font-size:12px;padding:22px 8px 18px}.app-footer span+span::before{content:"•";margin-inline-end:7px}

/* General UI */
button{border-radius:10px;padding:11px 18px;background:var(--brand);color:#fff;font-weight:650;transition:.18s ease}button:hover{background:var(--brand-2)}button:disabled{opacity:.55;cursor:not-allowed}.secondary{background:var(--brand-soft);color:var(--brand)}.secondary:hover{background:#dfe6ff}.danger-button{background:#fff0f1;color:var(--danger)}.danger-button:hover{background:#ffe1e4}.small{padding:8px 12px;border-radius:8px;font-size:13px}
.panel{background:var(--panel);border:1px solid var(--border);border-radius:17px;padding:20px;box-shadow:var(--shadow-soft)}.panel h2,.panel-head h2{margin:0;color:var(--text);font-size:18px}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.panel-head p{margin:6px 0 0;color:var(--muted);font-size:13px}.panel-head.compact{margin-bottom:10px}.panel-head.compact h3{margin:0 0 4px}.muted{color:var(--muted)}.error{color:var(--danger);min-height:20px}.skeleton{color:var(--muted);position:relative;overflow:hidden}.skeleton::after{content:"";position:absolute;inset:0;transform:translateX(100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);animation:shimmer 1.5s infinite}@keyframes shimmer{to{transform:translateX(-100%)}}
.empty{text-align:center;color:var(--muted);padding:32px}.empty-state{display:grid;place-items:center;text-align:center;gap:10px;min-height:160px;color:var(--muted)}.empty-state svg{width:46px;height:46px;color:#a7b3d7}
.badge,.status-pill{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:6px 10px;background:#e9f7f1;color:#137553;font-size:12px;font-weight:700}.badge.danger{background:#ffedef;color:var(--danger)}.badge.warning,.warning-badge{background:#fff5df;color:#9a5b00}.badge.neutral{background:#eef1f7;color:#5f6981}.risk{display:inline-flex;padding:5px 9px;border-radius:8px;background:#edf2f1}.risk.high,.risk.critical{background:#fee4e2;color:var(--danger)}
.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:13px}table{width:100%;border-collapse:collapse;background:var(--panel)}th,td{text-align:right;padding:13px 14px;border-bottom:1px solid var(--border);white-space:nowrap}tr:last-child td{border-bottom:0}th{color:var(--muted);font-size:13px;background:var(--panel-2)}tbody tr:hover{background:var(--bg-soft)}.row-actions{display:flex;gap:8px;flex-wrap:wrap}

/* Dashboard */
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(330px,.92fr) minmax(300px,.86fr);gap:18px;align-items:start}.dashboard-main-column,.dashboard-side-column{display:grid;gap:18px}.dashboard-main-column{grid-column:1/3}.dashboard-side-column{grid-column:3}.kpi-grid{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.kpi-card{min-height:130px;background:var(--panel);border:1px solid var(--border);border-radius:17px;padding:20px;box-shadow:var(--shadow-soft);display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}.kpi-card .kpi-label{color:#3d496c;font-size:13px;font-weight:650}.kpi-card strong{display:block;margin-top:9px;font-size:25px;letter-spacing:-.02em}.kpi-card .kpi-note{grid-column:1/-1;color:var(--muted);font-size:12px}.kpi-card .trend-up{color:var(--success);font-weight:700}.kpi-card .trend-down{color:var(--danger);font-weight:700}.kpi-icon{width:64px;height:64px;border-radius:50%;display:grid;place-items:center}.kpi-icon svg{width:29px;height:29px}.kpi-icon.purple{background:#f1eaff;color:#824be5}.kpi-icon.green{background:#e5f8f0;color:#20a875}.kpi-icon.blue{background:#e8f2ff;color:#2d80e5}.kpi-icon.orange{background:#fff0df;color:#f0932b}
:root[data-theme="dark"] .kpi-card .kpi-label{color:#bdc5dd}.dashboard-panel{min-height:0}.dashboard-panel .panel-head{align-items:center}.panel-title{display:flex;align-items:center;gap:9px}.panel-title svg{width:20px;height:20px;color:#4b5d96}.link-button{background:transparent;color:var(--brand);padding:6px 8px;font-size:12px}.link-button:hover{background:var(--brand-soft)}
.dashboard-center-grid{display:grid;grid-template-columns:minmax(330px,1fr) minmax(330px,1fr);gap:18px}.appointment-list{display:grid}.appointment-row{display:grid;grid-template-columns:74px 1fr auto;gap:12px;align-items:center;padding:13px 4px;border-bottom:1px solid var(--border)}.appointment-row:last-child{border-bottom:0}.appointment-time{font-weight:800;color:#293654}.appointment-time small{display:block;margin-top:4px;color:var(--muted);font-weight:500;font-size:11px}.person-line{display:flex;align-items:center;gap:10px;min-width:0}.mini-avatar{width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#eaf0ff,#d6e0ff);color:#3857c6;font-weight:800;flex:0 0 auto}.person-line strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.person-line small{display:block;color:var(--muted);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--blue)}.status-dot.waiting{background:var(--orange)}.status-dot.in_clinic{background:var(--green)}.status-dot.confirmed{background:var(--purple)}
.schedule-list{position:relative;padding-inline-start:50px;display:grid;gap:10px}.schedule-list::before{content:"";position:absolute;inset-block:8px;right:36px;width:1px;background:var(--border)}.schedule-item{position:relative;border-radius:10px;padding:12px 14px;border-inline-start:3px solid var(--blue);background:#eaf4ff;display:flex;justify-content:space-between;gap:10px}.schedule-item::before{content:attr(data-time);position:absolute;right:-50px;top:12px;color:var(--muted);font-size:11px;width:40px;text-align:left}.schedule-item.purple{background:#f3edff;border-color:var(--purple)}.schedule-item.green{background:#e9f9f2;border-color:var(--green)}.schedule-item.orange{background:#fff3e5;border-color:var(--orange)}.schedule-item strong{font-size:13px}.schedule-item small{display:block;margin-top:3px;color:#56617c}.schedule-item time{font-size:10px;color:#58627c;white-space:nowrap}
:root[data-theme="dark"] .schedule-item{background:#1b3352}:root[data-theme="dark"] .schedule-item.purple{background:#30264d}:root[data-theme="dark"] .schedule-item.green{background:#173f35}:root[data-theme="dark"] .schedule-item.orange{background:#44301c}
.distribution-wrap{display:grid;grid-template-columns:160px 1fr;align-items:center;gap:20px}.donut-chart{width:150px;aspect-ratio:1;border-radius:50%;position:relative;margin:auto}.donut-chart::after{content:"";position:absolute;inset:34px;border-radius:50%;background:var(--panel)}.donut-empty{background:conic-gradient(#e6eaf2 0 100%)}.chart-legend{display:grid;gap:11px}.chart-legend-row{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;font-size:12px}.legend-dot{width:8px;height:8px;border-radius:50%}.chart-legend-row strong{font-size:12px}.chart-legend-row span:nth-child(2){color:var(--muted)}
.recent-patients{display:grid}.recent-patient-row{display:grid;grid-template-columns:1fr auto;gap:10px;padding:12px 0;border-bottom:1px solid var(--border)}.recent-patient-row:last-child{border-bottom:0}.recent-patient-row .patient-meta{display:flex;align-items:center;gap:10px}.recent-patient-row time{color:var(--muted);font-size:10px;white-space:nowrap}.recent-patient-row .phone{direction:ltr;text-align:right;color:#56617c;font-size:12px;margin-top:3px}
.alert-list{display:grid;gap:10px}.alert-card{border-radius:11px;padding:12px 13px;display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:center;border:1px solid transparent;cursor:pointer}.alert-card:hover{filter:brightness(.99)}.alert-card .alert-icon{width:36px;height:36px;border-radius:9px;display:grid;place-items:center}.alert-card .alert-icon svg{width:20px;height:20px}.alert-card strong{display:block;font-size:13px}.alert-card p{margin:4px 0 0;font-size:11px;color:#6d758a}.alert-card.danger{background:#fff0f0;border-color:#ffd9dc;color:#bc3944}.alert-card.danger .alert-icon{background:#ffdadd}.alert-card.warning{background:#fff7e9;border-color:#ffe7bd;color:#a96308}.alert-card.warning .alert-icon{background:#ffe6ba}.alert-card.neutral{background:#f2f5fb;border-color:#e3e8f2;color:#52617f}.alert-card.neutral .alert-icon{background:#e4e9f4}.alert-card.success{background:#ecf9f3;border-color:#d2f1e3;color:#177e5d}.alert-card.success .alert-icon{background:#d8f3e7}
:root[data-theme="dark"] .alert-card.danger{background:#40252c;border-color:#5e2d36}:root[data-theme="dark"] .alert-card.warning{background:#44351f;border-color:#624a27}:root[data-theme="dark"] .alert-card.neutral{background:#222c42;border-color:#303b54}:root[data-theme="dark"] .alert-card.success{background:#163a30;border-color:#255344}.quick-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.quick-action{background:var(--bg-soft);border:1px solid var(--border);color:var(--text);border-radius:11px;padding:12px 8px;display:grid;place-items:center;gap:7px;text-align:center}.quick-action:hover{background:var(--brand-soft);color:var(--brand)}.quick-action svg{width:25px;height:25px}.quick-action span{font-size:11px;font-weight:700}

/* Secondary views */
.view-grid{display:grid;gap:18px}.view-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.view-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.summary-tile{border:1px solid var(--border);border-radius:14px;background:var(--panel);padding:18px;box-shadow:var(--shadow-soft)}.summary-tile span{color:var(--muted);font-size:12px}.summary-tile strong{display:block;font-size:23px;margin-top:9px}.view-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.toolbar-search{min-width:260px;border:1px solid var(--border);border-radius:10px;padding:10px 12px;background:var(--bg-soft);color:var(--text)}

/* Forms and dialogs */
.stack{display:grid;gap:16px;text-align:right}.stack label{display:grid;gap:7px;font-weight:650;color:var(--text)}.stack input,.stack select,.stack textarea{width:100%;border:1px solid var(--border);border-radius:10px;padding:12px;background:var(--panel);color:var(--text);outline:none}.stack input:focus,.stack select:focus,.stack textarea:focus{border-color:#9aabea;box-shadow:0 0 0 3px rgba(54,87,214,.08)}dialog{border:1px solid var(--border);border-radius:18px;padding:25px;width:min(520px,92vw);max-height:90vh;background:var(--panel);color:var(--text);box-shadow:0 24px 70px rgba(9,19,55,.28)}dialog::backdrop{background:rgba(8,16,43,.48);backdrop-filter:blur(2px)}.dialog-actions{display:flex;justify-content:flex-start;gap:10px;flex-wrap:wrap}.wide-dialog{width:min(940px,95vw);overflow:auto}.inline-check{display:flex!important;grid-template-columns:auto 1fr;align-items:center;justify-content:flex-start;gap:9px!important}.inline-check input{width:auto!important}.document-list{display:grid;gap:12px;margin-top:8px}.document-card{display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid var(--border);border-radius:14px;padding:16px;background:var(--panel-2)}.document-card p{margin:7px 0;color:var(--muted);font-size:13px}.document-actions{display:flex;gap:8px;flex-wrap:wrap}.document-empty{border:1px dashed var(--border);border-radius:12px}.wide-dialog .panel-head{margin-bottom:0}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-grid .span-2{grid-column:1/-1}.periodontal-section,.prescription-items-section,.prescription-warning-box{border:1px solid var(--border);border-radius:14px;padding:14px;background:var(--panel-2)}.periodontal-rows,.prescription-items{display:grid;gap:9px}.periodontal-row{display:grid;grid-template-columns:80px 76px 90px 90px auto auto auto;gap:8px;align-items:center}.periodontal-row input,.periodontal-row select{min-width:0;border:1px solid var(--border);border-radius:8px;padding:9px;background:var(--panel);color:var(--text)}.compact-check{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center;gap:5px!important;font-weight:400!important;white-space:nowrap}.compact-check input{width:auto!important}.examination-card strong{display:block;max-width:620px;white-space:normal}.examination-dialog textarea,.prescription-dialog textarea{min-height:82px;resize:vertical}.prescription-item-row{display:grid;grid-template-columns:minmax(190px,1.5fr) repeat(5,minmax(100px,1fr)) minmax(180px,1.4fr) auto;gap:8px;align-items:end;border:1px solid var(--border);border-radius:12px;padding:12px;background:var(--panel)}.prescription-item-row label{font-size:13px}.prescription-item-row input,.prescription-item-row select{padding:9px}.prescription-warning-box h3{margin:0 0 10px}.prescription-warning{border-inline-start:4px solid #65807d;background:#eef4f3;border-radius:10px;padding:11px;margin-top:8px}.prescription-warning.warning{border-inline-start-color:#d38a00;background:#fff7e2}.prescription-warning.critical{border-inline-start-color:var(--danger);background:#fff0ef}.prescription-warning p{margin:6px 0 0}.warning-clear{color:#176b4d}.clinical-disclaimer{font-size:13px;color:var(--muted);border:1px dashed var(--border);border-radius:10px;padding:10px}.medication-rule-list{white-space:normal}

/* Print */
@media print{.sidebar,.topbar,.app-footer,.no-print{display:none!important}.app-shell{display:block}.main-content{padding:0}.panel,.kpi-card,.summary-tile{box-shadow:none;break-inside:avoid}.app-content{display:block}.dashboard-grid{display:block}.dashboard-main-column,.dashboard-side-column,.dashboard-center-grid{display:block}.panel{margin-bottom:14px}}

/* Responsive */
@media(max-width:1260px){.dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-main-column{grid-column:1/-1}.dashboard-side-column{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr))}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar{grid-template-columns:1fr minmax(260px,360px);}.topbar-actions{grid-column:1/-1;justify-content:flex-start}.profile-chip{margin-inline-start:auto}}
@media(max-width:980px){.app-shell{display:block}.sidebar{position:fixed;right:0;top:0;transform:translateX(110%);width:min(var(--sidebar-width),86vw);transition:transform .24s ease;box-shadow:-18px 0 45px rgba(8,18,54,.35)}body.sidebar-open .sidebar{transform:translateX(0)}.main-content{padding:14px 16px 0}.mobile-only{display:grid}.topbar{grid-template-columns:auto 1fr auto;gap:12px;padding:14px 16px;min-height:78px}.global-search{grid-column:1/-1;grid-row:2}.topbar-actions{grid-column:auto;grid-row:auto}.profile-chip div{display:none}.profile-chip{min-width:auto}.dashboard-side-column{grid-template-columns:1fr 1fr}.view-grid.two{grid-template-columns:1fr}}
@media(max-width:720px){.main-content{padding:10px 10px 0}.topbar{border-radius:14px;margin-bottom:12px}.welcome-block h1{font-size:19px}.welcome-block p{display:none}.notification-button{display:none}.kpi-grid{grid-template-columns:1fr 1fr;gap:10px}.kpi-card{min-height:112px;padding:15px}.kpi-card strong{font-size:20px}.kpi-icon{width:48px;height:48px}.dashboard-center-grid{grid-template-columns:1fr}.dashboard-side-column{grid-template-columns:1fr}.distribution-wrap{grid-template-columns:130px 1fr}.donut-chart{width:120px}.donut-chart::after{inset:28px}.quick-actions{grid-template-columns:repeat(2,1fr)}.view-summary{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.form-grid .span-2{grid-column:auto}.document-card{align-items:flex-start;flex-direction:column}.document-actions{width:100%}.document-actions button{flex:1}.wide-dialog{padding:18px}.periodontal-row{grid-template-columns:repeat(2,minmax(0,1fr))}.row-actions{flex-direction:column}.row-actions button{width:100%}.prescription-item-row{grid-template-columns:1fr 1fr}.prescription-medication-wrap,.prescription-instructions-wrap{grid-column:1/-1}.prescription-item-row button{width:100%}.toolbar-search{min-width:100%}}
@media(max-width:470px){.kpi-grid{grid-template-columns:1fr}.topbar-actions{display:none}.topbar{grid-template-columns:auto 1fr}.global-search{grid-column:1/-1}.appointment-row{grid-template-columns:60px 1fr}.appointment-row .status-dot{display:none}.distribution-wrap{grid-template-columns:1fr}.chart-legend{grid-template-columns:1fr 1fr}.app-footer{display:block;text-align:center}.app-footer span{display:block;margin:3px}.app-footer span+span::before{display:none}}
.recent-patient-row{width:100%;background:transparent;color:var(--text);border:0;border-radius:0;text-align:right;font-weight:400}.recent-patient-row:hover{background:var(--bg-soft)}

/* Medical consents and immutable signature documents */
.consent-template-preview{border:1px solid var(--border);border-radius:14px;padding:16px;background:var(--panel-2);line-height:1.9;white-space:normal}.consent-template-preview strong{display:block;margin-bottom:8px}.consent-template-preview p{margin:0;color:var(--text);white-space:normal}.consent-card strong{display:block;max-width:620px;white-space:normal}.signature-panel{border:1px solid var(--border);border-radius:14px;padding:14px;background:var(--panel-2)}.signature-canvas{display:block;width:100%;height:190px;border:1px dashed #9fb5b3;border-radius:10px;background:#fff;touch-action:none;cursor:crosshair}.consent-version-list{display:grid;gap:8px}.consent-pdf-link{display:block;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--bg-soft);color:var(--brand);text-decoration:none;direction:ltr;text-align:left}.consent-pdf-link:hover{border-color:var(--brand);background:var(--brand-soft)}.consent-template-form textarea{min-height:180px;resize:vertical}.consent-details-dialog p{white-space:normal;line-height:1.7}.consent-sign-dialog{max-width:900px}.consent-dialog textarea{min-height:90px;resize:vertical}
:root[data-theme="dark"] .signature-canvas{background:#fff;border-color:#64748b}
@media(max-width:720px){.signature-canvas{height:150px}.consent-sign-dialog{padding:16px}}

/* Financial controls: cashboxes, installments, immutable ledger */
.financial-dialog{width:min(1180px,96vw)}
.financial-workspace{gap:18px}.financial-summary-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.cashbox-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.cashbox-card{border:1px solid var(--border);border-radius:15px;background:var(--panel-2);padding:16px;display:grid;gap:14px}.cashbox-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.cashbox-card-head h3{margin:4px 0 2px}.cashbox-session-data{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.cashbox-session-data div{border:1px solid var(--border);border-radius:10px;background:var(--panel);padding:10px}.cashbox-session-data span{display:block;color:var(--muted);font-size:11px}.cashbox-session-data strong{display:block;margin-top:5px;font-size:13px}.movement-direction{display:inline-flex;align-items:center;justify-content:center;min-width:52px;border-radius:999px;padding:4px 9px;font-size:12px;font-weight:800}.movement-direction.in{background:#dcf7ea;color:#137451}.movement-direction.out{background:#ffe8e7;color:#b53e48}:root[data-theme="dark"] .movement-direction.in{background:#173d31;color:#7ce0b9}:root[data-theme="dark"] .movement-direction.out{background:#45272d;color:#ff9da5}
@media(max-width:1260px){.financial-summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.cashbox-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.financial-summary-grid,.cashbox-grid{grid-template-columns:1fr}.cashbox-session-data{grid-template-columns:1fr}.financial-dialog{padding:14px}}

/* 0.9.0 — Insurance, doctor commissions, and exportable reports */
.insurance-workspace,.commission-workspace,.reports-workspace{gap:18px}
.insurance-summary-grid,.commission-summary-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.report-controls{display:grid;grid-template-columns:repeat(3,minmax(160px,1fr)) auto auto;gap:12px;align-items:end}
.report-controls label{display:grid;gap:7px;color:var(--text);font-weight:700}
.report-controls input{border:1px solid var(--border);border-radius:10px;padding:11px 12px;background:var(--panel);color:var(--text)}
.report-section{display:grid;gap:15px}.report-section .panel-head{margin:0}.report-section .view-summary{margin:0}
.insurance-workspace .row-actions,.commission-workspace .row-actions,.reports-workspace .row-actions{display:flex;gap:8px;flex-wrap:wrap}
.danger-button{border:1px solid rgba(190,56,65,.28);background:rgba(219,69,79,.10);color:var(--danger);border-radius:9px;padding:8px 11px;font-weight:750;cursor:pointer}
.danger-button:hover{background:rgba(219,69,79,.17)}
@media(max-width:1080px){.insurance-summary-grid,.commission-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.report-controls{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.insurance-summary-grid,.commission-summary-grid,.report-controls{grid-template-columns:1fr}.report-controls button{width:100%}}

/* v0.10.0 procurement, inventory and dental laboratory workspaces */
.workflow-dialog{width:min(1120px,96vw)}
.workflow-dialog textarea{min-height:86px;resize:vertical}
.workflow-section{display:grid;gap:12px;border:1px solid var(--border);border-radius:14px;padding:14px;background:var(--panel-2)}
.workflow-section h3{margin:0;font-size:16px}
.workflow-lines{display:grid;gap:10px}
.workflow-line{display:grid;grid-template-columns:minmax(210px,1.8fr) repeat(4,minmax(110px,1fr)) auto;gap:10px;align-items:end;border:1px solid var(--border);border-radius:12px;padding:12px;background:var(--panel)}
.workflow-line>label{font-size:12px}
.workflow-line-title{align-self:center;min-width:190px;white-space:normal}
.workflow-line-title strong,.workflow-line-title small{display:block;white-space:normal}
.workflow-line-title small,.table-subtitle{display:block;margin-top:5px;color:var(--muted);font-size:11px;white-space:normal}
.return-line,.count-line{grid-template-columns:minmax(250px,2fr) minmax(150px,1fr)}
.transfer-line{grid-template-columns:minmax(300px,2fr) minmax(150px,1fr) auto}
.receipt-line{grid-template-columns:minmax(220px,1.7fr) repeat(5,minmax(115px,1fr))}
.procurement-workspace .view-summary,.inventory-workspace .view-summary,.labs-workspace .view-summary{grid-template-columns:repeat(4,minmax(0,1fr))}
.procurement-workspace .panel,.inventory-workspace .panel,.labs-workspace .panel{min-width:0}
button.danger{background:var(--danger);color:#fff}
@media(max-width:1100px){.workflow-line,.receipt-line{grid-template-columns:repeat(2,minmax(0,1fr))}.workflow-line-title{grid-column:1/-1}.procurement-workspace .view-summary,.inventory-workspace .view-summary,.labs-workspace .view-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.workflow-dialog{padding:14px}.workflow-line,.receipt-line,.return-line,.count-line,.transfer-line{grid-template-columns:1fr}.workflow-line-title{grid-column:auto}.procurement-workspace .view-summary,.inventory-workspace .view-summary,.labs-workspace .view-summary{grid-template-columns:1fr}.workflow-line button{width:100%}}

/* v0.11.0 advanced appointments, reception queue, schedules and chair board */
.appointments-workspace{gap:18px}.appointment-toolbar{display:grid;grid-template-columns:auto auto minmax(280px,1fr) auto;gap:14px;align-items:center}.calendar-navigation,.calendar-modes,.appointment-toolbar-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.calendar-navigation strong{min-width:190px;text-align:center}.calendar-modes button{background:var(--panel-2);color:var(--text);border:1px solid var(--border)}.calendar-modes button.active{background:var(--brand);color:#fff;border-color:var(--brand)}.appointment-filters{display:grid;grid-template-columns:repeat(2,minmax(150px,1fr));gap:10px}.appointment-filters select{border:1px solid var(--border);border-radius:10px;padding:10px 12px;background:var(--panel);color:var(--text)}.appointment-summary{grid-template-columns:repeat(5,minmax(0,1fr))}.advanced-calendar{overflow:hidden}.week-calendar{display:grid;grid-template-columns:repeat(7,minmax(160px,1fr));gap:10px;overflow-x:auto;padding-bottom:4px}.calendar-day-column{border:1px solid var(--border);border-radius:14px;background:var(--panel-2);min-height:260px;padding:10px;transition:border-color .18s ease,background .18s ease}.calendar-day-column>header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 4px 10px;border-bottom:1px solid var(--border)}.calendar-day-column>header h3{font-size:14px;margin:0}.calendar-day-column>header span{font-size:12px;color:var(--muted)}.calendar-day-events{display:grid;gap:9px;padding-top:10px}.calendar-empty{color:var(--muted);font-size:12px;text-align:center;padding:30px 6px}.calendar-appointment{display:grid;gap:5px;border:1px solid var(--border);border-inline-start:4px solid var(--blue);background:var(--panel);border-radius:11px;padding:10px;cursor:grab;box-shadow:0 6px 15px rgba(31,54,112,.06)}.calendar-appointment:active{cursor:grabbing}.calendar-appointment.status-waiting{border-inline-start-color:var(--orange)}.calendar-appointment.status-in_clinic,.calendar-appointment.status-completed{border-inline-start-color:var(--green)}.calendar-appointment.status-cancelled_by_patient,.calendar-appointment.status-cancelled_by_clinic,.calendar-appointment.status-no_show{border-inline-start-color:var(--danger);opacity:.72}.calendar-appointment-time{font-size:12px;font-weight:800;color:var(--brand)}.calendar-appointment strong{font-size:13px;white-space:normal}.calendar-appointment small{color:var(--muted);white-space:normal}.calendar-appointment .badge{justify-self:start}.calendar-appointment-actions{display:flex;gap:5px;flex-wrap:wrap;margin-top:4px}.calendar-appointment-actions button{font-size:10px;padding:5px 7px}.calendar-drop-zone.drag-over{border-color:var(--brand);background:var(--brand-soft)}.month-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:6px}.month-weekdays strong{text-align:center;font-size:12px;color:var(--muted);padding:6px}.month-calendar{display:grid;grid-template-columns:repeat(7,minmax(130px,1fr));gap:6px;overflow-x:auto}.month-day{min-height:130px;border:1px solid var(--border);border-radius:11px;padding:8px;background:var(--panel)}.month-day.outside{opacity:.42;background:var(--panel-2)}.month-day>header{display:flex;justify-content:space-between;margin-bottom:6px}.month-day>header span{font-weight:800}.month-day>header small{color:var(--muted)}.month-event{width:100%;display:flex;align-items:center;gap:6px;background:var(--brand-soft);color:var(--text);border:0;border-radius:7px;padding:5px 7px;margin:4px 0;font-size:11px;text-align:right;overflow:hidden}.month-event time{font-weight:800;color:var(--brand);flex:0 0 auto}.more-events{display:block;color:var(--muted);padding:3px}.reception-grid{align-items:start}.chair-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.chair-card{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:start;border:1px solid var(--border);border-inline-start:5px solid var(--green);border-radius:13px;padding:14px;background:var(--panel-2)}.chair-card h3{margin:3px 0}.chair-card p{margin:0;color:var(--muted);font-size:12px;white-space:normal}.chair-card>button{grid-column:1/-1}.chair-reserved{border-inline-start-color:var(--blue)}.chair-occupied{border-inline-start-color:var(--orange)}.chair-cleaning{border-inline-start-color:var(--purple)}.chair-maintenance,.chair-out_of_service{border-inline-start-color:var(--danger)}.error-state{text-align:center;padding:40px}.error-state p{color:var(--danger)}
@media(max-width:1260px){.appointment-toolbar{grid-template-columns:1fr 1fr}.appointment-toolbar-actions{grid-column:1/-1}.appointment-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.week-calendar{grid-template-columns:repeat(7,minmax(190px,1fr))}}
@media(max-width:820px){.appointment-toolbar{grid-template-columns:1fr}.appointment-filters{grid-template-columns:1fr}.appointment-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.calendar-navigation{justify-content:center}.calendar-navigation strong{order:-1;width:100%}.calendar-modes{justify-content:center}.appointment-toolbar-actions button{flex:1}.chair-board{grid-template-columns:1fr}.month-calendar{grid-template-columns:repeat(7,minmax(150px,1fr))}}
@media(max-width:520px){.appointment-summary{grid-template-columns:1fr}.appointment-toolbar-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.appointment-toolbar-actions button{width:100%}.calendar-appointment-actions{display:grid;grid-template-columns:1fr 1fr}.calendar-appointment-actions button{width:100%}}

/* 0.12.0 — السجل السريري السني المتقدم */
.clinical-workspace-shell{display:grid;gap:1rem}.clinical-workspace-toolbar{display:flex;flex-wrap:wrap;gap:.65rem;align-items:center}.clinical-stat{display:inline-flex;align-items:center;padding:.55rem .8rem;border-radius:999px;background:var(--soft-blue,#eef4ff);color:var(--primary,#3156c9);font-weight:700;font-size:.84rem}.clinical-panel{overflow:hidden}.odontogram-chart{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0}.odontogram-quadrant{border:1px solid var(--border,#e2e8f0);border-radius:16px;padding:.8rem;background:var(--surface,#fff)}.odontogram-quadrant h4{margin:0 0 .65rem;font-size:.92rem;color:var(--muted,#64748b)}.odontogram-teeth{display:grid;grid-template-columns:repeat(8,minmax(42px,1fr));gap:.35rem;direction:ltr}.tooth-cell{position:relative;min-height:72px;padding:.35rem;border:1px solid var(--border,#dbe3f2);border-radius:12px;background:var(--surface,#fff);color:var(--text,#0f172a);display:grid;place-items:center;gap:.1rem}.tooth-cell:hover{border-color:var(--primary,#3156c9);transform:translateY(-1px)}.tooth-number{font-weight:800;font-size:.8rem}.tooth-shape{font-size:1.45rem;line-height:1;color:#a8b3cb}.finding-dots{display:flex;gap:2px;min-height:8px}.finding-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--finding-color,#64748b);box-shadow:0 0 0 1px rgba(15,23,42,.08)}.tooth-cell small{position:absolute;inset-inline-end:5px;inset-block-start:4px;color:var(--muted,#64748b);font-size:.7rem}.clinical-legend{display:flex;flex-wrap:wrap;gap:.45rem .8rem;padding:.75rem 0 1rem}.clinical-legend span,.finding-label{display:inline-flex;align-items:center;gap:.35rem;font-size:.78rem;color:var(--muted,#64748b)}.clinical-plans-list{display:grid;gap:1rem}.clinical-plan-card,.clinical-session-card,.clinical-option-card{border:1px solid var(--border,#e2e8f0);border-radius:16px;padding:1rem;background:var(--surface,#fff)}.clinical-plan-card>header,.clinical-session-card>header,.clinical-option-card>header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.clinical-plan-card header small,.clinical-session-card header small,.clinical-option-card header small{display:block;color:var(--muted,#64748b);margin-top:.2rem}.clinical-options-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:.8rem;margin-top:.8rem}.clinical-option-card.approved{border-color:#52b788;box-shadow:0 0 0 2px rgba(82,183,136,.1)}.clinical-option-totals{display:flex;flex-wrap:wrap;gap:.55rem;margin:.7rem 0;font-size:.8rem}.clinical-option-totals span,.clinical-option-totals strong{padding:.35rem .55rem;border-radius:8px;background:var(--subtle,#f8fafc)}.clinical-sessions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:.8rem}.clinical-session-meta{display:flex;flex-wrap:wrap;gap:.7rem;margin:.65rem 0;color:var(--muted,#64748b);font-size:.82rem}.clinical-record-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.45rem;margin:.75rem 0}.clinical-record-grid div{background:var(--subtle,#f8fafc);border-radius:10px;padding:.55rem;text-align:center}.clinical-record-grid strong{display:block;font-size:1.05rem}.clinical-record-grid span{font-size:.72rem;color:var(--muted,#64748b)}.clinical-detail-list{display:grid;gap:.4rem;margin:.6rem 0 0;padding:0;list-style:none}.clinical-detail-list li{display:flex;justify-content:space-between;gap:1rem;padding:.55rem;border-radius:8px;background:var(--subtle,#f8fafc)}.compact-table table{font-size:.8rem}.clinical-session-card details{margin-top:.75rem}.clinical-session-card summary{cursor:pointer;font-weight:700;color:var(--primary,#3156c9)}
@media (max-width:1100px){.odontogram-chart{grid-template-columns:1fr}.odontogram-teeth{grid-template-columns:repeat(8,minmax(38px,1fr))}}
@media (max-width:720px){.odontogram-teeth{grid-template-columns:repeat(4,minmax(52px,1fr))}.clinical-options-grid,.clinical-sessions-grid{grid-template-columns:1fr}.clinical-workspace-toolbar>*{flex:1 1 auto}.clinical-record-grid{grid-template-columns:repeat(2,1fr)}}

/* 0.13.0 — Imaging, DICOM viewer, reports and FHIR export */
.imaging-workspace-shell{display:grid;gap:1rem}.imaging-overview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.imaging-study-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}.imaging-card-list{display:grid;gap:.8rem}.imaging-card{display:grid;gap:.75rem;width:100%;padding:1rem;border:1px solid var(--border);border-radius:16px;background:var(--surface);text-align:start;color:inherit}.imaging-card:hover{border-color:var(--primary);box-shadow:0 8px 22px rgba(0,0,0,.06)}button.imaging-card{cursor:pointer}.imaging-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}.imaging-card-head div{display:grid;gap:.2rem}.imaging-card-head small,.imaging-meta{color:var(--muted);font-size:.82rem}.imaging-meta{display:flex;flex-wrap:wrap;gap:.7rem}.dicom-viewer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:1rem}.imaging-instance-card{display:grid;gap:.8rem;padding:.9rem;border:1px solid var(--border);border-radius:16px;background:var(--surface-2)}.dicom-image-wrap{display:grid;place-items:center;min-height:280px;overflow:auto;border-radius:12px;background:#050708}.dicom-image-wrap img{display:block;max-width:100%;max-height:580px;object-fit:contain;image-rendering:auto}.annotation-list{display:grid;gap:.4rem;padding-top:.5rem;border-top:1px solid var(--border)}.annotation-list div{display:flex;justify-content:space-between;gap:.5rem}.imaging-report-card{display:grid;gap:.5rem;padding:1rem;border:1px solid var(--border);border-radius:14px}.imaging-report-card h3{margin:.4rem 0 0}.imaging-report-card p{white-space:pre-wrap;margin:0}.badge.neutral{background:var(--surface-2);color:var(--muted)}
@media(max-width:760px){.imaging-overview-grid{grid-template-columns:1fr}.dicom-viewer-grid{grid-template-columns:1fr}.dicom-image-wrap{min-height:220px}.imaging-card-head{align-items:stretch;flex-direction:column}}
/* v0.14.0 patient portal staff administration */
.patient-portal-admin{display:grid;gap:18px}.patient-portal-admin .metric-grid.compact{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:18px}.patient-portal-admin .metric-grid.compact article{min-height:100px}.intake-builder-row{display:grid;grid-template-columns:1fr 1.5fr 1fr auto;gap:10px;align-items:end}.inline-check{display:flex!important;align-items:center;gap:6px;padding:10px}.inline-check input{width:auto}.button-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border-radius:10px;padding:9px 13px}.button-link.secondary{background:var(--surface-soft);color:var(--primary);border:1px solid var(--border)}.success-state{display:grid;gap:14px;padding:18px;border:1px solid #a7d9cb;background:#edf9f5;border-radius:14px}.info-box{padding:12px;border-radius:12px;background:var(--surface-soft);color:var(--muted)}@media(max-width:800px){.patient-portal-admin .metric-grid.compact{grid-template-columns:1fr}.intake-builder-row{grid-template-columns:1fr}}

/* 0.15 communications and payment workspace */
.communications-workspace{display:grid;gap:1rem}.communications-workspace .metric-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.communications-workspace code{direction:ltr;display:block;max-width:100%;overflow:auto;font-size:.75rem}.panel-actions{display:flex;gap:.5rem;flex-wrap:wrap}.summary-card{display:grid;gap:.35rem;padding:1rem;border:1px solid var(--border);border-radius:1rem;background:var(--surface-soft)}.summary-card>div{display:flex;flex-direction:column;gap:.2rem}.summary-card small{color:var(--muted)}.error-text{display:block;color:var(--danger);max-width:22rem}.two-column-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}@media(max-width:980px){.communications-workspace .metric-grid,.two-column-grid{grid-template-columns:1fr 1fr}}@media(max-width:640px){.communications-workspace .metric-grid,.two-column-grid{grid-template-columns:1fr}.panel-actions{width:100%}.panel-actions button{flex:1}}

/* 0.17A_SETTINGS_COMMERCIAL_POLISH_START */
.settings-commercial-shell {
  direction: rtl;
}

.settings-commercial-shell .panel {
  overflow: visible;
}

.settings-commercial-shell #commercial-settings-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: 18px 22px;
  align-items: start;
  direction: rtl;
}

.settings-commercial-shell #commercial-settings-form label {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 8px;
  margin: 0;
  min-width: 0;
  text-align: right;
  color: var(--text);
  font-weight: 750;
}

.settings-commercial-shell #commercial-settings-form label > span {
  display: block;
  font-size: 13px;
  line-height: 1.5;
  color: var(--text);
}

.settings-commercial-shell #commercial-settings-form input,
.settings-commercial-shell #commercial-settings-form select,
.settings-commercial-shell #commercial-settings-form textarea {
  width: 100%;
  min-height: 44px;
  box-sizing: border-box;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 11px 13px;
  background: var(--panel);
  color: var(--text);
  font: inherit;
  line-height: 1.45;
  text-align: right;
  direction: rtl;
  outline: none;
}

.settings-commercial-shell #commercial-settings-form input[type="email"],
.settings-commercial-shell #commercial-settings-form input[type="tel"] {
  direction: ltr;
  text-align: left;
}

.settings-commercial-shell #commercial-settings-form input[type="number"],
.settings-commercial-shell #commercial-settings-form input[type="time"] {
  direction: ltr;
  text-align: center;
}

.settings-commercial-shell #commercial-settings-form textarea {
  min-height: 86px;
  resize: vertical;
}

.settings-commercial-shell #commercial-settings-form input:focus,
.settings-commercial-shell #commercial-settings-form select:focus,
.settings-commercial-shell #commercial-settings-form textarea:focus {
  border-color: #8da2ee;
  box-shadow: 0 0 0 3px rgba(54, 87, 214, .10);
}

.settings-commercial-shell #commercial-settings-form small {
  display: none;
}

.settings-commercial-shell #commercial-settings-form .span-2 {
  grid-column: 1 / -1;
}

.settings-commercial-shell #commercial-settings-form .dialog-actions {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding-top: 4px;
}

.settings-commercial-shell #commercial-settings-form .dialog-actions button {
  min-width: 132px;
}

.settings-commercial-shell #settings-save-status {
  font-size: 13px;
  color: var(--muted);
}

@media (max-width: 900px) {
  .settings-commercial-shell #commercial-settings-form {
    grid-template-columns: 1fr;
  }
}
/* 0.17A_SETTINGS_COMMERCIAL_POLISH_END */

/* 0.18D6_SUBSCRIPTION_BLOCKED_UX_START */
.subscription-blocked-body {
  margin: 0;
  min-height: 100vh;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at top right, rgba(185, 28, 28, 0.12), transparent 36%),
    radial-gradient(circle at bottom left, rgba(15, 23, 42, 0.10), transparent 34%),
    #f8fafc;
  color: #0f172a;
  font-family: Tahoma, Arial, sans-serif;
}

.subscription-blocked-shell {
  width: min(100% - 32px, 560px);
}

.subscription-blocked-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 28px;
  padding: 34px;
  text-align: center;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.14);
}

.subscription-blocked-icon {
  width: 70px;
  height: 70px;
  margin: 0 auto 18px;
  border-radius: 22px;
  display: grid;
  place-items: center;
  background: #fee2e2;
  color: #991b1b;
  font-size: 36px;
  font-weight: 900;
}

.subscription-blocked-card h1 {
  margin: 0 0 12px;
  font-size: clamp(24px, 4vw, 34px);
}

.subscription-blocked-card p {
  margin: 0 auto 22px;
  color: #475569;
  line-height: 1.9;
  max-width: 460px;
}

.subscription-blocked-actions {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin: 18px 0;
}

.subscription-blocked-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border-radius: 14px;
  padding: 12px 18px;
  background: #0f172a;
  color: #ffffff;
  font-weight: 800;
}

.subscription-blocked-note {
  margin-top: 20px;
  padding: 14px;
  border-radius: 16px;
  background: #f1f5f9;
  color: #64748b;
  font-size: 14px;
  line-height: 1.7;
}
/* 0.18D6_SUBSCRIPTION_BLOCKED_UX_END */

/* 0.19B_ROLE_DASHBOARD_FOUNDATION_CSS_START */
.role-dashboard-foundation {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(320px, 1.35fr);
  gap: 18px;
  align-items: stretch;
  margin-bottom: 18px;
  padding: 18px;
  border: 1px solid rgba(148, 163, 184, .24);
  border-radius: 24px;
  background: radial-gradient(circle at top right, rgba(59, 130, 246, .16), transparent 34%), linear-gradient(135deg, rgba(15, 23, 42, .94), rgba(30, 41, 59, .90));
  color: #f8fafc;
  box-shadow: 0 20px 45px rgba(15, 23, 42, .18);
}

.role-dashboard-copy h2 {
  margin: 8px 0 6px;
  font-size: clamp(1.25rem, 2vw, 1.8rem);
  color: inherit;
}

.role-dashboard-copy p {
  margin: 0;
  color: rgba(226, 232, 240, .86);
  line-height: 1.8;
}

.role-dashboard-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 5px 11px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .12);
  color: #fff;
  font-weight: 800;
  font-size: .78rem;
}

.role-dashboard-actions {
  display: grid;
  grid-template-columns: repeat(5, minmax(112px, 1fr));
  gap: 10px;
}

.role-action-card {
  appearance: none;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 18px;
  background: rgba(255, 255, 255, .10);
  color: #fff;
  padding: 14px;
  min-height: 86px;
  text-align: right;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
  transition: transform .16s ease, background .16s ease, border-color .16s ease;
}

.role-action-card:hover {
  transform: translateY(-2px);
  background: rgba(255, 255, 255, .17);
  border-color: rgba(255, 255, 255, .28);
}

.role-action-card strong {
  font-size: .96rem;
}

.role-action-card span {
  color: rgba(226, 232, 240, .82);
  font-size: .78rem;
  line-height: 1.5;
}

.role-dashboard-note,
.role-dashboard-empty {
  grid-column: 1 / -1;
  color: rgba(226, 232, 240, .72);
  font-size: .82rem;
}

.role-dashboard-doctor {
  background: radial-gradient(circle at top right, rgba(14, 165, 233, .22), transparent 34%), linear-gradient(135deg, rgba(8, 47, 73, .96), rgba(15, 23, 42, .92));
}

.role-dashboard-accountant {
  background: radial-gradient(circle at top right, rgba(34, 197, 94, .20), transparent 34%), linear-gradient(135deg, rgba(20, 83, 45, .94), rgba(15, 23, 42, .92));
}

.role-dashboard-reception {
  background: radial-gradient(circle at top right, rgba(168, 85, 247, .22), transparent 34%), linear-gradient(135deg, rgba(88, 28, 135, .94), rgba(15, 23, 42, .92));
}

@media (max-width: 1100px) {
  .role-dashboard-foundation { grid-template-columns: 1fr; }
  .role-dashboard-actions { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
}

@media (max-width: 640px) {
  .role-dashboard-foundation { padding: 14px; border-radius: 20px; }
  .role-dashboard-actions { grid-template-columns: 1fr; }
  .role-action-card { min-height: 72px; }
}
/* 0.19B_ROLE_DASHBOARD_FOUNDATION_CSS_END */

/* 0.19C_DOCTOR_DASHBOARD_CSS_START */
.doctor-dashboard-panel {
  margin-bottom: 18px;
  padding: 18px;
  border: 1px solid rgba(14, 165, 233, .18);
  border-radius: 24px;
  background:
    radial-gradient(circle at top left, rgba(14, 165, 233, .10), transparent 30%),
    linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 250, 252, .96));
  box-shadow: 0 16px 34px rgba(15, 23, 42, .08);
}

.doctor-dashboard-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin-bottom: 16px;
}

.doctor-dashboard-kicker {
  display: inline-flex;
  width: fit-content;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(14, 165, 233, .12);
  color: #0369a1;
  font-weight: 800;
  font-size: .78rem;
}

.doctor-dashboard-head h2 {
  margin: 8px 0 5px;
  color: #0f172a;
}

.doctor-dashboard-head p {
  margin: 0;
  color: #64748b;
  line-height: 1.7;
}

.doctor-dashboard-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(92px, 1fr));
  gap: 10px;
  min-width: min(390px, 100%);
}

.doctor-dashboard-stats article {
  border: 1px solid rgba(148, 163, 184, .20);
  border-radius: 18px;
  padding: 12px;
  background: #fff;
}

.doctor-dashboard-stats strong {
  display: block;
  color: #0f172a;
  font-size: 1.3rem;
}

.doctor-dashboard-stats span {
  color: #64748b;
  font-size: .78rem;
}

.doctor-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(300px, 1.05fr) minmax(320px, .95fr);
  gap: 14px;
}

.doctor-dashboard-column {
  display: grid;
  gap: 14px;
  align-content: start;
}

.doctor-mini-panel {
  border: 1px solid rgba(148, 163, 184, .20);
  border-radius: 20px;
  background: #fff;
  padding: 14px;
}

.doctor-mini-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  margin-bottom: 10px;
}

.doctor-mini-head h3 {
  margin: 0;
  color: #0f172a;
  font-size: 1rem;
}

.doctor-mini-head span {
  color: #64748b;
  font-size: .78rem;
}

.doctor-list,
.doctor-patient-list,
.doctor-clinical-actions {
  display: grid;
  gap: 9px;
}

.doctor-appointment-row,
.doctor-patient-row,
.doctor-clinical-card {
  appearance: none;
  width: 100%;
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: 16px;
  background: #f8fafc;
  padding: 11px;
  color: #0f172a;
  text-align: right;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

.doctor-appointment-row:hover,
.doctor-patient-row:hover,
.doctor-clinical-card:hover {
  transform: translateY(-1px);
  border-color: rgba(14, 165, 233, .35);
  background: #f0f9ff;
}

.doctor-appointment-row {
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 10px;
  align-items: center;
}

.doctor-appt-time {
  display: inline-flex;
  justify-content: center;
  border-radius: 12px;
  padding: 7px 8px;
  background: rgba(14, 165, 233, .12);
  color: #0369a1;
  font-weight: 900;
}

.doctor-appt-main {
  display: grid;
  gap: 3px;
}

.doctor-appt-main small,
.doctor-patient-row small,
.doctor-clinical-card span {
  color: #64748b;
  font-size: .78rem;
  line-height: 1.45;
}

.doctor-patient-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.doctor-patient-row span:last-child {
  display: grid;
  gap: 3px;
}

.doctor-clinical-actions {
  grid-template-columns: repeat(2, minmax(120px, 1fr));
}

.doctor-clinical-card {
  display: grid;
  gap: 5px;
  min-height: 76px;
}

.doctor-dashboard-empty {
  border: 1px dashed rgba(148, 163, 184, .34);
  border-radius: 16px;
  padding: 14px;
  color: #64748b;
  background: #f8fafc;
}

@media (max-width: 1100px) {
  .doctor-dashboard-head {
    flex-direction: column;
  }

  .doctor-dashboard-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .doctor-dashboard-panel {
    padding: 14px;
    border-radius: 20px;
  }

  .doctor-dashboard-stats,
  .doctor-clinical-actions {
    grid-template-columns: 1fr;
  }

  .doctor-appointment-row {
    grid-template-columns: 1fr;
  }
}
/* 0.19C_DOCTOR_DASHBOARD_CSS_END */

/* 0.19D_ACCOUNTANT_DASHBOARD_CSS_START */
.accountant-dashboard-panel {
  margin-bottom: 18px;
  padding: 18px;
  border: 1px solid rgba(34, 197, 94, .18);
  border-radius: 24px;
  background:
    radial-gradient(circle at top left, rgba(34, 197, 94, .10), transparent 30%),
    linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 250, 252, .96));
  box-shadow: 0 16px 34px rgba(15, 23, 42, .08);
}

.accountant-dashboard-head {
  display: grid;
  grid-template-columns: minmax(260px, .8fr) minmax(420px, 1.2fr);
  gap: 18px;
  align-items: start;
  margin-bottom: 16px;
}

.accountant-dashboard-kicker {
  display: inline-flex;
  width: fit-content;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(34, 197, 94, .12);
  color: #15803d;
  font-weight: 800;
  font-size: .78rem;
}

.accountant-dashboard-head h2 {
  margin: 8px 0 5px;
  color: #0f172a;
}

.accountant-dashboard-head p {
  margin: 0;
  color: #64748b;
  line-height: 1.7;
}

.accountant-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(110px, 1fr));
  gap: 10px;
}

.accountant-metric-card {
  border: 1px solid rgba(148, 163, 184, .20);
  border-radius: 18px;
  padding: 12px;
  background: #fff;
}

.accountant-metric-card span {
  display: block;
  color: #64748b;
  font-size: .78rem;
}

.accountant-metric-card strong {
  display: block;
  margin: 5px 0;
  color: #0f172a;
  font-size: 1.15rem;
}

.accountant-metric-card small {
  color: #94a3b8;
  font-size: .72rem;
  line-height: 1.45;
}

.accountant-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(300px, .8fr);
  gap: 14px;
}

.accountant-wide {
  grid-column: 1 / -1;
}

.accountant-mini-panel {
  border: 1px solid rgba(148, 163, 184, .20);
  border-radius: 20px;
  background: #fff;
  padding: 14px;
}

.accountant-mini-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  margin-bottom: 10px;
}

.accountant-mini-head h3 {
  margin: 0;
  color: #0f172a;
  font-size: 1rem;
}

.accountant-mini-head span {
  color: #64748b;
  font-size: .78rem;
}

.accountant-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(130px, 1fr));
  gap: 9px;
}

.accountant-action-card,
.accountant-patient-row {
  appearance: none;
  width: 100%;
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: 16px;
  background: #f8fafc;
  padding: 11px;
  color: #0f172a;
  text-align: right;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

.accountant-action-card:hover,
.accountant-patient-row:hover {
  transform: translateY(-1px);
  border-color: rgba(34, 197, 94, .35);
  background: #f0fdf4;
}

.accountant-action-card {
  display: grid;
  gap: 5px;
  min-height: 76px;
}

.accountant-action-card span,
.accountant-patient-row small {
  color: #64748b;
  font-size: .78rem;
  line-height: 1.45;
}

.accountant-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 9px;
}

.accountant-checklist li {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 8px;
  align-items: center;
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: 16px;
  background: #f8fafc;
  padding: 10px;
}

.accountant-checklist small {
  grid-column: 2;
  color: #94a3b8;
  font-size: .72rem;
}

.accountant-check-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 10px;
  background: rgba(34, 197, 94, .12);
  color: #15803d;
  font-weight: 900;
}

.accountant-patient-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 9px;
}

.accountant-patient-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  align-items: center;
}

.accountant-patient-row span:nth-child(2) {
  display: grid;
  gap: 3px;
}

.accountant-row-tag {
  display: inline-flex;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(34, 197, 94, .10);
  color: #15803d;
  font-weight: 800;
  font-size: .72rem;
}

.accountant-dashboard-empty {
  border: 1px dashed rgba(148, 163, 184, .34);
  border-radius: 16px;
  padding: 14px;
  color: #64748b;
  background: #f8fafc;
}

@media (max-width: 1180px) {
  .accountant-dashboard-head,
  .accountant-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .accountant-metrics {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }
}

@media (max-width: 640px) {
  .accountant-dashboard-panel {
    padding: 14px;
    border-radius: 20px;
  }

  .accountant-metrics,
  .accountant-actions,
  .accountant-patient-list {
    grid-template-columns: 1fr;
  }

  .accountant-patient-row {
    grid-template-columns: auto 1fr;
  }

  .accountant-row-tag {
    grid-column: 2;
    width: fit-content;
  }
}
/* 0.19D_ACCOUNTANT_DASHBOARD_CSS_END */

/* 0.19E_RECEPTION_DASHBOARD_CSS_START */
.reception-dashboard-panel {
  margin-bottom: 18px;
  padding: 18px;
  border: 1px solid rgba(168, 85, 247, .18);
  border-radius: 24px;
  background:
    radial-gradient(circle at top left, rgba(168, 85, 247, .10), transparent 30%),
    linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 250, 252, .96));
  box-shadow: 0 16px 34px rgba(15, 23, 42, .08);
}

.reception-dashboard-head {
  display: grid;
  grid-template-columns: minmax(260px, .8fr) minmax(420px, 1.2fr);
  gap: 18px;
  align-items: start;
  margin-bottom: 16px;
}

.reception-dashboard-kicker {
  display: inline-flex;
  width: fit-content;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(168, 85, 247, .12);
  color: #7e22ce;
  font-weight: 800;
  font-size: .78rem;
}

.reception-dashboard-head h2 {
  margin: 8px 0 5px;
  color: #0f172a;
}

.reception-dashboard-head p {
  margin: 0;
  color: #64748b;
  line-height: 1.7;
}

.reception-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(110px, 1fr));
  gap: 10px;
}

.reception-metric-card {
  border: 1px solid rgba(148, 163, 184, .20);
  border-radius: 18px;
  padding: 12px;
  background: #fff;
}

.reception-metric-card span {
  display: block;
  color: #64748b;
  font-size: .78rem;
}

.reception-metric-card strong {
  display: block;
  margin: 5px 0;
  color: #0f172a;
  font-size: 1.2rem;
}

.reception-metric-card small {
  color: #94a3b8;
  font-size: .72rem;
  line-height: 1.45;
}

.reception-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(300px, .95fr);
  gap: 14px;
}

.reception-mini-panel {
  border: 1px solid rgba(148, 163, 184, .20);
  border-radius: 20px;
  background: #fff;
  padding: 14px;
}

.reception-mini-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  margin-bottom: 10px;
}

.reception-mini-head h3 {
  margin: 0;
  color: #0f172a;
  font-size: 1rem;
}

.reception-mini-head span {
  color: #64748b;
  font-size: .78rem;
}

.reception-list,
.reception-actions,
.reception-patient-list {
  display: grid;
  gap: 9px;
}

.reception-actions {
  grid-template-columns: repeat(2, minmax(130px, 1fr));
}

.reception-action-card,
.reception-appointment-row,
.reception-patient-row {
  appearance: none;
  width: 100%;
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: 16px;
  background: #f8fafc;
  padding: 11px;
  color: #0f172a;
  text-align: right;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

.reception-action-card:hover,
.reception-appointment-row:hover,
.reception-patient-row:hover {
  transform: translateY(-1px);
  border-color: rgba(168, 85, 247, .35);
  background: #faf5ff;
}

.reception-action-card {
  display: grid;
  gap: 5px;
  min-height: 76px;
}

.reception-action-card span,
.reception-appt-main small,
.reception-patient-row small {
  color: #64748b;
  font-size: .78rem;
  line-height: 1.45;
}

.reception-appointment-row {
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 10px;
  align-items: center;
}

.reception-appt-time {
  display: inline-flex;
  justify-content: center;
  border-radius: 12px;
  padding: 7px 8px;
  background: rgba(168, 85, 247, .12);
  color: #7e22ce;
  font-weight: 900;
}

.reception-appt-main {
  display: grid;
  gap: 3px;
}

.reception-workflow {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 9px;
}

.reception-workflow li {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 8px;
  align-items: center;
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: 16px;
  background: #f8fafc;
  padding: 10px;
}

.reception-workflow small {
  grid-column: 2;
  color: #94a3b8;
  font-size: .72rem;
}

.reception-step-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 10px;
  background: rgba(168, 85, 247, .12);
  color: #7e22ce;
  font-weight: 900;
}

.reception-patient-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  align-items: center;
}

.reception-patient-row span:nth-child(2) {
  display: grid;
  gap: 3px;
}

.reception-row-tag {
  display: inline-flex;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(168, 85, 247, .10);
  color: #7e22ce;
  font-weight: 800;
  font-size: .72rem;
}

.reception-dashboard-empty {
  border: 1px dashed rgba(148, 163, 184, .34);
  border-radius: 16px;
  padding: 14px;
  color: #64748b;
  background: #f8fafc;
}

@media (max-width: 1180px) {
  .reception-dashboard-head,
  .reception-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .reception-metrics {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }
}

@media (max-width: 640px) {
  .reception-dashboard-panel {
    padding: 14px;
    border-radius: 20px;
  }

  .reception-metrics,
  .reception-actions {
    grid-template-columns: 1fr;
  }

  .reception-appointment-row,
  .reception-patient-row {
    grid-template-columns: 1fr;
  }

  .reception-row-tag {
    width: fit-content;
  }
}
/* 0.19E_RECEPTION_DASHBOARD_CSS_END */

/* 0.19F_ROLE_DASHBOARDS_UX_POLISH_CSS_START */
.role-dashboard-foundation,
.doctor-dashboard-panel,
.accountant-dashboard-panel,
.reception-dashboard-panel {
  scroll-margin-top: 18px;
}

.role-dashboard-foundation + .doctor-dashboard-panel,
.doctor-dashboard-panel + .accountant-dashboard-panel,
.accountant-dashboard-panel + .reception-dashboard-panel {
  margin-top: 0;
}

.role-dashboard-foundation button,
.doctor-dashboard-panel button,
.accountant-dashboard-panel button,
.reception-dashboard-panel button {
  font-family: inherit;
}

.role-dashboard-foundation .link-button,
.doctor-dashboard-panel .link-button,
.accountant-dashboard-panel .link-button,
.reception-dashboard-panel .link-button {
  min-height: 34px;
}

.doctor-dashboard-panel,
.accountant-dashboard-panel,
.reception-dashboard-panel {
  overflow: hidden;
}

.doctor-dashboard-panel .badge,
.accountant-dashboard-panel .badge,
.reception-dashboard-panel .badge {
  white-space: nowrap;
}

@media (min-width: 1280px) {
  .role-dashboard-foundation,
  .doctor-dashboard-panel,
  .accountant-dashboard-panel,
  .reception-dashboard-panel {
    margin-inline: 0;
  }
}

@media (max-width: 760px) {
  .role-dashboard-foundation,
  .doctor-dashboard-panel,
  .accountant-dashboard-panel,
  .reception-dashboard-panel {
    margin-bottom: 14px;
  }

  .doctor-mini-head,
  .accountant-mini-head,
  .reception-mini-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .doctor-mini-head .link-button,
  .accountant-mini-head .link-button,
  .reception-mini-head .link-button {
    width: 100%;
    justify-content: center;
  }

  .doctor-appointment-row .badge,
  .reception-appointment-row .badge {
    width: fit-content;
  }
}

@media (max-width: 420px) {
  .role-dashboard-copy h2,
  .doctor-dashboard-head h2,
  .accountant-dashboard-head h2,
  .reception-dashboard-head h2 {
    font-size: 1.14rem;
  }

  .role-action-card,
  .doctor-clinical-card,
  .accountant-action-card,
  .reception-action-card {
    min-height: 68px;
  }

  .accountant-checklist li,
  .reception-workflow li {
    grid-template-columns: 30px 1fr;
  }
}
/* 0.19F_ROLE_DASHBOARDS_UX_POLISH_CSS_END */

/* 0.21A_STAFF_MANAGEMENT_CSS_START */
.staff-add-button-021a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;margin-top:14px;padding:0 18px;border:0;border-radius:14px;background:linear-gradient(135deg,#2746c7,#5877ee);color:#fff;font-weight:800;cursor:pointer;box-shadow:0 12px 24px rgba(39,70,199,.22)}
.staff-modal-021a{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:18px;direction:rtl}.staff-modal-backdrop-021a{position:absolute;inset:0;background:rgba(15,23,42,.52);backdrop-filter:blur(4px)}.staff-modal-card-021a{position:relative;width:min(620px,100%);max-height:calc(100vh - 36px);overflow:auto;border-radius:24px;padding:22px;background:#fff;box-shadow:0 24px 60px rgba(15,23,42,.26)}.staff-modal-head-021a{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:18px}.staff-modal-head-021a h2{margin:0;font-size:1.35rem;color:#0f172a}.staff-modal-head-021a p{margin:6px 0 0;color:#64748b}.staff-close-021a{width:38px;height:38px;border:0;border-radius:12px;background:#f1f5f9;color:#0f172a;font-size:24px;cursor:pointer}.staff-form-021a{display:grid;gap:14px}.staff-form-021a label{display:grid;gap:7px;color:#334155;font-weight:700}.staff-form-021a input,.staff-form-021a select{width:100%;min-height:44px;border:1px solid #dbe4f0;border-radius:14px;padding:0 12px;background:#f8fafc;color:#0f172a;font:inherit}.staff-form-actions-021a{display:flex;gap:10px;justify-content:flex-start;margin-top:4px}.staff-form-actions-021a button{min-height:42px;padding:0 18px;border-radius:14px;border:0;font-weight:800;cursor:pointer}.staff-form-actions-021a .primary{background:#2746c7;color:#fff}.staff-form-actions-021a .secondary{background:#e2e8f0;color:#0f172a}.staff-toast-021a{position:fixed;z-index:10000;left:20px;bottom:20px;max-width:min(420px,calc(100vw - 40px));padding:13px 16px;border-radius:16px;background:#065f46;color:#fff;box-shadow:0 18px 40px rgba(15,23,42,.24);opacity:0;transform:translateY(12px);pointer-events:none;transition:.2s ease;direction:rtl;font-weight:700}.staff-toast-021a.is-visible{opacity:1;transform:translateY(0)}.staff-toast-021a.is-error{background:#991b1b}@media(max-width:640px){.staff-modal-021a{align-items:end;padding:0}.staff-modal-card-021a{width:100%;max-height:92vh;border-radius:24px 24px 0 0}.staff-form-actions-021a{flex-direction:column}}
/* 0.21A_STAFF_MANAGEMENT_CSS_END */

/* 0.22A_DOCTOR_TREATMENT_PRICE_CSS_START */
.doctor-treatment-price-panel {
  margin-top: 14px;
}

.doctor-treatment-price-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.doctor-treatment-price-form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  color: var(--muted, #64748b);
}

.doctor-treatment-price-form input,
.doctor-treatment-price-form select,
.doctor-treatment-price-form textarea {
  width: 100%;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 12px;
  padding: 10px 12px;
  background: var(--surface, #fff);
  color: var(--text, #0f172a);
  font: inherit;
}

.doctor-treatment-price-form textarea {
  min-height: 74px;
  resize: vertical;
}

.doctor-treatment-price-form .span-2 {
  grid-column: 1 / -1;
}

.doctor-treatment-price-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.doctor-treatment-price-status {
  font-size: 13px;
  color: var(--muted, #64748b);
}

.doctor-treatment-price-status.success {
  color: #047857;
  font-weight: 700;
}

.doctor-treatment-price-status.error {
  color: #b91c1c;
  font-weight: 700;
}

.doctor-treatment-price-status.loading {
  color: #0369a1;
}

@media (max-width: 780px) {
  .doctor-treatment-price-form {
    grid-template-columns: 1fr;
  }

  .doctor-treatment-price-form .span-2 {
    grid-column: auto;
  }
}
/* 0.22A_DOCTOR_TREATMENT_PRICE_CSS_END */

/* 0.22A.1_DASHBOARD_FORBIDDEN_FALLBACK_CSS_START */
.dashboard-fallback-022a1 {
  margin-bottom: 18px;
}
.dashboard-fallback-treatment-022a1 {
  margin-top: 18px;
}
.dashboard-fallback-treatment-022a1 .doctor-treatment-price-panel {
  max-width: 960px;
}
/* 0.22A.1_DASHBOARD_FORBIDDEN_FALLBACK_CSS_END */

/* 0.22A.2_TREATMENT_PLANS_FALLBACK_CSS_START */
.treatment-plans-fallback-022a2 {
  gap: 18px;
}
.treatment-plans-fallback-022a2 .doctor-treatment-price-panel {
  max-width: 980px;
}
.treatment-plans-fallback-022a2 .table-wrap table td,
.treatment-plans-fallback-022a2 .table-wrap table th {
  vertical-align: middle;
}
/* 0.22A.2_TREATMENT_PLANS_FALLBACK_CSS_END */

/* 0.22A.3_PROCEDURE_PRICE_DROPDOWN_CSS_START */
.procedure-picker-label-022a3,
.procedure-price-label-022a3,
.procedure-tooth-label-022a3 {
  gap: 8px;
}
.procedure-picker-title-022a3 {
  font-weight: 800;
  color: var(--text);
}
.procedure-picker-022a3 {
  display: grid;
  gap: 8px;
}
.procedure-search-022a3,
.procedure-select-022a3,
.procedure-price-select-022a3,
.procedure-tooth-label-022a3 select {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 12px 14px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  outline: none;
}
.procedure-search-022a3:focus,
.procedure-select-022a3:focus,
.procedure-price-select-022a3:focus,
.procedure-tooth-label-022a3 select:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(37, 99, 235, .10);
}
.procedure-selected-022a3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 42px;
  border-radius: 14px;
  background: rgba(37, 99, 235, .08);
  border: 1px solid rgba(37, 99, 235, .14);
  padding: 10px 12px;
  color: var(--text);
}
.procedure-selected-022a3 strong {
  font-weight: 900;
}
.procedure-selected-022a3 span {
  color: var(--muted);
  font-size: .86rem;
}
.procedure-price-hint-022a3 {
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.5;
}
.doctor-treatment-price-form .procedure-price-label-022a3 input[name="unit_price"] {
  margin-top: 0;
}
@media (max-width: 760px) {
  .procedure-selected-022a3 {
    align-items: flex-start;
    flex-direction: column;
  }
}
/* 0.22A.3_PROCEDURE_PRICE_DROPDOWN_CSS_END */

/* 0.22A.4_TREATMENT_PLANS_I18N_CSS_START */
.treatment-i18n-022a4 {
  display: grid;
  gap: 18px;
  direction: inherit;
}
.treatment-i18n-022a4[dir="ltr"] {
  direction: ltr;
  text-align: left;
}
.treatment-i18n-022a4[dir="rtl"] {
  direction: rtl;
  text-align: right;
}
.tpi-hero-022a4 {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 16px;
  padding: 22px;
  border: 1px solid rgba(71, 101, 255, .16);
  border-radius: 26px;
  background: linear-gradient(135deg, rgba(71, 101, 255, .11), rgba(255, 255, 255, .92));
  box-shadow: 0 18px 45px rgba(18, 34, 82, .08);
}
.tpi-hero-022a4 span {
  display: inline-flex;
  margin-bottom: 6px;
  font-weight: 800;
  color: #3651d4;
}
.tpi-hero-022a4 h2 {
  margin: 0 0 8px;
  font-size: clamp(24px, 3vw, 36px);
}
.tpi-hero-022a4 p {
  margin: 0;
  color: #667394;
  max-width: 720px;
}
.tpi-lang-card-022a4 {
  min-width: 220px;
  padding: 14px;
  border-radius: 20px;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(136, 150, 190, .18);
}
.tpi-lang-card-022a4 label {
  display: block;
  margin-bottom: 8px;
  font-weight: 800;
  color: #1f2a44;
}
.tpi-lang-buttons-022a4 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.tpi-lang-buttons-022a4 button {
  border: 1px solid rgba(74, 103, 255, .25);
  border-radius: 14px;
  padding: 10px 12px;
  background: #fff;
  color: #24314f;
  cursor: pointer;
  font-weight: 800;
}
.tpi-lang-buttons-022a4 button.active {
  background: linear-gradient(135deg, #3557ff, #6b82ff);
  color: #fff;
  box-shadow: 0 12px 28px rgba(53, 87, 255, .22);
}
.tpi-summary-022a4 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.tpi-form-panel-022a4,
.tpi-patients-panel-022a4 {
  border-radius: 24px;
}
.tpi-form-022a4 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.tpi-form-022a4 label {
  display: grid;
  gap: 8px;
  font-weight: 800;
  color: #1f2a44;
}
.tpi-form-022a4 input,
.tpi-form-022a4 select,
.tpi-form-022a4 textarea {
  width: 100%;
}
.tpi-form-022a4 small {
  color: #72809f;
  font-weight: 600;
}
.tpi-procedure-block-022a4 {
  padding: 14px;
  border: 1px solid rgba(94, 116, 180, .16);
  border-radius: 18px;
  background: rgba(246, 248, 255, .72);
}
.tpi-procedure-search-022a4 {
  font-size: 15px;
}
.tpi-procedure-select-022a4 {
  min-height: 48px;
}
.tpi-selected-procedure-022a4 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  background: #fff;
  border: 1px dashed rgba(75, 103, 255, .35);
  color: #4b5878;
}
.tpi-selected-procedure-022a4 strong {
  color: #17203a;
}
.tpi-selected-procedure-022a4 span {
  color: #667394;
  font-size: 13px;
}
.treatment-i18n-022a4[dir="ltr"] .doctor-treatment-price-actions {
  justify-content: flex-start;
}
.treatment-i18n-022a4[dir="rtl"] .doctor-treatment-price-actions {
  justify-content: flex-end;
}
.treatment-i18n-022a4[dir="ltr"] table {
  direction: ltr;
}
.treatment-i18n-022a4[dir="rtl"] table {
  direction: rtl;
}
@media (max-width: 900px) {
  .tpi-hero-022a4 {
    flex-direction: column;
  }
  .tpi-form-022a4 {
    grid-template-columns: 1fr;
  }
  .tpi-form-022a4 .span-2 {
    grid-column: auto;
  }
  .tpi-summary-022a4 {
    grid-template-columns: 1fr;
  }
}
/* 0.22A.4_TREATMENT_PLANS_I18N_CSS_END */

/* 0.22A.5_NEW_PATIENT_MEDICAL_HISTORY_CSS_START */
.new-patient-page-022a5 {
  display: grid;
  gap: 18px;
}
.nph-hero-022a5 {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: stretch;
  padding: 22px;
  border-radius: 28px;
  border: 1px solid rgba(49, 79, 203, .14);
  background: linear-gradient(135deg, rgba(48, 78, 212, .10), rgba(255,255,255,.94));
  box-shadow: 0 20px 52px rgba(31, 46, 100, .08);
}
.nph-hero-022a5 span {
  display: inline-flex;
  color: #3352cf;
  font-weight: 900;
  margin-bottom: 7px;
}
.nph-hero-022a5 h2 {
  margin: 0 0 8px;
  font-size: clamp(25px, 3vw, 38px);
}
.nph-hero-022a5 p {
  margin: 0;
  color: #667394;
}
.nph-code-box-022a5 {
  min-width: 220px;
  border-radius: 22px;
  padding: 16px;
  background: #fff;
  border: 1px solid rgba(91, 112, 180, .18);
  display: grid;
  align-content: center;
  gap: 5px;
}
.nph-code-box-022a5 small {
  color: #6b7797;
  font-weight: 800;
}
.nph-code-box-022a5 strong {
  font-size: 22px;
  color: #17203a;
}
.nph-code-box-022a5 em {
  font-style: normal;
  color: #7a86a5;
}
.nph-form-022a5 {
  display: grid;
  gap: 18px;
}
.nph-section-022a5 {
  border-radius: 24px;
}
.nph-grid-022a5 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.nph-grid-022a5 label {
  display: grid;
  gap: 8px;
  font-weight: 900;
  color: #17305f;
}
.nph-grid-022a5 input,
.nph-grid-022a5 select,
.nph-grid-022a5 textarea {
  width: 100%;
  min-height: 46px;
  border-radius: 14px;
}
.nph-grid-022a5 textarea {
  min-height: 92px;
  resize: vertical;
}
.nph-grid-022a5 .span-2 {
  grid-column: span 2;
}
.nph-check-grid-022a5 {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
  border-radius: 18px;
  background: rgba(247, 249, 255, .9);
  border: 1px solid rgba(84, 105, 176, .14);
}
.nph-check-022a5 {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 8px !important;
  padding: 10px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid rgba(93, 111, 170, .12);
  color: #24314f !important;
  font-weight: 800 !important;
}
.nph-check-022a5 input {
  width: auto !important;
  min-height: auto !important;
}
.nph-actions-022a5 {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 4px 0 16px;
}
.nph-status-022a5 {
  font-weight: 900;
}
.nph-status-022a5.loading {
  color: #3a58d5;
}
.nph-status-022a5.success {
  color: #0f8a4b;
}
.nph-status-022a5.error {
  color: #c62828;
}
@media (max-width: 1100px) {
  .nph-grid-022a5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .nph-check-grid-022a5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 720px) {
  .nph-hero-022a5 {
    flex-direction: column;
  }
  .nph-grid-022a5 {
    grid-template-columns: 1fr;
  }
  .nph-grid-022a5 .span-2 {
    grid-column: auto;
  }
  .nph-check-grid-022a5 {
    grid-template-columns: 1fr;
  }
  .nph-actions-022a5 {
    flex-direction: column-reverse;
    align-items: stretch;
  }
}
/* 0.22A.5_NEW_PATIENT_MEDICAL_HISTORY_CSS_END */

/* 0.22A.6_PROFESSIONAL_DOCTOR_DASHBOARD_CSS_START */
.professional-doctor-dashboard-022a6 {
  display: grid;
  gap: 18px;
  direction: rtl;
}
.pdd-hero-022a6 {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: stretch;
  padding: 24px;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(49, 82, 224, .13), rgba(255,255,255,.96));
  border: 1px solid rgba(55, 83, 205, .14);
  box-shadow: 0 22px 56px rgba(27, 42, 99, .10);
}
.pdd-hero-022a6 span {
  display: inline-flex;
  margin-bottom: 8px;
  color: #3554d6;
  font-weight: 900;
}
.pdd-hero-022a6 h2 {
  margin: 0 0 8px;
  font-size: clamp(26px, 3.2vw, 40px);
}
.pdd-hero-022a6 p {
  margin: 0;
  color: #657293;
}
.pdd-hero-meta-022a6 {
  min-width: 260px;
  padding: 16px;
  display: grid;
  align-content: center;
  gap: 6px;
  background: #fff;
  border-radius: 22px;
  border: 1px solid rgba(93, 111, 174, .16);
}
.pdd-hero-meta-022a6 small,
.pdd-hero-meta-022a6 em {
  color: #72809f;
  font-style: normal;
}
.pdd-hero-meta-022a6 strong {
  color: #16213e;
}
.pdd-kpis-022a6,
.pdd-finance-022a6 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.pdd-kpi-022a6 {
  display: flex;
  gap: 13px;
  align-items: center;
  padding: 18px;
  border-radius: 24px;
  background: #fff;
  border: 1px solid rgba(96, 113, 174, .14);
  box-shadow: 0 16px 38px rgba(22, 35, 81, .06);
}
.pdd-kpi-icon-022a6 {
  width: 46px;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  background: rgba(62, 91, 235, .10);
  font-size: 22px;
}
.pdd-kpi-022a6 small {
  display: block;
  color: #6c7898;
  font-weight: 800;
}
.pdd-kpi-022a6 strong {
  display: block;
  margin: 3px 0;
  font-size: 24px;
  color: #141e39;
}
.pdd-kpi-022a6 em {
  display: block;
  color: #7d89a6;
  font-style: normal;
  font-size: 12px;
}
.pdd-kpi-022a6.green .pdd-kpi-icon-022a6 { background: rgba(26, 156, 91, .12); }
.pdd-kpi-022a6.red .pdd-kpi-icon-022a6 { background: rgba(211, 63, 63, .12); }
.pdd-kpi-022a6.orange .pdd-kpi-icon-022a6 { background: rgba(234, 139, 41, .14); }
.pdd-kpi-022a6.purple .pdd-kpi-icon-022a6 { background: rgba(126, 82, 222, .12); }
.pdd-grid-022a6 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.pdd-panel-022a6 {
  border-radius: 24px;
  overflow: hidden;
}
.pdd-list-022a6 {
  display: grid;
  gap: 10px;
}
.pdd-row-022a6,
.pdd-patient-022a6 {
  width: 100%;
  border: 1px solid rgba(97, 115, 176, .13);
  background: #fff;
  border-radius: 16px;
  padding: 12px;
  display: flex;
  align-items: center;
  gap: 12px;
  text-align: right;
  cursor: pointer;
}
.pdd-row-022a6:hover,
.pdd-patient-022a6:hover,
.pdd-action-022a6:hover {
  border-color: rgba(61, 89, 224, .35);
  transform: translateY(-1px);
}
.pdd-row-time-022a6 {
  min-width: 70px;
  color: #3554d6;
  font-weight: 900;
}
.pdd-row-main-022a6 {
  flex: 1;
  display: grid;
  gap: 3px;
}
.pdd-row-main-022a6 strong,
.pdd-patient-022a6 strong {
  color: #17213d;
}
.pdd-row-main-022a6 small,
.pdd-patient-022a6 small {
  color: #72809f;
}
.pdd-money-022a6 {
  font-weight: 900;
  color: #0f8a4b;
}
.pdd-patient-022a6 span:nth-child(2) {
  flex: 1;
  display: grid;
}
.pdd-patient-022a6 em {
  color: #8a4d00;
  background: rgba(255, 190, 88, .18);
  border-radius: 999px;
  padding: 4px 9px;
  font-style: normal;
  font-size: 12px;
  font-weight: 800;
}
.pdd-actions-022a6 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.pdd-action-022a6 {
  text-align: right;
  display: grid;
  gap: 6px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(87, 106, 168, .15);
  background: linear-gradient(135deg, #fff, rgba(246, 248, 255, .86));
  cursor: pointer;
}
.pdd-action-022a6 span {
  font-size: 22px;
}
.pdd-action-022a6 strong {
  color: #17213d;
}
.pdd-action-022a6 small {
  color: #72809f;
}
.pdd-empty-022a6 {
  padding: 18px;
  border-radius: 16px;
  background: rgba(246, 248, 255, .8);
  color: #74809d;
  text-align: center;
}
@media (max-width: 1150px) {
  .pdd-kpis-022a6,
  .pdd-finance-022a6 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pdd-grid-022a6 {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .pdd-hero-022a6 {
    flex-direction: column;
  }
  .pdd-kpis-022a6,
  .pdd-finance-022a6,
  .pdd-actions-022a6 {
    grid-template-columns: 1fr;
  }
}
/* 0.22A.6_PROFESSIONAL_DOCTOR_DASHBOARD_CSS_END */

/* 0.22A.7_DOCTOR_WAITING_QUEUE_CSS_START */
.doctor-dashboard-queue-022a7 {
  display: grid;
  gap: 18px;
  direction: rtl;
}
.dwq-hero-022a7 {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: stretch;
  padding: 24px;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(39, 79, 222, .13), rgba(255,255,255,.96));
  border: 1px solid rgba(55, 83, 205, .14);
  box-shadow: 0 22px 56px rgba(27, 42, 99, .10);
}
.dwq-hero-022a7 span {
  display: inline-flex;
  margin-bottom: 8px;
  color: #3554d6;
  font-weight: 900;
}
.dwq-hero-022a7 h2 {
  margin: 0 0 8px;
  font-size: clamp(26px, 3.2vw, 40px);
}
.dwq-hero-022a7 p {
  margin: 0;
  color: #657293;
}
.dwq-live-box-022a7 {
  min-width: 240px;
  padding: 16px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid rgba(93, 111, 174, .16);
  display: grid;
  gap: 6px;
  align-content: center;
}
.dwq-live-box-022a7 small,
.dwq-live-box-022a7 em {
  color: #72809f;
  font-style: normal;
}
.dwq-live-box-022a7 strong {
  font-size: 34px;
  color: #16213e;
}
.dwq-kpis-grid-022a7,
.dwq-finance-grid-022a7 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.dwq-kpi-022a7 {
  display: flex;
  gap: 13px;
  align-items: center;
  padding: 18px;
  border-radius: 24px;
  background: #fff;
  border: 1px solid rgba(96, 113, 174, .14);
  box-shadow: 0 16px 38px rgba(22, 35, 81, .06);
}
.dwq-kpi-022a7 > span {
  width: 46px;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  background: rgba(62, 91, 235, .10);
  font-size: 22px;
}
.dwq-kpi-022a7 small {
  display: block;
  color: #6c7898;
  font-weight: 800;
}
.dwq-kpi-022a7 strong {
  display: block;
  margin: 3px 0;
  font-size: 24px;
  color: #141e39;
}
.dwq-kpi-022a7 em {
  display: block;
  color: #7d89a6;
  font-style: normal;
  font-size: 12px;
}
.dwq-layout-022a7 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.dwq-panel-022a7 {
  border-radius: 24px;
  overflow: hidden;
}
.dwq-panel-wide-022a7 {
  grid-column: span 2;
}
.dwq-list-022a7 {
  display: grid;
  gap: 10px;
}
.dwq-appointment-row-022a7,
.dwq-queue-row-022a7,
.dwq-row-022a7,
.dwq-patient-022a7 {
  width: 100%;
  border: 1px solid rgba(97, 115, 176, .13);
  background: #fff;
  border-radius: 16px;
  padding: 12px;
  display: flex;
  align-items: center;
  gap: 12px;
  text-align: right;
}
.dwq-queue-row-022a7.in_treatment {
  border-color: rgba(25, 150, 83, .35);
  background: linear-gradient(135deg, rgba(29, 158, 93, .08), #fff);
}
.dwq-time-022a7,
.dwq-queue-number-022a7 {
  min-width: 70px;
  color: #3554d6;
  font-weight: 900;
  text-align: center;
}
.dwq-queue-number-022a7 {
  font-size: 22px;
}
.dwq-main-022a7 {
  flex: 1;
  display: grid;
  gap: 3px;
}
.dwq-main-022a7 strong {
  color: #17213d;
}
.dwq-main-022a7 small {
  color: #72809f;
}
.dwq-row-actions-022a7 {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.dwq-inline-action-022a7,
.dwq-enter-022a7,
.dwq-cancel-022a7 {
  border: 0;
  border-radius: 12px;
  padding: 9px 12px;
  font-weight: 900;
  cursor: pointer;
}
.dwq-inline-action-022a7,
.dwq-enter-022a7 {
  background: linear-gradient(135deg, #2855ff, #6681ff);
  color: #fff;
  box-shadow: 0 10px 22px rgba(49, 80, 221, .18);
}
.dwq-cancel-022a7 {
  background: rgba(204, 49, 49, .10);
  color: #a42f2f;
}
.dwq-inline-action-022a7:disabled,
.dwq-enter-022a7:disabled,
.dwq-cancel-022a7:disabled {
  opacity: .55;
  cursor: not-allowed;
}
.dwq-badge-022a7 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 6px 10px;
  background: rgba(94, 110, 160, .12);
  color: #40506d;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.dwq-badge-022a7.waiting { background: rgba(255, 190, 88, .18); color: #8a4d00; }
.dwq-badge-022a7.called { background: rgba(72, 114, 255, .14); color: #284ac9; }
.dwq-badge-022a7.seated,
.dwq-badge-022a7.in_treatment,
.dwq-badge-022a7.in_clinic { background: rgba(25, 150, 83, .14); color: #0f7b45; }
.dwq-badge-022a7.cancelled,
.dwq-badge-022a7.no_show { background: rgba(204, 49, 49, .12); color: #a42f2f; }
.dwq-money-022a7 {
  font-weight: 900;
  color: #0f8a4b;
}
.dwq-row-022a7,
.dwq-patient-022a7,
.dwq-action-card-022a7 {
  cursor: pointer;
}
.dwq-row-022a7:hover,
.dwq-patient-022a7:hover,
.dwq-action-card-022a7:hover,
.dwq-appointment-row-022a7:hover,
.dwq-queue-row-022a7:hover {
  border-color: rgba(61, 89, 224, .35);
}
.dwq-patient-022a7 span:nth-child(2) {
  flex: 1;
  display: grid;
}
.dwq-patient-022a7 em {
  color: #8a4d00;
  background: rgba(255, 190, 88, .18);
  border-radius: 999px;
  padding: 4px 9px;
  font-style: normal;
  font-size: 12px;
  font-weight: 800;
}
.dwq-actions-022a7 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.dwq-action-card-022a7 {
  text-align: right;
  display: grid;
  gap: 6px;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(87, 106, 168, .15);
  background: linear-gradient(135deg, #fff, rgba(246, 248, 255, .86));
}
.dwq-action-card-022a7 span {
  font-size: 22px;
}
.dwq-action-card-022a7 strong {
  color: #17213d;
}
.dwq-action-card-022a7 small {
  color: #72809f;
}
.dwq-empty-022a7 {
  padding: 18px;
  border-radius: 16px;
  background: rgba(246, 248, 255, .8);
  color: #74809d;
  text-align: center;
}
@media (max-width: 1150px) {
  .dwq-kpis-grid-022a7,
  .dwq-finance-grid-022a7,
  .dwq-layout-022a7 {
    grid-template-columns: 1fr;
  }
  .dwq-panel-wide-022a7 {
    grid-column: auto;
  }
}
@media (max-width: 720px) {
  .dwq-hero-022a7,
  .dwq-appointment-row-022a7,
  .dwq-queue-row-022a7,
  .dwq-row-022a7,
  .dwq-patient-022a7 {
    flex-direction: column;
    align-items: stretch;
  }
  .dwq-row-actions-022a7,
  .dwq-actions-022a7 {
    display: grid;
    grid-template-columns: 1fr;
  }
}
/* 0.22A.7_DOCTOR_WAITING_QUEUE_CSS_END */

/* 0.22A.8_DOCTOR_PATIENT_TREATMENT_WORKSPACE_CSS_START */
.doctor-treatment-workspace-022a8 {
  display: grid;
  gap: 18px;
  direction: rtl;
}
.dtw-hero-022a8 {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: stretch;
  padding: 24px;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(38, 92, 225, .14), rgba(255,255,255,.96));
  border: 1px solid rgba(55, 83, 205, .14);
  box-shadow: 0 22px 56px rgba(27, 42, 99, .10);
}
.dtw-hero-022a8 span {
  display: inline-flex;
  margin-bottom: 8px;
  color: #3554d6;
  font-weight: 900;
}
.dtw-hero-022a8 h2 {
  margin: 0 0 8px;
  font-size: clamp(26px, 3.2vw, 40px);
}
.dtw-hero-022a8 p {
  margin: 0;
  color: #657293;
}
.dtw-queue-box-022a8 {
  min-width: 220px;
  padding: 16px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid rgba(93, 111, 174, .16);
  display: grid;
  gap: 5px;
  align-content: center;
}
.dtw-queue-box-022a8 small,
.dtw-queue-box-022a8 em {
  color: #72809f;
  font-style: normal;
}
.dtw-queue-box-022a8 strong {
  font-size: 34px;
  color: #16213e;
}
.dtw-kpis-022a8 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.dtw-kpis-022a8 article {
  padding: 18px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid rgba(96, 113, 174, .14);
  box-shadow: 0 16px 38px rgba(22, 35, 81, .06);
}
.dtw-kpis-022a8 small,
.dtw-value-022a8 small,
.dtw-history-card-022a8 small {
  display: block;
  color: #6c7898;
  font-weight: 900;
  margin-bottom: 5px;
}
.dtw-kpis-022a8 strong {
  color: #14203d;
  font-size: 20px;
}
.dtw-main-grid-022a8 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.dtw-panel-022a8 {
  border-radius: 24px;
  overflow: hidden;
}
.dtw-form-panel-022a8 {
  grid-column: span 2;
}
.dtw-values-grid-022a8,
.dtw-history-grid-022a8 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.dtw-value-022a8,
.dtw-history-card-022a8,
.dtw-record-022a8,
.dtw-invoice-022a8 {
  padding: 14px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(97, 115, 176, .13);
}
.dtw-value-022a8 strong {
  color: #17213d;
}
.dtw-history-card-022a8 p,
.dtw-record-022a8 p {
  margin: 0;
  color: #31405e;
  white-space: pre-wrap;
}
.dtw-history-card-022a8.danger {
  border-color: rgba(201, 55, 55, .22);
  background: rgba(201, 55, 55, .05);
}
.dtw-history-card-022a8.warn {
  border-color: rgba(228, 141, 35, .22);
  background: rgba(228, 141, 35, .06);
}
.dtw-history-card-022a8.info {
  border-color: rgba(43, 92, 219, .22);
  background: rgba(43, 92, 219, .05);
}
.dtw-form-022a8 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.dtw-form-022a8 label {
  display: grid;
  gap: 8px;
  color: #17305f;
  font-weight: 900;
}
.dtw-form-022a8 input,
.dtw-form-022a8 select,
.dtw-form-022a8 textarea {
  width: 100%;
  min-height: 46px;
  border-radius: 14px;
}
.dtw-form-022a8 textarea {
  min-height: 92px;
  resize: vertical;
}
.dtw-form-022a8 .span-2 {
  grid-column: span 2;
}
.dtw-form-actions-022a8 {
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 12px !important;
}
#dtw-procedure-status-022a8 {
  font-weight: 900;
}
.dtw-saving-022a8 { color: #3554d6; }
.dtw-success-022a8 { color: #0f8a4b; }
.dtw-error-022a8 { color: #b83434; }
.dtw-records-022a8 {
  display: grid;
  gap: 10px;
}
.dtw-record-022a8 div,
.dtw-invoice-022a8 div {
  display: grid;
  gap: 3px;
}
.dtw-record-022a8 strong,
.dtw-invoice-022a8 strong {
  color: #17213d;
}
.dtw-record-022a8 small,
.dtw-invoice-022a8 small {
  color: #72809f;
}
.dtw-money-022a8 {
  color: #0f8a4b !important;
  font-weight: 900;
}
.dtw-invoice-022a8 {
  display: flex;
  align-items: center;
  gap: 10px;
}
.dtw-invoice-022a8 div {
  flex: 1;
}
.dtw-invoice-022a8 em {
  font-style: normal;
  color: #0f8a4b;
  font-weight: 900;
}
.dtw-badge-022a8 {
  border-radius: 999px;
  padding: 6px 10px;
  background: rgba(94, 110, 160, .12);
  color: #40506d;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.dtw-badge-022a8.in_treatment,
.dtw-badge-022a8.in_clinic,
.dtw-badge-022a8.in_progress,
.dtw-badge-022a8.paid {
  background: rgba(25, 150, 83, .14);
  color: #0f7b45;
}
.dtw-badge-022a8.draft,
.dtw-badge-022a8.waiting,
.dtw-badge-022a8.partially_paid {
  background: rgba(255, 190, 88, .18);
  color: #8a4d00;
}
.dtw-empty-022a8 {
  padding: 18px;
  border-radius: 16px;
  background: rgba(246, 248, 255, .8);
  color: #74809d;
  text-align: center;
}
@media (max-width: 1150px) {
  .dtw-kpis-022a8,
  .dtw-main-grid-022a8,
  .dtw-values-grid-022a8,
  .dtw-history-grid-022a8 {
    grid-template-columns: 1fr;
  }
  .dtw-form-panel-022a8 {
    grid-column: auto;
  }
  .dtw-form-022a8 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 720px) {
  .dtw-hero-022a8 {
    flex-direction: column;
  }
  .dtw-form-022a8 {
    grid-template-columns: 1fr;
  }
  .dtw-form-022a8 .span-2 {
    grid-column: auto;
  }
  .dtw-form-actions-022a8 {
    flex-direction: column-reverse;
    align-items: stretch;
  }
  .dtw-invoice-022a8 {
    flex-direction: column;
    align-items: stretch;
  }
}
/* 0.22A.8_DOCTOR_PATIENT_TREATMENT_WORKSPACE_CSS_END */

/* 0.22A.9_TREATMENT_WORKSPACE_PAYMENT_BALANCE_CSS_START */
.dtw-payment-field-022a9 input[readonly] {
  background: rgba(241, 245, 255, .85);
  color: #17213d;
  font-weight: 900;
}
.dtw-payment-summary-022a9 {
  padding: 13px 15px;
  border-radius: 16px;
  background: rgba(34, 151, 91, .10);
  border: 1px solid rgba(34, 151, 91, .22);
  color: #0f7b45;
  font-weight: 900;
}
.dtw-payment-summary-022a9.invalid {
  background: rgba(203, 57, 57, .10);
  border-color: rgba(203, 57, 57, .25);
  color: #b83434;
}
.dtw-form-022a8 button[type="submit"]:disabled {
  opacity: .55;
  cursor: not-allowed;
}
/* 0.22A.9_TREATMENT_WORKSPACE_PAYMENT_BALANCE_CSS_END */

/* 0.22A.10_PREMIUM_TREATMENT_WORKSPACE_CSS_START */
.premium-treatment-workspace-022a10 {
  --ptw-blue: #2f5cf6;
  --ptw-blue-2: #6d86ff;
  --ptw-ink: #111c36;
  --ptw-muted: #6b7898;
  --ptw-line: rgba(90, 112, 175, .16);
  --ptw-soft: rgba(246, 248, 255, .92);
  display: grid;
  gap: 20px;
  direction: rtl;
}
.ptw-hero-022a10 {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 18px;
  padding: 24px;
  border-radius: 32px;
  background:
    radial-gradient(circle at top right, rgba(71, 111, 255, .22), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(239,244,255,.95));
  border: 1px solid var(--ptw-line);
  box-shadow: 0 26px 70px rgba(23, 39, 92, .12);
  overflow: hidden;
  position: relative;
}
.ptw-hero-022a10::after {
  content: "";
  position: absolute;
  inset: auto -80px -120px auto;
  width: 280px;
  height: 280px;
  border-radius: 50%;
  background: rgba(47, 92, 246, .09);
}
.ptw-patient-identity-022a10 {
  display: flex;
  gap: 18px;
  align-items: center;
  position: relative;
  z-index: 1;
}
.ptw-avatar-022a10 {
  width: 82px;
  height: 82px;
  border-radius: 26px;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 26px;
  font-weight: 1000;
  background: linear-gradient(145deg, var(--ptw-blue), var(--ptw-blue-2));
  box-shadow: 0 18px 35px rgba(47, 92, 246, .26);
  flex: 0 0 auto;
}
.ptw-patient-identity-022a10 span,
.ptw-section-title-022a10 small {
  color: var(--ptw-blue);
  font-weight: 1000;
  letter-spacing: .01em;
}
.ptw-patient-identity-022a10 h2 {
  margin: 4px 0 8px;
  color: var(--ptw-ink);
  font-size: clamp(28px, 3.4vw, 44px);
  letter-spacing: -.03em;
}
.ptw-patient-identity-022a10 p {
  margin: 0;
  color: var(--ptw-muted);
}
.ptw-tags-022a10 {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.ptw-tags-022a10 em {
  font-style: normal;
  border-radius: 999px;
  padding: 7px 11px;
  background: #fff;
  color: #334466;
  border: 1px solid var(--ptw-line);
  font-weight: 900;
  font-size: 12px;
}
.ptw-hero-side-022a10 {
  min-width: 260px;
  position: relative;
  z-index: 1;
  padding: 18px;
  border-radius: 24px;
  background: rgba(255,255,255,.92);
  border: 1px solid var(--ptw-line);
  display: grid;
  gap: 8px;
  align-content: center;
}
.ptw-hero-side-022a10 strong {
  color: #0f8a4b;
  font-size: 28px;
}
.ptw-hero-side-022a10 small {
  color: var(--ptw-muted);
  font-weight: 800;
}
.ptw-summary-022a10 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 14px;
}
.ptw-info-022a10 {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 15px;
  border: 1px solid var(--ptw-line);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(20, 35, 83, .055);
}
.ptw-info-022a10 > span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(47, 92, 246, .09);
  font-size: 19px;
}
.ptw-info-022a10 small {
  display: block;
  color: var(--ptw-muted);
  font-weight: 900;
  margin-bottom: 3px;
}
.ptw-info-022a10 strong {
  color: var(--ptw-ink);
  font-weight: 1000;
}
.ptw-layout-022a10 {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr);
  gap: 18px;
  align-items: start;
}
.ptw-main-022a10,
.ptw-sidebar-022a10,
.ptw-history-tabs-022a10,
.ptw-info-list-022a10,
.ptw-alert-list-022a10,
.ptw-records-022a10 {
  display: grid;
  gap: 14px;
}
.ptw-treatment-card-022a10,
.ptw-panel-022a10 {
  border-radius: 28px !important;
  border: 1px solid var(--ptw-line) !important;
  box-shadow: 0 18px 46px rgba(21, 34, 78, .07) !important;
}
.ptw-section-title-022a10 {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 16px;
}
.ptw-section-title-022a10 h2 {
  margin: 4px 0 0;
  color: var(--ptw-ink);
  font-size: 20px;
}
.ptw-section-title-022a10 > span {
  color: var(--ptw-muted);
  font-size: 12px;
  font-weight: 800;
}
.ptw-treatment-form-022a10 {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
.ptw-treatment-form-022a10 label {
  grid-column: span 2;
  padding: 12px;
  border-radius: 18px;
  background: rgba(248, 250, 255, .82);
  border: 1px solid rgba(92, 113, 175, .11);
}
.ptw-treatment-form-022a10 .span-2 {
  grid-column: span 3 !important;
}
.ptw-treatment-form-022a10 .dtw-payment-field-022a9 {
  grid-column: span 2;
  background: rgba(34, 151, 91, .07);
  border-color: rgba(34, 151, 91, .18);
}
.ptw-treatment-form-022a10 .dtw-payment-summary-022a9 {
  grid-column: span 6 !important;
  font-size: 15px;
}
.ptw-form-actions-022a10 {
  grid-column: span 6 !important;
  padding-top: 8px;
}
.ptw-form-actions-022a10 button[type="submit"] {
  min-width: 180px;
  background: linear-gradient(135deg, #2754f6, #6d86ff);
  box-shadow: 0 16px 28px rgba(47, 92, 246, .22);
}
.ptw-history-tabs-022a10 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ptw-alert-022a10 {
  display: flex;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid var(--ptw-line);
  background: #fff;
}
.ptw-alert-022a10 > span {
  width: 38px;
  height: 38px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(47, 92, 246, .08);
  flex: 0 0 auto;
}
.ptw-alert-022a10 strong {
  display: block;
  color: var(--ptw-ink);
  margin-bottom: 4px;
}
.ptw-alert-022a10 p {
  margin: 0;
  color: #31405e;
  white-space: pre-wrap;
}
.ptw-alert-022a10.danger { background: rgba(204, 49, 49, .055); border-color: rgba(204, 49, 49, .20); }
.ptw-alert-022a10.warn { background: rgba(234, 139, 41, .07); border-color: rgba(234, 139, 41, .20); }
.ptw-alert-022a10.info { background: rgba(47, 92, 246, .055); border-color: rgba(47, 92, 246, .18); }
.ptw-record-022a10,
.ptw-invoice-022a10 {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid var(--ptw-line);
  background: #fff;
}
.ptw-record-main-022a10 {
  flex: 1;
  display: grid;
  gap: 4px;
}
.ptw-record-022a10 strong,
.ptw-invoice-022a10 strong {
  color: var(--ptw-ink);
}
.ptw-record-022a10 small,
.ptw-invoice-022a10 small,
.ptw-record-022a10 p {
  color: var(--ptw-muted);
}
.ptw-record-022a10 p {
  margin: 0;
}
.ptw-record-022a10 em,
.ptw-invoice-022a10 em {
  font-style: normal;
  color: #0f8a4b;
  font-weight: 1000;
}
.ptw-invoice-022a10 div {
  flex: 1;
  display: grid;
  gap: 4px;
}
.ptw-badge-022a10,
.ptw-tags-022a10 .ptw-badge-022a10 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 6px 10px;
  background: rgba(94, 110, 160, .12);
  color: #40506d;
  font-size: 12px;
  font-weight: 1000;
  white-space: nowrap;
}
.ptw-badge-022a10.in_treatment,
.ptw-badge-022a10.in_clinic,
.ptw-badge-022a10.in_progress,
.ptw-badge-022a10.paid {
  background: rgba(25, 150, 83, .14);
  color: #0f7b45;
}
.ptw-badge-022a10.draft,
.ptw-badge-022a10.waiting,
.ptw-badge-022a10.partially_paid {
  background: rgba(255, 190, 88, .18);
  color: #8a4d00;
}
.ptw-empty-022a10 {
  padding: 18px;
  border-radius: 18px;
  background: var(--ptw-soft);
  color: var(--ptw-muted);
  text-align: center;
  border: 1px dashed var(--ptw-line);
}
@media (max-width: 1280px) {
  .ptw-layout-022a10,
  .ptw-history-tabs-022a10 {
    grid-template-columns: 1fr;
  }
  .ptw-sidebar-022a10 {
    grid-row: auto;
  }
}
@media (max-width: 900px) {
  .ptw-hero-022a10,
  .ptw-patient-identity-022a10 {
    flex-direction: column;
    align-items: stretch;
  }
  .ptw-summary-022a10 {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .ptw-treatment-form-022a10 {
    grid-template-columns: 1fr !important;
  }
  .ptw-treatment-form-022a10 label,
  .ptw-treatment-form-022a10 .span-2,
  .ptw-treatment-form-022a10 .dtw-payment-field-022a9,
  .ptw-treatment-form-022a10 .dtw-payment-summary-022a9,
  .ptw-form-actions-022a10 {
    grid-column: auto !important;
  }
}
@media (max-width: 640px) {
  .ptw-summary-022a10,
  .ptw-record-022a10,
  .ptw-invoice-022a10 {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: stretch;
  }
}
/* 0.22A.10_PREMIUM_TREATMENT_WORKSPACE_CSS_END */

/* 0.22A.11_MAIN_CASHBOX_SALARIES_EXPENSES_CSS_START */
.main-cashbox-workspace-022a11 {
  --mcb-green: #11945a;
  --mcb-red: #c2413b;
  --mcb-blue: #315cf6;
  --mcb-amber: #b86b00;
  --mcb-ink: #111c36;
  --mcb-muted: #6d7896;
  --mcb-line: rgba(91, 112, 176, .16);
  display: grid;
  gap: 18px;
  direction: rtl;
}
.mcb-hero-022a11 {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 26px;
  border-radius: 32px;
  border: 1px solid var(--mcb-line);
  background:
    radial-gradient(circle at top right, rgba(17,148,90,.18), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(240,248,244,.95));
  box-shadow: 0 26px 70px rgba(17, 43, 31, .11);
}
.mcb-hero-022a11 span {
  color: var(--mcb-green);
  font-weight: 1000;
}
.mcb-hero-022a11 h2 {
  margin: 5px 0 8px;
  font-size: clamp(30px, 3.4vw, 46px);
  color: var(--mcb-ink);
}
.mcb-hero-022a11 p {
  margin: 0;
  color: var(--mcb-muted);
}
.mcb-balance-box-022a11 {
  min-width: 285px;
  padding: 20px;
  border-radius: 24px;
  background: #fff;
  border: 1px solid var(--mcb-line);
  display: grid;
  gap: 6px;
}
.mcb-balance-box-022a11 small,
.mcb-balance-box-022a11 em {
  color: var(--mcb-muted);
  font-style: normal;
  font-weight: 800;
}
.mcb-balance-box-022a11 strong {
  color: var(--mcb-green);
  font-size: 31px;
}
.mcb-toolbar-022a11 {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: end;
  padding: 14px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid var(--mcb-line);
}
.mcb-toolbar-022a11 label {
  display: grid;
  gap: 7px;
  color: var(--mcb-muted);
  font-weight: 900;
  min-width: 240px;
}
.mcb-toolbar-022a11 div {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.mcb-kpis-022a11 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.mcb-kpi-022a11 {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 18px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid var(--mcb-line);
  box-shadow: 0 14px 38px rgba(21, 35, 80, .06);
}
.mcb-kpi-022a11 > span {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  font-size: 21px;
  background: rgba(49,92,246,.08);
}
.mcb-kpi-022a11.in > span { background: rgba(17,148,90,.10); }
.mcb-kpi-022a11.out > span { background: rgba(194,65,59,.10); }
.mcb-kpi-022a11.salary > span { background: rgba(184,107,0,.11); }
.mcb-kpi-022a11 small {
  display: block;
  color: var(--mcb-muted);
  font-weight: 900;
}
.mcb-kpi-022a11 strong {
  display: block;
  color: var(--mcb-ink);
  font-size: 22px;
  margin: 3px 0;
}
.mcb-kpi-022a11 em {
  color: var(--mcb-muted);
  font-style: normal;
  font-size: 12px;
}
.mcb-grid-022a11 {
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  gap: 16px;
  align-items: start;
}
.mcb-wide-022a11 {
  grid-row: span 2;
}
.mcb-panel-022a11,
.mcb-form-panel-022a11 {
  border-radius: 26px !important;
  border: 1px solid var(--mcb-line) !important;
  box-shadow: 0 18px 46px rgba(21, 35, 80, .07) !important;
}
.mcb-movements-022a11,
.mcb-list-022a11 {
  display: grid;
  gap: 10px;
}
.mcb-movement-022a11,
.mcb-small-row-022a11 {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid var(--mcb-line);
}
.mcb-movement-022a11 > span {
  width: 38px;
  height: 38px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-weight: 1000;
}
.mcb-movement-022a11.in > span {
  color: var(--mcb-green);
  background: rgba(17,148,90,.10);
}
.mcb-movement-022a11.out > span {
  color: var(--mcb-red);
  background: rgba(194,65,59,.10);
}
.mcb-movement-022a11 div,
.mcb-small-row-022a11 div {
  flex: 1;
  display: grid;
  gap: 4px;
}
.mcb-movement-022a11 strong,
.mcb-small-row-022a11 strong {
  color: var(--mcb-ink);
}
.mcb-movement-022a11 small,
.mcb-movement-022a11 em,
.mcb-small-row-022a11 small {
  color: var(--mcb-muted);
  font-style: normal;
}
.mcb-movement-022a11 b,
.mcb-small-row-022a11 b {
  font-weight: 1000;
  white-space: nowrap;
}
.mcb-movement-022a11.in b,
.mcb-small-row-022a11 b.in {
  color: var(--mcb-green);
}
.mcb-movement-022a11.out b,
.mcb-small-row-022a11 b.out {
  color: var(--mcb-red);
}
.mcb-form-panel-022a11 {
  background: #fff;
}
.mcb-form-panel-022a11.salary {
  background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(255,249,240,.96));
}
.mcb-form-022a11 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 13px;
}
.mcb-form-022a11 label {
  display: grid;
  gap: 8px;
  color: var(--mcb-ink);
  font-weight: 900;
}
.mcb-form-022a11 .span-2 {
  grid-column: span 2;
}
.mcb-form-022a11 input,
.mcb-form-022a11 select,
.mcb-form-022a11 textarea {
  width: 100%;
  min-height: 46px;
  border-radius: 14px;
}
.mcb-form-022a11 textarea {
  min-height: 90px;
  resize: vertical;
}
.mcb-actions-022a11 {
  display: flex !important;
  justify-content: flex-end;
  align-items: center;
  gap: 10px !important;
}
.mcb-actions-022a11 span {
  color: var(--mcb-green);
  font-weight: 900;
}
.mcb-empty-022a11 {
  padding: 18px;
  border-radius: 18px;
  background: rgba(246,248,255,.82);
  color: var(--mcb-muted);
  text-align: center;
  border: 1px dashed var(--mcb-line);
}
@media (max-width: 1120px) {
  .mcb-grid-022a11,
  .mcb-kpis-022a11 {
    grid-template-columns: 1fr;
  }
  .mcb-wide-022a11 {
    grid-row: auto;
  }
}
@media (max-width: 760px) {
  .mcb-hero-022a11,
  .mcb-toolbar-022a11 {
    flex-direction: column;
    align-items: stretch;
  }
  .mcb-toolbar-022a11 label,
  .mcb-balance-box-022a11 {
    min-width: 0;
  }
  .mcb-form-022a11 {
    grid-template-columns: 1fr;
  }
  .mcb-form-022a11 .span-2 {
    grid-column: auto;
  }
  .mcb-movement-022a11,
  .mcb-small-row-022a11 {
    align-items: stretch;
  }
}
/* 0.22A.11_MAIN_CASHBOX_SALARIES_EXPENSES_CSS_END */

/* 0.22A.12_GLOBAL_I18N_RTL_LTR_CSS_START */
.global-language-toggle-022a12 {
  min-width: 86px;
  height: 44px;
  border-radius: 14px;
  padding: 6px 10px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: var(--brand-soft);
  color: var(--brand);
  border: 1px solid var(--border);
  box-shadow: none;
}
.global-language-toggle-022a12:hover {
  background: #dfe6ff;
}
.global-language-toggle-022a12 span {
  font-size: 17px;
}
.global-language-toggle-022a12 strong {
  font-size: 13px;
  font-weight: 1000;
}
.global-language-toggle-022a12 small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}
html[dir="ltr"] body {
  direction: ltr;
  text-align: left;
}
html[dir="ltr"] .app-shell {
  direction: ltr;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  grid-template-areas: "sidebar main";
}
html[dir="ltr"] .sidebar {
  direction: ltr;
  box-shadow: 14px 0 45px rgba(30,48,125,.14);
}
html[dir="ltr"] .sidebar-brand,
html[dir="ltr"] .nav-item,
html[dir="ltr"] .sidebar-utility,
html[dir="ltr"] .profile-chip,
html[dir="ltr"] .topbar-actions,
html[dir="ltr"] .global-search,
html[dir="ltr"] .panel-head,
html[dir="ltr"] .row-actions,
html[dir="ltr"] .dtw-form-actions-022a8,
html[dir="ltr"] .ptw-patient-identity-022a10,
html[dir="ltr"] .ptw-tags-022a10,
html[dir="ltr"] .mcb-toolbar-022a11,
html[dir="ltr"] .mcb-actions-022a11 {
  direction: ltr;
  text-align: left;
}
html[dir="ltr"] .main-content,
html[dir="ltr"] .topbar,
html[dir="ltr"] .app-content,
html[dir="ltr"] .panel,
html[dir="ltr"] .premium-treatment-workspace-022a10,
html[dir="ltr"] .main-cashbox-workspace-022a11,
html[dir="ltr"] dialog,
html[dir="ltr"] form,
html[dir="ltr"] label {
  direction: ltr;
  text-align: left;
}
html[dir="ltr"] .nav-item {
  text-align: left;
}
html[dir="ltr"] .nav-item:hover {
  transform: translateX(2px);
}
html[dir="ltr"] .sidebar-utility .switch {
  margin-inline-start: auto;
}
html[dir="ltr"] .sidebar-utility .switch::after {
  right: auto;
  left: 3px;
}
html[dir="ltr"] .sidebar-utility[aria-pressed="true"] .switch::after {
  right: auto;
  left: 18px;
}
html[dir="ltr"] th,
html[dir="ltr"] td {
  text-align: left;
}
html[dir="ltr"] input,
html[dir="ltr"] select,
html[dir="ltr"] textarea {
  direction: ltr;
  text-align: left;
}
html[dir="ltr"] input[type="number"],
html[dir="ltr"] input[type="tel"],
html[dir="ltr"] input[type="email"],
html[dir="ltr"] input[type="month"],
html[dir="ltr"] input[type="date"],
html[dir="ltr"] input[type="time"] {
  direction: ltr;
}
html[dir="ltr"] .notification-count {
  left: auto;
  right: -5px;
}
html[dir="ltr"] .app-footer span + span::before {
  margin-inline-end: 7px;
  margin-inline-start: 0;
}
html[dir="ltr"] .ptw-hero-022a10,
html[dir="ltr"] .mcb-hero-022a11,
html[dir="ltr"] .ptw-section-title-022a10,
html[dir="ltr"] .mcb-movement-022a11,
html[dir="ltr"] .mcb-small-row-022a11,
html[dir="ltr"] .ptw-record-022a10,
html[dir="ltr"] .ptw-invoice-022a10,
html[dir="ltr"] .ptw-info-022a10,
html[dir="ltr"] .ptw-alert-022a10 {
  direction: ltr;
  text-align: left;
}
html[dir="ltr"] .premium-treatment-workspace-022a10 .doctor-treatment-workspace-022a8,
html[dir="ltr"] .doctor-treatment-workspace-022a8 {
  direction: ltr;
}
html[dir="ltr"] .main-cashbox-workspace-022a11 .mcb-form-022a11 {
  direction: ltr;
}
html[dir="ltr"] .staff-modal-021a,
html[dir="ltr"] .staff-toast-021a {
  direction: ltr;
  text-align: left;
}
html[dir="ltr"] .topbar {
  grid-template-columns: minmax(260px,1fr) minmax(280px,410px) auto;
}
html[dir="rtl"] .global-language-toggle-022a12 {
  direction: rtl;
}
html[dir="ltr"] .global-language-toggle-022a12 {
  direction: ltr;
}
@media (max-width: 1060px) {
  html[dir="ltr"] .app-shell,
  html[dir="rtl"] .app-shell {
    grid-template-columns: 1fr;
    grid-template-areas: "main";
  }
  html[dir="ltr"] .sidebar {
    right: auto;
    left: 0;
    transform: translateX(-105%);
  }
  html[dir="ltr"] body.sidebar-open .sidebar {
    transform: translateX(0);
  }
}
/* 0.22A.12_GLOBAL_I18N_RTL_LTR_CSS_END */

/* 0.22A.12.2_I18N_LOADING_STABILITY_CSS_START */
html[dir="ltr"] .global-language-toggle-022a12 {
  direction: ltr;
}
html[dir="rtl"] .global-language-toggle-022a12 {
  direction: rtl;
}
html[dir="ltr"] .loading,
html[dir="ltr"] .empty-block,
html[dir="ltr"] .error-state {
  direction: ltr;
  text-align: left;
}
html[dir="rtl"] .loading,
html[dir="rtl"] .empty-block,
html[dir="rtl"] .error-state {
  direction: rtl;
  text-align: right;
}
/* 0.22A.12.2_I18N_LOADING_STABILITY_CSS_END */

/* 0.22A.12.3_DOCTOR_DASHBOARD_I18N_CSS_START */
html[dir="ltr"] .professional-doctor-dashboard-022a6,
html[dir="ltr"] .doctor-dashboard-queue-022a7,
html[dir="ltr"] .pdd-hero-022a6,
html[dir="ltr"] .dwq-hero-022a7,
html[dir="ltr"] .pdd-kpi-022a6,
html[dir="ltr"] .dwq-kpi-022a7,
html[dir="ltr"] .dwq-panel-022a7,
html[dir="ltr"] .pdd-row-022a6,
html[dir="ltr"] .dwq-row-022a7,
html[dir="ltr"] .pdd-patient-022a6,
html[dir="ltr"] .dwq-patient-022a7 {
  direction: ltr;
  text-align: left;
}
html[dir="ltr"] .professional-doctor-dashboard-022a6 .panel-head,
html[dir="ltr"] .doctor-dashboard-queue-022a7 .panel-head,
html[dir="ltr"] .dwq-actions-022a7,
html[dir="ltr"] .pdd-actions-022a6 {
  direction: ltr;
  text-align: left;
}
/* 0.22A.12.3_DOCTOR_DASHBOARD_I18N_CSS_END */

/* 0.22A.12.4_DYNAMIC_CLINICAL_UI_POLISH_CSS_START */
html[dir="ltr"] .pdd-list-022a6,
html[dir="ltr"] .pdd-list-item-022a6,
html[dir="ltr"] .pdd-panel-022a6,
html[dir="ltr"] .pdd-panel-022a6 .panel-head,
html[dir="ltr"] .pdd-panel-022a6 h2,
html[dir="ltr"] .pdd-panel-022a6 p {
  direction: ltr;
  text-align: left;
}
html[dir="ltr"] .pdd-list-item-022a6 strong,
html[dir="ltr"] .pdd-list-item-022a6 small {
  direction: ltr;
  text-align: left;
}
html[dir="rtl"] .pdd-list-022a6,
html[dir="rtl"] .pdd-list-item-022a6,
html[dir="rtl"] .pdd-panel-022a6,
html[dir="rtl"] .pdd-panel-022a6 .panel-head,
html[dir="rtl"] .pdd-panel-022a6 h2,
html[dir="rtl"] .pdd-panel-022a6 p {
  direction: rtl;
  text-align: right;
}
/* 0.22A.12.4_DYNAMIC_CLINICAL_UI_POLISH_CSS_END */

/* 0.22A.12.5_NAME_TRANSLITERATION_CSS_START */
html[dir="ltr"] .doctor-dashboard-hero h1,
html[dir="ltr"] .doctor-dashboard-hero h2,
html[dir="ltr"] .ptw-patient-identity-022a10 h2,
html[dir="ltr"] .person-line strong,
html[dir="ltr"] .recent-patient-row strong {
  unicode-bidi: plaintext;
}
/* 0.22A.12.5_NAME_TRANSLITERATION_CSS_END */

/* 0.22A.13_DOCTOR_WAITING_QUEUE_SAFE_DELETE_CSS_START */
.dwq-delete-022a13 {
  border: 0;
  border-radius: 12px;
  padding: 9px 12px;
  font-weight: 900;
  cursor: pointer;
  background: linear-gradient(135deg, #b42318, #dc3b30);
  color: #fff;
  box-shadow: 0 10px 22px rgba(180, 35, 24, .16);
}
.dwq-delete-022a13:hover {
  filter: brightness(.98);
  transform: translateY(-1px);
}
.dwq-delete-022a13:disabled {
  opacity: .55;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}
html[dir="ltr"] .dwq-delete-022a13,
html[dir="rtl"] .dwq-delete-022a13 {
  min-width: 64px;
}
/* 0.22A.13_DOCTOR_WAITING_QUEUE_SAFE_DELETE_CSS_END */

/* 0.22A.14_DENTAL_CHAIRS_CREATE_FLOW_CSS_START */
.chair-board-panel-022a14 .panel-head {
  align-items: flex-start;
  gap: 12px;
}
.chair-create-022a14 {
  white-space: nowrap;
  min-width: 112px;
}
.chair-create-form-022a14 input,
.chair-create-form-022a14 select {
  width: 100%;
}
.chair-create-help-022a14 {
  margin: 10px 0 0;
  color: var(--muted);
  font-weight: 700;
  line-height: 1.8;
}
html[dir="ltr"] .chair-create-help-022a14 {
  text-align: left;
}
@media (max-width: 720px) {
  .chair-board-panel-022a14 .panel-head {
    align-items: stretch;
  }
  .chair-create-022a14 {
    width: 100%;
  }
}
/* 0.22A.14_DENTAL_CHAIRS_CREATE_FLOW_CSS_END */

/* 0.22A.14.1_RECEPTION_DIRECT_WAITING_NO_CHAIR_CSS_START */
.reception-grid .panel,
.appointments-workspace .view-grid.two > .panel {
  border-radius: 24px;
}
.reception-grid .table-wrap table,
.appointments-workspace .view-grid.two .table-wrap table {
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
}
.reception-grid thead th,
.appointments-workspace .view-grid.two thead th {
  white-space: nowrap;
  color: #667297;
  font-weight: 900;
  background: linear-gradient(180deg, #fbfcff, #f7f9ff);
}
.reception-direct-row-022a141 td {
  vertical-align: middle;
}
.reception-direct-actions-022a141 {
  justify-content: center;
  gap: 8px;
}
.primary-direct-wait-022a141 {
  min-width: 150px;
  min-height: 38px;
  border-radius: 12px;
  font-weight: 900;
  box-shadow: 0 10px 22px rgba(47, 92, 246, .16);
}
html[dir="ltr"] .primary-direct-wait-022a141 {
  min-width: 170px;
}
@media (max-width: 900px) {
  .primary-direct-wait-022a141 {
    min-width: 128px;
    padding-inline: 10px;
  }
  .reception-grid .table-wrap {
    overflow-x: auto;
  }
}
/* 0.22A.14.1_RECEPTION_DIRECT_WAITING_NO_CHAIR_CSS_END */

/* 0.22A.16_PATIENT_PREVIOUS_BALANCE_CARRY_FORWARD_CSS_START */
.dtw-previous-balance-022a16,
.dtw-total-due-022a16 {
  background: linear-gradient(180deg, rgba(243,247,255,.96), rgba(255,255,255,.98));
}
.dtw-previous-balance-022a16 input,
.dtw-total-due-022a16 input {
  font-weight: 950;
}
.dtw-previous-balance-022a16 input {
  color: #b45309;
  background: #fff8eb;
  border-color: rgba(180,83,9,.20);
}
.dtw-total-due-022a16 input {
  color: #1d4ed8;
  background: #eef4ff;
  border-color: rgba(29,78,216,.20);
}
.dtw-carry-forward-summary-022a16 {
  border: 1px solid rgba(29,78,216,.18);
  background: linear-gradient(135deg, rgba(238,244,255,.96), rgba(236,253,245,.92));
  color: #0f2a5f;
  font-weight: 900;
  line-height: 1.9;
}
.dtw-carry-forward-summary-022a16.invalid {
  background: linear-gradient(135deg, rgba(255,241,242,.96), rgba(255,247,237,.92));
  border-color: rgba(220,38,38,.24);
  color: #991b1b;
}
html[dir="ltr"] .dtw-carry-forward-summary-022a16 {
  direction: ltr;
  text-align: left;
}
/* 0.22A.16_PATIENT_PREVIOUS_BALANCE_CARRY_FORWARD_CSS_END */

/* 0.22A.16.2_PREVIOUS_BALANCE_DISPLAY_FIX_CSS_START */
.dtw-previous-balance-022a16 input:not([value="0 د.ع"]),
.dtw-total-due-022a16 input:not([value="0 د.ع"]) {
  letter-spacing: .01em;
}
.dtw-carry-forward-summary-022a16 {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: center;
}
/* 0.22A.16.2_PREVIOUS_BALANCE_DISPLAY_FIX_CSS_END */

/* 0.22A.17_TREATMENT_PROCEDURE_CATALOG_CREATE_PAGE_CSS_START */
.tpc-procedure-label-022a17 {
  position: relative;
  display: grid !important;
  gap: 8px;
}
.tpc-open-create-022a17 {
  min-height: 38px;
  border-radius: 12px;
  border: 1px solid rgba(47, 92, 246, .18);
  background: linear-gradient(135deg, #eef4ff, #ffffff);
  color: #2448d8;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(47,92,246,.10);
}
.tpc-open-create-022a17:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 26px rgba(47,92,246,.16);
}
.tpc-overlay-022a17 {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(10, 18, 40, .44);
  backdrop-filter: blur(10px);
}
.tpc-page-022a17 {
  width: min(760px, 100%);
  max-height: min(86vh, 760px);
  overflow: auto;
  border-radius: 30px;
  background:
    radial-gradient(circle at 8% 8%, rgba(47,92,246,.12), transparent 30%),
    linear-gradient(180deg, #ffffff, #f8fbff);
  border: 1px solid rgba(120, 142, 199, .22);
  box-shadow: 0 30px 80px rgba(9, 18, 46, .28);
  padding: 24px;
}
.tpc-head-022a17 {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(91,111,168,.16);
  margin-bottom: 18px;
}
.tpc-head-022a17 small {
  color: #315cf6;
  font-weight: 900;
}
.tpc-head-022a17 h2 {
  margin: 5px 0 7px;
  color: #111b35;
  font-size: clamp(24px, 3vw, 34px);
}
.tpc-head-022a17 p {
  margin: 0;
  color: #65718f;
  line-height: 1.8;
}
.tpc-close-022a17 {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(91,111,168,.16);
  background: #fff;
  color: #111b35;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}
.tpc-form-022a17 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.tpc-form-022a17 label,
.tpc-note-022a17 {
  display: grid;
  gap: 8px;
  padding: 14px;
  border-radius: 20px;
  border: 1px solid rgba(91,111,168,.14);
  background: rgba(255,255,255,.88);
  color: #152345;
  font-weight: 900;
}
.tpc-form-022a17 .span-2,
.tpc-note-022a17,
.tpc-actions-022a17 {
  grid-column: 1 / -1;
}
.tpc-form-022a17 input {
  min-height: 48px;
  border-radius: 14px;
  border: 1px solid rgba(91,111,168,.22);
  padding: 10px 12px;
  font-weight: 900;
  outline: none;
}
.tpc-form-022a17 input:focus {
  border-color: rgba(47,92,246,.55);
  box-shadow: 0 0 0 4px rgba(47,92,246,.10);
}
.tpc-note-022a17 {
  color: #476085;
  background: linear-gradient(135deg, rgba(238,244,255,.95), rgba(236,253,245,.90));
  line-height: 1.8;
}
.tpc-actions-022a17 {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: flex-end;
}
.tpc-actions-022a17 button {
  min-height: 44px;
  border-radius: 14px;
}
#tpc-status-022a17 {
  font-weight: 900;
}
#tpc-status-022a17.success {
  color: #059669;
}
#tpc-status-022a17.error {
  color: #dc2626;
}
@media (max-width: 720px) {
  .tpc-overlay-022a17 {
    padding: 12px;
  }
  .tpc-page-022a17 {
    border-radius: 22px;
    padding: 16px;
  }
  .tpc-head-022a17 {
    flex-direction: column;
  }
  .tpc-form-022a17 {
    grid-template-columns: 1fr;
  }
  .tpc-form-022a17 .span-2,
  .tpc-note-022a17,
  .tpc-actions-022a17 {
    grid-column: auto;
  }
  .tpc-actions-022a17 {
    flex-direction: column-reverse;
    align-items: stretch;
  }
}
/* 0.22A.17_TREATMENT_PROCEDURE_CATALOG_CREATE_PAGE_CSS_END */

/* 0.22A.17.1_DOCTOR_PROCEDURE_CATALOG_PERMISSION_FIX_CSS_START */
.tpc-note-022a17::after {
  content: " الصلاحية هنا محدودة لإضافة إجراء علاجي فقط ولا تفتح إدارة الخدمات العامة.";
  color: #315cf6;
  font-weight: 900;
}
/* 0.22A.17.1_DOCTOR_PROCEDURE_CATALOG_PERMISSION_FIX_CSS_END */

/* 0.22A.18_DOCTOR_WAITING_QUEUE_STABLE_ACTIONS_CSS_START */
.dwq-open-treatment-022a18 {
  background: linear-gradient(135deg, #0f8b5f, #27b780) !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(15, 139, 95, .18);
}
.dwq-stable-enter-022a18 {
  box-shadow: 0 12px 24px rgba(45, 75, 210, .18);
}
.dwq-action-toast-022a18 {
  position: fixed;
  z-index: 10050;
  left: 22px;
  bottom: 22px;
  max-width: min(460px, calc(100vw - 44px));
  padding: 14px 18px;
  border-radius: 18px;
  background: #065f46;
  color: #fff;
  box-shadow: 0 22px 48px rgba(15, 23, 42, .22);
  opacity: 0;
  transform: translateY(12px);
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
  direction: rtl;
  font-weight: 900;
}
.dwq-action-toast-022a18.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.dwq-action-toast-022a18.is-error {
  background: #991b1b;
}
.dwq-queue-row-022a7.in_treatment .dwq-open-treatment-022a18 {
  min-width: 128px;
}
@media (max-width: 720px) {
  .dwq-action-toast-022a18 {
    left: 12px;
    right: 12px;
    bottom: 12px;
    max-width: none;
  }
}
/* 0.22A.18_DOCTOR_WAITING_QUEUE_STABLE_ACTIONS_CSS_END */

/* 0.22A.18.1_DOCTOR_WAITING_QUEUE_DIRECT_CLICK_FALLBACK_CSS_START */
.dwq-direct-bound-022a181 {
  pointer-events: auto !important;
  cursor: pointer !important;
}
.dwq-queue-row-022a7.in_treatment .dwq-delete-022a13.dwq-direct-bound-022a181 {
  opacity: 1 !important;
  filter: none !important;
}
.dwq-queue-row-022a7.in_treatment .dwq-open-treatment-022a18,
.dwq-queue-row-022a7.in_treatment [data-dwq-open-treatment-022a181] {
  background: linear-gradient(135deg, #059669, #10b981) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 14px 28px rgba(5, 150, 105, .2) !important;
}
.dwq-direct-bound-022a181[disabled] {
  opacity: .7;
  cursor: wait !important;
}
/* 0.22A.18.1_DOCTOR_WAITING_QUEUE_DIRECT_CLICK_FALLBACK_CSS_END */

/* 0.22A.18.1.1_DOCTOR_DASHBOARD_LOADING_RECOVERY_CSS_START */
.dwq-open-treatment-022a18 {
  pointer-events: auto !important;
}
.dwq-action-toast-022a18 {
  pointer-events: none !important;
}
/* 0.22A.18.1.1_DOCTOR_DASHBOARD_LOADING_RECOVERY_CSS_END */

/* 0.22A.18.2_DOCTOR_WAITING_QUEUE_INLINE_ACTIONS_CSS_START */
.dwq-inline-action-022a182 { pointer-events: auto !important; position: relative; z-index: 3; }
.dwq-queue-row-022a7.in_treatment [data-dwq-inline-open-022a182] { background: linear-gradient(135deg, #059669, #10b981) !important; color: #fff !important; border-color: transparent !important; box-shadow: 0 16px 30px rgba(5,150,105,.22) !important; }
.dwq-queue-row-022a7.in_treatment [data-dwq-inline-delete-022a182] { opacity: 1 !important; filter: none !important; }
.dwq-inline-action-022a182[disabled] { opacity: .58 !important; cursor: not-allowed !important; }
/* 0.22A.18.2_DOCTOR_WAITING_QUEUE_INLINE_ACTIONS_CSS_END */

/* 0.22A.18.3_DOCTOR_WAITING_QUEUE_CSP_SAFE_ACTIONS_CSS_START */
.dwq-inline-action-022a182 {
  pointer-events: auto !important;
}
/* 0.22A.18.3_DOCTOR_WAITING_QUEUE_CSP_SAFE_ACTIONS_CSS_END */


/* 0.22A.20.1_HEALTH360_DOCTOR_DASHBOARD_DATA_COMPLETE_REFERENCE_CSS_START */
body.h360-clean-dashboard-shell-022a200 { --sidebar-width: 268px; background: #f6f9fd; }
body.h360-clean-dashboard-shell-022a200 .app-shell { grid-template-columns: minmax(0,1fr) 268px; }
body.h360-clean-dashboard-shell-022a200 .sidebar { width: 268px; padding: 27px 18px 20px; gap: 18px; background: linear-gradient(180deg,#076482 0%,#075c79 52%,#06445f 100%); box-shadow: -12px 0 36px rgba(1,54,77,.15); scrollbar-width: thin; }
body.h360-clean-dashboard-shell-022a200 .sidebar-brand { padding: 2px 7px 14px; gap: 12px; }
body.h360-clean-dashboard-shell-022a200 .sidebar-brand .tooth-logo { width: 56px; height: 56px; border-radius: 17px; background: rgba(255,255,255,.12); color:#fff; }
body.h360-clean-dashboard-shell-022a200 .sidebar-brand .tooth-logo svg { width:43px; height:43px; }
body.h360-clean-dashboard-shell-022a200 .sidebar-brand strong { font-size:22px; letter-spacing:-.025em; white-space:nowrap; }
body.h360-clean-dashboard-shell-022a200 .sidebar-brand strong b { color:#28c8c8; font-weight:800; }
body.h360-clean-dashboard-shell-022a200 .sidebar-brand small { color:rgba(255,255,255,.82); font-size:12px; margin-top:3px; }
body.h360-clean-dashboard-shell-022a200 .sidebar-nav { gap:5px; }
body.h360-clean-dashboard-shell-022a200 .nav-item { min-height:48px; padding:10px 14px; border-radius:12px; gap:13px; }
body.h360-clean-dashboard-shell-022a200 .nav-item svg { width:22px; height:22px; }
body.h360-clean-dashboard-shell-022a200 .nav-item span { font-size:14px; font-weight:700; }
body.h360-clean-dashboard-shell-022a200 .nav-item.active { background:linear-gradient(100deg,rgba(89,176,214,.58),rgba(76,156,193,.45)); box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 10px 24px rgba(0,43,62,.18); }
body.h360-clean-dashboard-shell-022a200 .nav-item:not([data-view="dashboard"]):not([data-view="appointments"]):not([data-view="patients"]):not([data-view="treatmentPlans"]):not([data-view="finance"]):not([data-view="inventory"]):not([data-view="reports"]):not([data-view="communications"]):not([data-view="settings"]) { display:none!important; }
body.h360-clean-dashboard-shell-022a200 #h360-sidebar-promo-022a200 { display:grid; }
#h360-sidebar-promo-022a200 { display:none; min-height:210px; margin-top:auto; padding:22px 16px 18px; border-radius:18px; place-items:center; text-align:center; color:#fff; background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.055)); border:1px solid rgba(255,255,255,.08); overflow:hidden; position:relative; }
#h360-sidebar-promo-022a200::before { content:""; position:absolute; width:130px; height:130px; top:8px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.25),rgba(255,255,255,0) 68%); filter:blur(8px); }
#h360-sidebar-promo-022a200 .h360-promo-tooth-022a200 { width:84px; height:84px; color:#f9feff; filter:drop-shadow(0 12px 18px rgba(0,38,56,.22)); z-index:1; }
#h360-sidebar-promo-022a200 strong { font-size:15px; margin-top:-4px; z-index:1; }
#h360-sidebar-promo-022a200 small { color:rgba(255,255,255,.76); font-size:11px; line-height:1.6; z-index:1; }
#h360-sidebar-promo-022a200 button { width:100%; min-height:38px; padding:8px 12px; background:transparent; border:1px solid rgba(255,255,255,.18); font-size:12px; z-index:1; }
body.h360-clean-dashboard-shell-022a200 .sidebar-footer { margin-top:0; gap:6px; padding-top:0; }
body.h360-clean-dashboard-shell-022a200 .sidebar-utility { min-height:45px; border-radius:11px; font-size:13px; }
body.h360-clean-dashboard-shell-022a200 .main-content { padding:14px 16px 0; background:radial-gradient(circle at 18% 4%,rgba(58,184,205,.075),transparent 28%),#f6f9fd; }
body.h360-clean-dashboard-shell-022a200 .topbar { min-height:86px; margin-bottom:14px; padding:14px 20px; border-radius:18px; grid-template-columns:minmax(280px,1fr) minmax(340px,430px) auto; gap:18px; background:rgba(255,255,255,.97); border-color:#e3ebf4; box-shadow:0 10px 28px rgba(15,65,95,.055); }
body.h360-clean-dashboard-shell-022a200 .welcome-block h1 { font-size:23px; line-height:1.15; color:#111b34; }
body.h360-clean-dashboard-shell-022a200 .welcome-block p { margin-top:5px; font-size:12.5px; color:#7a88a3; }
body.h360-clean-dashboard-shell-022a200 .global-search { height:44px; border-radius:11px; background:#f8fbfe; }
body.h360-clean-dashboard-shell-022a200 .topbar-actions { gap:10px; }
body.h360-clean-dashboard-shell-022a200 .icon-button { width:40px; height:40px; border-radius:11px; }
body.h360-clean-dashboard-shell-022a200 .profile-chip { min-width:160px; }
body.h360-clean-dashboard-shell-022a200 .profile-avatar { width:39px; height:39px; }
body.h360-clean-dashboard-shell-022a200 .app-footer { display:none; }

.h360x-page-022a200 { --h360-ink:#17213a; --h360-muted:#7b8aa4; --h360-border:#e2eaf3; --h360-card:#fff; color:var(--h360-ink); display:grid; gap:14px; padding-bottom:18px; }
.h360x-page-022a200 * { box-sizing:border-box; }
.h360x-page-022a200 button { font-family:inherit; }
.h360x-kpis-022a200 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.h360x-kpi-022a200 { min-width:0; min-height:150px; padding:18px 18px 13px; border:1px solid var(--h360-border); border-radius:16px; background:rgba(255,255,255,.99); box-shadow:0 8px 24px rgba(22,65,95,.048); display:grid; grid-template-columns:minmax(0,1fr) 54px; grid-template-rows:1fr 38px; gap:9px 12px; overflow:hidden; position:relative; }
.h360x-kpi-icon-022a200 { grid-column:2; grid-row:1; width:54px; height:54px; border-radius:14px; display:grid; place-items:center; align-self:start; }
.h360x-kpi-icon-022a200 svg { width:27px; height:27px; stroke-width:1.8; }
.h360x-kpi-copy-022a200 { min-width:0; display:grid; align-content:start; gap:4px; }
.h360x-kpi-copy-022a200 > span:first-child { color:#53617a; font-size:13px; font-weight:750; }
.h360x-kpi-copy-022a200 strong { color:#111827; font-size:clamp(25px,2vw,31px); line-height:1.05; letter-spacing:-.02em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.h360x-kpi-copy-022a200 small { color:var(--h360-muted); font-size:10.6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.h360x-kpi-trend-022a201 { font-size:9px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.h360x-kpi-trend-022a201.is-up { color:#18a66f; }.h360x-kpi-trend-022a201.is-down { color:#df5a61; }.h360x-kpi-trend-022a201.is-flat { color:#8390a4; }
.h360x-kpi-progress-022a200 { grid-column:1/-1; height:38px; overflow:hidden; }
.h360x-kpi-spark-022a201 { width:100%; height:38px; overflow:visible; }
.h360x-kpi-spark-022a201 polyline { fill:none; stroke-width:2; vector-effect:non-scaling-stroke; }
.h360x-kpi-spark-022a201 polygon { opacity:.18; }
.h360x-kpi-spark-022a201.tone-blue polyline { stroke:#3186f6; }.h360x-kpi-spark-022a201.tone-blue polygon { fill:#3186f6; }
.h360x-kpi-spark-022a201.tone-green polyline { stroke:#19b67b; }.h360x-kpi-spark-022a201.tone-green polygon { fill:#19b67b; }
.h360x-kpi-spark-022a201.tone-purple polyline { stroke:#9254f6; }.h360x-kpi-spark-022a201.tone-purple polygon { fill:#9254f6; }
.h360x-kpi-spark-022a201.tone-orange polyline { stroke:#fb941f; }.h360x-kpi-spark-022a201.tone-orange polygon { fill:#fb941f; }
.h360x-kpi-022a200.tone-blue .h360x-kpi-icon-022a200 { background:#ebf4ff; color:#2785f5; }
.h360x-kpi-022a200.tone-green .h360x-kpi-icon-022a200 { background:#e9f9f3; color:#18b879; }
.h360x-kpi-022a200.tone-purple .h360x-kpi-icon-022a200 { background:#f3edff; color:#8d55f5; }
.h360x-kpi-022a200.tone-orange .h360x-kpi-icon-022a200 { background:#fff3e4; color:#fb941f; }

.h360x-grid-022a200 { display:grid; grid-template-columns:300px minmax(470px,1.14fr) minmax(365px,.98fr); grid-template-areas:"left center right"; gap:14px; align-items:start; direction:ltr; }
.h360x-column-022a200 { min-width:0; display:grid; gap:14px; direction:rtl; }
.h360x-left-022a200 { grid-area:left; }.h360x-center-022a200 { grid-area:center; }.h360x-right-022a200 { grid-area:right; }
.h360x-panel-022a200 { min-width:0; background:rgba(255,255,255,.99); border:1px solid var(--h360-border); border-radius:16px; padding:16px; box-shadow:0 8px 24px rgba(22,65,95,.045); overflow:hidden; }
.h360x-panel-022a200 > header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:12px; margin-bottom:10px; border-bottom:1px solid #edf2f7; }
.h360x-panel-022a200 > header h2 { margin:0; font-size:15.5px; line-height:1.25; color:#111b34; }
.h360x-panel-022a200 > header p { margin:4px 0 0; color:var(--h360-muted); font-size:10.8px; line-height:1.55; }
.h360x-header-icon-022a200 { width:35px; height:35px; border-radius:10px; display:grid; place-items:center; background:#eaf7fc; color:#1a8fc6; flex:0 0 auto; }
.h360x-header-icon-022a200 svg { width:18px; height:18px; }
.h360x-soft-pill-022a200 { display:inline-flex; align-items:center; min-height:31px; padding:6px 11px; border-radius:999px; background:#eaf8fd; color:#117da8; font-size:11px; font-weight:750; white-space:nowrap; }
.h360x-alerts-022a200 { min-height:302px; }
.h360x-alert-list-022a200 { display:grid; }
.h360x-alert-row-022a200 { width:100%; min-width:0; min-height:54px; padding:8px 2px; border-radius:0; background:transparent; color:inherit; display:grid; grid-template-columns:46px minmax(0,1fr) 32px; align-items:center; gap:8px; text-align:right; border-bottom:1px solid #edf2f7; }
.h360x-alert-row-022a200:hover { background:#f8fbfe; }
.h360x-alert-row-022a200 time { font-size:9.5px; color:#8090a8; text-align:left; direction:rtl; overflow:hidden; text-overflow:ellipsis; }
.h360x-alert-row-022a200 div { min-width:0; }
.h360x-alert-row-022a200 strong { display:block; font-size:11.5px; color:#263149; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.h360x-alert-row-022a200 small { display:block; margin-top:3px; color:#8794a9; font-size:9.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.h360x-alert-row-022a200 > span { width:30px; height:30px; border-radius:9px; display:grid; place-items:center; }
.h360x-alert-row-022a200 > span svg { width:16px; height:16px; }
.h360x-alert-row-022a200 .tone-blue { background:#eaf3ff; color:#2f84e9; }.h360x-alert-row-022a200 .tone-orange { background:#fff3e1; color:#f3991e; }.h360x-alert-row-022a200 .tone-green { background:#e8f8f1; color:#18a96f; }.h360x-alert-row-022a200 .tone-red { background:#fff0f0; color:#e0545f; }
.h360x-quick-022a200 { min-height:284px; }
.h360x-actions-022a200 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.h360x-action-card-022a200 { min-width:0; min-height:91px; padding:12px 10px; border:1px solid transparent; border-radius:14px; display:grid; place-items:center; align-content:center; gap:5px; color:#21324d; text-align:center; }
.h360x-action-card-022a200:hover { transform:translateY(-1px); box-shadow:0 8px 18px rgba(25,70,100,.08); }
.h360x-action-card-022a200 span { width:34px; height:34px; display:grid; place-items:center; }.h360x-action-card-022a200 svg { width:27px; height:27px; }
.h360x-action-card-022a200 strong { font-size:11px; }.h360x-action-card-022a200 small { color:#7c8aa1; font-size:8.8px; line-height:1.4; }
.h360x-action-card-022a200.tone-cyan { background:#edfafd; color:#1397b4; }.h360x-action-card-022a200.tone-blue { background:#eef5ff; color:#347fe4; }.h360x-action-card-022a200.tone-purple { background:#f5efff; color:#8a58ef; }.h360x-action-card-022a200.tone-green { background:#ecf9f4; color:#18a96f; }
.h360x-schedule-022a200 { min-height:365px; }
.h360x-calendar-toolbar-022a200 { min-height:39px; margin:2px 0 10px; padding:5px 8px; border:1px solid #e5edf5; border-radius:10px; display:grid; grid-template-columns:auto 1fr 28px; align-items:center; gap:9px; background:#fbfdff; }
.h360x-calendar-toolbar-022a200 button { min-height:29px; padding:5px 10px; border-radius:8px; background:#fff; color:#52627d; border:1px solid #e5edf5; font-size:10.5px; }
.h360x-calendar-toolbar-022a200 strong { text-align:center; font-size:11.5px; color:#263149; }.h360x-calendar-toolbar-022a200 span { color:#438ce7; }.h360x-calendar-toolbar-022a200 svg { width:17px; height:17px; }
.h360x-timeline-022a200 { display:grid; gap:7px; }
.h360x-timeline-row-022a200 { min-width:0; display:grid; grid-template-columns:56px minmax(0,1fr); gap:8px; align-items:center; }
.h360x-timeline-row-022a200 > time { color:#6d7c95; font-size:10px; direction:ltr; text-align:left; }
.h360x-timeline-card-022a200 { min-width:0; min-height:46px; padding:7px 9px; border-radius:9px; display:grid; grid-template-columns:7px minmax(0,1fr) auto; align-items:center; gap:8px; border:1px solid; background:#f8fbfe; }
.h360x-timeline-card-022a200 > div { min-width:0; }.h360x-timeline-card-022a200 strong { display:block; color:#26415d; font-size:10.8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.h360x-timeline-card-022a200 small { display:block; margin-top:2px; color:#7790a8; font-size:9px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.h360x-event-dot-022a200 { width:6px; height:6px; border-radius:50%; }
.h360x-timeline-row-022a200.tone-1 .h360x-timeline-card-022a200 { border-color:#9ee2c3; background:#f0fcf6; }.h360x-timeline-row-022a200.tone-1 .h360x-event-dot-022a200 { background:#22b876; }
.h360x-timeline-row-022a200.tone-2 .h360x-timeline-card-022a200 { border-color:#9ec5ff; background:#f2f7ff; }.h360x-timeline-row-022a200.tone-2 .h360x-event-dot-022a200 { background:#3186f6; }
.h360x-timeline-row-022a200.tone-3 .h360x-timeline-card-022a200 { border-color:#c9a8ff; background:#f8f3ff; }.h360x-timeline-row-022a200.tone-3 .h360x-event-dot-022a200 { background:#9254ff; }
.h360x-timeline-row-022a200.tone-4 .h360x-timeline-card-022a200 { border-color:#ffc673; background:#fff8ee; }.h360x-timeline-row-022a200.tone-4 .h360x-event-dot-022a200 { background:#ff9f1c; }
.h360x-add-wait-022a200 { min-height:27px; padding:4px 9px; border-radius:7px; background:#e9f1ff; color:#2f6fd8; font-size:9px; white-space:nowrap; }
.h360x-queue-pill-022a200,.h360x-state-022a200 { display:inline-flex; align-items:center; justify-content:center; min-height:24px; padding:4px 8px; border-radius:999px; background:#e8f8f1; color:#13835a; font-size:8.8px; font-weight:750; white-space:nowrap; }
.h360x-state-022a200.is-muted { background:#eef2f6; color:#758198; }.h360x-state-022a200.is-waiting { background:#eaf3ff; color:#2672d8; }.h360x-state-022a200.is-confirmed { background:#e8f8f1; color:#13835a; }
.h360x-performance-022a200 { min-height:302px; }
.h360x-chart-legend-022a200 { display:flex; justify-content:center; gap:20px; margin:0 0 5px; color:#687991; font-size:10px; }.h360x-chart-legend-022a200 span { display:inline-flex; align-items:center; gap:6px; }.h360x-chart-legend-022a200 i { width:8px; height:8px; border-radius:50%; }.h360x-chart-legend-022a200 i.revenue { background:#24c4c7; }.h360x-chart-legend-022a200 i.paid { background:#3186f6; }
.h360x-chart-box-022a200 { min-height:210px; overflow:hidden; }.h360x-performance-svg-022a200 { width:100%; height:210px; overflow:visible; }
.h360x-axis-grid-022a201 line { stroke:#edf2f7; stroke-width:1; vector-effect:non-scaling-stroke; }.h360x-axis-grid-022a201 text { fill:#8190a6; font-size:9px; text-anchor:end; }.h360x-axis-grid-022a201 text.x-label { text-anchor:middle; }
.h360x-area-022a200 { fill:url(#h360RevenueFill022A201); }.h360x-line-022a200 { fill:none; stroke-width:2.3; vector-effect:non-scaling-stroke; }.h360x-line-022a200.revenue { stroke:#24c4c7; }.h360x-line-022a200.paid { stroke:#3186f6; }
.h360x-upcoming-022a200 { min-height:365px; }.h360x-upcoming-list-022a200 { display:grid; }
.h360x-upcoming-row-022a200 { min-width:0; min-height:55px; padding:8px 0; border-bottom:1px solid #edf2f7; display:grid; grid-template-columns:34px minmax(0,1fr) 48px auto; grid-template-areas:"avatar person time state" "avatar actions actions actions"; align-items:center; gap:5px 8px; }
.h360x-avatar-022a200 { grid-area:avatar; width:31px; height:31px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(145deg,#eaf2ff,#d8e6fb); color:#2e61a8; font-size:10px; font-weight:850; border:2px solid #fff; box-shadow:0 0 0 1px #dfe8f2; }
.h360x-person-022a200 { grid-area:person; min-width:0; }.h360x-person-022a200 strong { display:block; font-size:10.8px; color:#23314a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.h360x-person-022a200 small { display:block; margin-top:2px; color:#8190a7; font-size:9px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.h360x-upcoming-row-022a200 > time { grid-area:time; color:#43546e; font-size:9px; direction:ltr; text-align:center; white-space:nowrap; }.h360x-upcoming-row-022a200 > .h360x-state-022a200 { grid-area:state; }
.h360x-upcoming-actions-022a200 { grid-area:actions; display:flex; gap:5px; justify-content:flex-start; opacity:.94; }.h360x-row-primary-022a200 { min-height:25px; padding:4px 9px; border-radius:7px; background:#19b57b; color:#fff; font-size:8.7px; }.h360x-row-delete-022a200 { width:25px; height:25px; padding:0; border-radius:7px; background:#fff0f0; color:#d94b54; font-size:15px; }
.h360x-patients-022a200 { min-height:252px; }.h360x-patient-list-022a200 { display:grid; }
.h360x-patient-row-022a200 { width:100%; min-width:0; min-height:41px; padding:6px 0; border-radius:0; background:transparent; color:inherit; display:grid; grid-template-columns:30px minmax(0,1fr) 92px 76px; align-items:center; gap:8px; text-align:right; border-bottom:1px solid #edf2f7; }
.h360x-patient-row-022a200:hover { background:#f8fbfe; }.h360x-patient-row-022a200 .h360x-avatar-022a200 { width:27px; height:27px; font-size:8px; }.h360x-patient-row-022a200 strong { font-size:10.3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.h360x-patient-row-022a200 small,.h360x-patient-row-022a200 time { color:#78879d; font-size:8.8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.h360x-footer-link-022a200 { width:100%; min-height:30px; margin-top:8px; padding:5px 8px; background:transparent; color:#2678df; font-size:10px; text-align:center; }.h360x-footer-link-022a200:hover { background:#f5f9ff; color:#175eb7; }
.h360x-empty-022a200 { min-height:110px; display:grid; place-items:center; color:#8a97aa; font-size:11px; text-align:center; }.h360x-empty-022a200.compact { min-height:70px; }
@media (max-width:1420px) { body.h360-clean-dashboard-shell-022a200 { --sidebar-width:248px; } body.h360-clean-dashboard-shell-022a200 .app-shell { grid-template-columns:minmax(0,1fr) 248px; } body.h360-clean-dashboard-shell-022a200 .sidebar { width:248px; padding-inline:14px; } .h360x-grid-022a200 { grid-template-columns:270px minmax(420px,1.12fr) minmax(330px,.95fr); gap:12px; } .h360x-kpis-022a200 { gap:10px; } }
@media (max-width:1180px) { .h360x-grid-022a200 { grid-template-columns:1fr 1fr; grid-template-areas:"center center" "left right"; } .h360x-kpis-022a200 { grid-template-columns:repeat(2,minmax(0,1fr)); } #h360-sidebar-promo-022a200 { display:none!important; } }
@media (max-width:920px) { body.h360-clean-dashboard-shell-022a200 .app-shell { display:block; } body.h360-clean-dashboard-shell-022a200 .sidebar { width:min(86vw,300px); } body.h360-clean-dashboard-shell-022a200 .main-content { padding:10px; } body.h360-clean-dashboard-shell-022a200 .topbar { grid-template-columns:auto minmax(0,1fr) auto; min-height:72px; padding:10px 12px; gap:8px; } body.h360-clean-dashboard-shell-022a200 .welcome-block { display:none; } body.h360-clean-dashboard-shell-022a200 .global-search { grid-column:2; min-width:0; } body.h360-clean-dashboard-shell-022a200 .topbar-actions { grid-column:3; } body.h360-clean-dashboard-shell-022a200 .profile-chip { display:none; } .h360x-grid-022a200 { grid-template-columns:1fr; grid-template-areas:"center" "right" "left"; } }
@media (max-width:620px) { .h360x-kpis-022a200 { grid-template-columns:1fr; } .h360x-kpi-022a200 { min-height:138px; } .h360x-actions-022a200 { grid-template-columns:1fr 1fr; } .h360x-timeline-row-022a200 { grid-template-columns:46px minmax(0,1fr); } .h360x-timeline-card-022a200 { grid-template-columns:7px minmax(0,1fr); } .h360x-timeline-card-022a200 > :last-child { grid-column:2; justify-self:start; } .h360x-upcoming-row-022a200 { grid-template-columns:32px minmax(0,1fr) auto; grid-template-areas:"avatar person state" "avatar time time" "avatar actions actions"; } .h360x-patient-row-022a200 { grid-template-columns:30px minmax(0,1fr) 72px; } .h360x-patient-row-022a200 time { display:none; } }
:root[data-theme="dark"] body.h360-clean-dashboard-shell-022a200,:root[data-theme="dark"] body.h360-clean-dashboard-shell-022a200 .main-content { background:#101827; }
:root[data-theme="dark"] .h360x-kpi-022a200,:root[data-theme="dark"] .h360x-panel-022a200 { background:#172235; border-color:#2c3a50; }
:root[data-theme="dark"] .h360x-page-022a200 { --h360-ink:#eff5ff; --h360-muted:#a2b1c7; --h360-border:#2b3b52; }
:root[data-theme="dark"] .h360x-kpi-copy-022a200 strong,:root[data-theme="dark"] .h360x-panel-022a200 > header h2,:root[data-theme="dark"] .h360x-person-022a200 strong,:root[data-theme="dark"] .h360x-patient-row-022a200 strong,:root[data-theme="dark"] .h360x-alert-row-022a200 strong { color:#eef5ff; }
/* 0.22A.20.1_HEALTH360_DOCTOR_DASHBOARD_DATA_COMPLETE_REFERENCE_CSS_END */

/* 0.22A.20.2_HEALTH360_DOCTOR_DASHBOARD_FINAL_VISUAL_FIT_CSS_START */
body.h360-clean-dashboard-shell-022a200 {
  --sidebar-width: 254px;
}
body.h360-clean-dashboard-shell-022a200 .app-shell {
  grid-template-columns: minmax(0, 1fr) 254px;
}
body.h360-clean-dashboard-shell-022a200 .main-content {
  padding: 12px 14px 0;
}
body.h360-clean-dashboard-shell-022a200 .topbar {
  min-height: 78px;
  margin-bottom: 12px;
  padding: 11px 18px;
  border-radius: 17px;
  grid-template-columns: minmax(250px, 1fr) minmax(300px, 430px) auto;
  gap: 14px;
}
body.h360-clean-dashboard-shell-022a200 .welcome-block h1 {
  font-size: 22px;
  line-height: 1.1;
}
body.h360-clean-dashboard-shell-022a200 .welcome-block p {
  margin-top: 4px;
  font-size: 11.5px;
}
body.h360-clean-dashboard-shell-022a200 .global-search {
  height: 40px;
  border-radius: 10px;
}
body.h360-clean-dashboard-shell-022a200 .icon-button {
  width: 38px;
  height: 38px;
  border-radius: 10px;
}
body.h360-clean-dashboard-shell-022a200 .profile-avatar {
  width: 37px;
  height: 37px;
}
body.h360-clean-dashboard-shell-022a200 .profile-chip {
  min-width: 146px;
}
body.h360-clean-dashboard-shell-022a200 .sidebar {
  width: 254px;
  padding: 22px 14px 16px;
  gap: 14px;
}
body.h360-clean-dashboard-shell-022a200 .sidebar-brand {
  padding: 0 5px 10px;
  gap: 10px;
}
body.h360-clean-dashboard-shell-022a200 .sidebar-brand .tooth-logo {
  width: 52px;
  height: 52px;
  border-radius: 16px;
}
body.h360-clean-dashboard-shell-022a200 .sidebar-brand .tooth-logo svg {
  width: 40px;
  height: 40px;
}
body.h360-clean-dashboard-shell-022a200 .sidebar-brand strong {
  font-size: 21px;
}
body.h360-clean-dashboard-shell-022a200 .sidebar-brand small {
  font-size: 11px;
  margin-top: 2px;
}
body.h360-clean-dashboard-shell-022a200 .sidebar-nav {
  gap: 4px;
}
body.h360-clean-dashboard-shell-022a200 .nav-item {
  min-height: 43px;
  padding: 9px 13px;
  border-radius: 11px;
}
body.h360-clean-dashboard-shell-022a200 .nav-item svg {
  width: 20px;
  height: 20px;
}
body.h360-clean-dashboard-shell-022a200 .nav-item span {
  font-size: 13.2px;
}
body.h360-clean-dashboard-shell-022a200 #h360-sidebar-promo-022a200 {
  min-height: 176px;
  padding: 18px 14px 15px;
  border-radius: 17px;
}
#h360-sidebar-promo-022a200 .h360-promo-tooth-022a200 {
  width: 70px;
  height: 70px;
}
#h360-sidebar-promo-022a200 strong {
  font-size: 13.5px;
}
#h360-sidebar-promo-022a200 small {
  font-size: 10.2px;
}
#h360-sidebar-promo-022a200 button {
  min-height: 34px;
  font-size: 11px;
}
body.h360-clean-dashboard-shell-022a200 .sidebar-utility {
  min-height: 40px;
  border-radius: 10px;
  font-size: 12.2px;
}
.h360x-page-022a200 {
  gap: 12px;
  padding-bottom: 14px;
}
.h360x-kpis-022a200 {
  gap: 10px;
}
.h360x-kpi-022a200 {
  min-height: 132px;
  padding: 14px 15px 10px;
  border-radius: 15px;
  grid-template-columns: minmax(0, 1fr) 48px;
  grid-template-rows: 1fr 30px;
  gap: 6px 10px;
}
.h360x-kpi-icon-022a200 {
  width: 48px;
  height: 48px;
  border-radius: 13px;
}
.h360x-kpi-icon-022a200 svg {
  width: 24px;
  height: 24px;
}
.h360x-kpi-copy-022a200 {
  gap: 3px;
}
.h360x-kpi-copy-022a200 > span:first-child {
  font-size: 12.2px;
}
.h360x-kpi-copy-022a200 strong {
  font-size: clamp(24px, 1.75vw, 29px);
}
.h360x-kpi-copy-022a200 small {
  font-size: 9.8px;
}
.h360x-kpi-trend-022a201 {
  font-size: 8.6px;
}
.h360x-kpi-progress-022a200,
.h360x-kpi-spark-022a201 {
  height: 30px;
}
.h360x-grid-022a200 {
  grid-template-columns: 292px minmax(430px, 1.08fr) minmax(330px, .92fr);
  gap: 12px;
}
.h360x-column-022a200 {
  gap: 12px;
}
.h360x-panel-022a200 {
  padding: 13px;
  border-radius: 15px;
}
.h360x-panel-022a200 > header {
  padding-bottom: 9px;
  margin-bottom: 8px;
  gap: 9px;
}
.h360x-panel-022a200 > header h2 {
  font-size: 14.5px;
}
.h360x-panel-022a200 > header p {
  margin-top: 2px;
  font-size: 9.8px;
  line-height: 1.45;
}
.h360x-header-icon-022a200 {
  width: 31px;
  height: 31px;
  border-radius: 9px;
}
.h360x-header-icon-022a200 svg {
  width: 16px;
  height: 16px;
}
.h360x-soft-pill-022a200 {
  min-height: 27px;
  padding: 5px 10px;
  font-size: 10px;
}
.h360x-alerts-022a200 {
  min-height: 222px;
}
.h360x-alert-row-022a200 {
  min-height: 46px;
  padding: 6px 1px;
  grid-template-columns: 39px minmax(0, 1fr) 29px;
  gap: 6px;
}
.h360x-alert-row-022a200 strong {
  font-size: 10.8px;
}
.h360x-alert-row-022a200 small,
.h360x-alert-row-022a200 time {
  font-size: 8.8px;
}
.h360x-alert-icon-022a200,
.h360x-action-icon-022a200 {
  width: 31px;
  height: 31px;
  border-radius: 9px;
}
.h360x-actions-022a200 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.h360x-action-card-022a200 {
  min-height: 70px;
  padding: 11px 8px;
  border-radius: 13px;
}
.h360x-action-card-022a200 svg {
  width: 26px;
  height: 26px;
}
.h360x-action-card-022a200 strong {
  font-size: 11.2px;
}
.h360x-action-card-022a200 small {
  font-size: 8.7px;
}
.h360x-schedule-022a200,
.h360x-upcoming-022a200 {
  min-height: 286px;
}
.h360x-schedule-022a200:has(.h360x-empty-022a200),
.h360x-upcoming-022a200:has(.h360x-empty-022a200) {
  min-height: 248px;
}
.h360x-calendar-toolbar-022a200 {
  min-height: 35px;
  margin: 0 0 8px;
  padding: 4px 7px;
  border-radius: 9px;
}
.h360x-calendar-toolbar-022a200 button {
  min-height: 26px;
  padding: 4px 9px;
  font-size: 9.8px;
}
.h360x-calendar-toolbar-022a200 strong {
  font-size: 10.8px;
}
.h360x-timeline-022a200 {
  gap: 6px;
}
.h360x-timeline-row-022a200 {
  grid-template-columns: 50px minmax(0, 1fr);
  gap: 7px;
}
.h360x-timeline-card-022a200 {
  min-height: 40px;
  padding: 6px 8px;
  border-radius: 8px;
}
.h360x-timeline-card-022a200 strong,
.h360x-person-022a200 strong {
  font-size: 10.2px;
}
.h360x-timeline-card-022a200 small,
.h360x-person-022a200 small {
  font-size: 8.6px;
}
.h360x-add-wait-022a200,
.h360x-row-primary-022a200,
.h360x-row-delete-022a200 {
  min-height: 24px;
  border-radius: 7px;
}
.h360x-upcoming-row-022a200 {
  min-height: 49px;
  padding: 6px 0;
  grid-template-columns: 31px minmax(0, 1fr) 43px auto;
  gap: 4px 7px;
}
.h360x-avatar-022a200 {
  width: 28px;
  height: 28px;
  font-size: 9px;
}
.h360x-state-022a200,
.h360x-queue-pill-022a200 {
  min-height: 22px;
  padding: 3px 7px;
  font-size: 8.2px;
}
.h360x-performance-022a200 {
  min-height: 246px;
}
.h360x-chart-legend-022a200 {
  margin-bottom: 2px;
  gap: 16px;
  font-size: 9.2px;
}
.h360x-chart-box-022a200 {
  min-height: 158px;
}
.h360x-performance-svg-022a200 {
  height: 158px;
}
.h360x-axis-grid-022a201 text {
  font-size: 8px;
}
.h360x-patients-022a200 {
  min-height: 190px;
}
.h360x-patient-row-022a200 {
  min-height: 35px;
  padding: 5px 0;
  grid-template-columns: 27px minmax(0, 1fr) 78px 62px;
  gap: 6px;
}
.h360x-patient-row-022a200 .h360x-avatar-022a200 {
  width: 24px;
  height: 24px;
  font-size: 7.5px;
}
.h360x-patient-row-022a200 strong {
  font-size: 9.7px;
}
.h360x-patient-row-022a200 small,
.h360x-patient-row-022a200 time {
  font-size: 8px;
}
.h360x-empty-022a200 {
  min-height: 56px;
  font-size: 10px;
}
.h360x-empty-022a200.compact {
  min-height: 40px;
}
.h360x-footer-link-022a200 {
  min-height: 27px;
  margin-top: 6px;
  font-size: 9.5px;
}
@media (max-width: 1420px) {
  body.h360-clean-dashboard-shell-022a200 { --sidebar-width: 238px; }
  body.h360-clean-dashboard-shell-022a200 .app-shell { grid-template-columns: minmax(0, 1fr) 238px; }
  body.h360-clean-dashboard-shell-022a200 .sidebar { width: 238px; padding-inline: 12px; }
  .h360x-grid-022a200 { grid-template-columns: 258px minmax(390px, 1.06fr) minmax(300px, .9fr); gap: 10px; }
  .h360x-kpis-022a200 { gap: 9px; }
  .h360x-kpi-022a200 { min-height: 124px; padding: 12px 13px 9px; }
  .h360x-panel-022a200 { padding: 12px; }
  .h360x-schedule-022a200, .h360x-upcoming-022a200 { min-height: 268px; }
  .h360x-schedule-022a200:has(.h360x-empty-022a200), .h360x-upcoming-022a200:has(.h360x-empty-022a200) { min-height: 226px; }
  .h360x-performance-022a200 { min-height: 226px; }
  .h360x-chart-box-022a200, .h360x-performance-svg-022a200 { min-height: 145px; height: 145px; }
}
@media (max-width: 1180px) {
  .h360x-schedule-022a200:has(.h360x-empty-022a200),
  .h360x-upcoming-022a200:has(.h360x-empty-022a200) { min-height: 210px; }
}
@media (max-width: 920px) {
  body.h360-clean-dashboard-shell-022a200 .main-content { padding: 9px; }
  body.h360-clean-dashboard-shell-022a200 .topbar { min-height: 68px; margin-bottom: 10px; }
  .h360x-kpi-022a200 { min-height: 118px; }
  .h360x-schedule-022a200, .h360x-upcoming-022a200, .h360x-performance-022a200, .h360x-patients-022a200 { min-height: auto; }
}
/* 0.22A.20.2_HEALTH360_DOCTOR_DASHBOARD_FINAL_VISUAL_FIT_CSS_END */

/* 0.22A.20.3_HEALTH360_EMPTY_STATES_CHART_POLISH_CSS_START */
@media (min-width: 1180px) {
  body.h360-clean-dashboard-shell-022a200 {
    --sidebar-width: 236px;
  }

  body.h360-clean-dashboard-shell-022a200 .app-shell {
    grid-template-columns: minmax(0, 1fr) 236px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .sidebar {
    width: 236px !important;
    padding: 16px 12px 10px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .sidebar-brand {
    margin-bottom: 16px !important;
    gap: 10px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .sidebar-brand .tooth-logo {
    width: 52px !important;
    height: 52px !important;
    border-radius: 16px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .sidebar-brand strong {
    font-size: 20px !important;
    line-height: 1.05 !important;
  }

  body.h360-clean-dashboard-shell-022a200 .sidebar-brand small {
    font-size: 10.5px !important;
    margin-top: 2px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .nav-item {
    min-height: 42px !important;
    padding: 8px 12px !important;
    border-radius: 11px !important;
    gap: 10px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .nav-item span {
    font-size: 13px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .nav-item svg {
    width: 20px !important;
    height: 20px !important;
  }

  #h360-sidebar-promo-022a200 {
    min-height: 154px !important;
    padding: 16px 14px !important;
    border-radius: 18px !important;
    gap: 8px !important;
  }

  #h360-sidebar-promo-022a200 .h360-promo-tooth-022a200 {
    width: 66px !important;
    height: 66px !important;
  }

  #h360-sidebar-promo-022a200 strong {
    font-size: 13px !important;
  }

  #h360-sidebar-promo-022a200 small {
    font-size: 9.5px !important;
  }

  #h360-sidebar-promo-022a200 button {
    min-height: 31px !important;
    font-size: 10px !important;
    padding: 6px 9px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .sidebar-footer {
    gap: 5px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .sidebar-utility {
    min-height: 38px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    padding: 7px 10px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .main-content {
    padding: 12px 14px 8px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .topbar {
    min-height: 70px !important;
    padding: 10px 14px !important;
    margin-bottom: 12px !important;
    border-radius: 18px !important;
    gap: 12px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .welcome-block h1 {
    font-size: 20px !important;
    line-height: 1.08 !important;
  }

  body.h360-clean-dashboard-shell-022a200 .welcome-block p {
    font-size: 10.8px !important;
    margin-top: 2px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .global-search {
    height: 39px !important;
    max-width: 460px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .icon-button {
    width: 35px !important;
    height: 35px !important;
    border-radius: 10px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .profile-avatar {
    width: 34px !important;
    height: 34px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .profile-chip {
    min-width: 130px !important;
  }

  .h360x-page-022a200 {
    gap: 10px !important;
    padding-bottom: 4px !important;
  }

  .h360x-kpis-022a200 {
    gap: 9px !important;
    margin-bottom: 10px !important;
  }

  .h360x-kpi-022a200 {
    min-height: 106px !important;
    padding: 13px 13px 9px !important;
    border-radius: 14px !important;
    gap: 8px !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
  }

  .h360x-kpi-icon-022a200 {
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
  }

  .h360x-kpi-icon-022a200 svg {
    width: 22px !important;
    height: 22px !important;
  }

  .h360x-kpi-copy-022a200 {
    gap: 3px !important;
  }

  .h360x-kpi-copy-022a200 span {
    font-size: 11.6px !important;
  }

  .h360x-kpi-copy-022a200 strong {
    font-size: clamp(21px, 1.55vw, 27px) !important;
  }

  .h360x-kpi-copy-022a200 small {
    font-size: 9.6px !important;
  }

  .h360x-kpi-progress-022a200 {
    height: 18px !important;
  }

  .h360x-grid-022a200 {
    grid-template-columns: 260px minmax(390px, 1.08fr) minmax(315px, .92fr) !important;
    gap: 10px !important;
    align-items: start !important;
  }

  .h360x-column-022a200 {
    gap: 10px !important;
  }

  .h360x-panel-022a200 {
    border-radius: 14px !important;
    padding: 14px !important;
    box-shadow: 0 8px 22px rgba(25, 70, 100, .045) !important;
  }

  .h360x-panel-022a200 > header {
    padding-bottom: 8px !important;
    margin-bottom: 8px !important;
    gap: 8px !important;
  }

  .h360x-panel-022a200 > header h2 {
    font-size: 14px !important;
  }

  .h360x-panel-022a200 > header p {
    font-size: 9.5px !important;
    margin-top: 2px !important;
    line-height: 1.35 !important;
  }

  .h360x-header-icon-022a200 {
    width: 31px !important;
    height: 31px !important;
    border-radius: 9px !important;
  }

  .h360x-alerts-022a200 {
    min-height: 168px !important;
  }

  .h360x-alert-row-022a200 {
    min-height: 44px !important;
    grid-template-columns: 38px minmax(0, 1fr) 30px !important;
    gap: 6px !important;
    padding: 6px 0 !important;
  }

  .h360x-alert-row-022a200 > span {
    width: 28px !important;
    height: 28px !important;
    border-radius: 8px !important;
  }

  .h360x-alert-row-022a200 strong {
    font-size: 10.5px !important;
  }

  .h360x-alert-row-022a200 small,
  .h360x-alert-row-022a200 time {
    font-size: 8.4px !important;
  }

  .h360x-quick-022a200 {
    min-height: 222px !important;
  }

  .h360x-actions-022a200 {
    gap: 8px !important;
  }

  .h360x-action-card-022a200 {
    min-height: 74px !important;
    padding: 9px 8px !important;
    border-radius: 12px !important;
    gap: 4px !important;
  }

  .h360x-action-card-022a200 svg {
    width: 22px !important;
    height: 22px !important;
  }

  .h360x-action-card-022a200 span {
    width: 28px !important;
    height: 28px !important;
  }

  .h360x-action-card-022a200 strong {
    font-size: 10px !important;
  }

  .h360x-action-card-022a200 small {
    font-size: 8px !important;
  }

  .h360x-schedule-022a200,
  .h360x-upcoming-022a200 {
    min-height: 204px !important;
  }

  .h360x-schedule-022a200:has(.h360x-empty-022a200),
  .h360x-upcoming-022a200:has(.h360x-empty-022a200) {
    min-height: 188px !important;
  }

  .h360x-calendar-toolbar-022a200 {
    min-height: 33px !important;
    margin: 0 0 6px !important;
    border-radius: 10px !important;
  }

  .h360x-calendar-toolbar-022a200 button {
    min-height: 28px !important;
    font-size: 9.5px !important;
  }

  .h360x-calendar-toolbar-022a200 strong {
    font-size: 10.5px !important;
  }

  .h360x-empty-022a200 {
    min-height: 54px !important;
    font-size: 10px !important;
    color: #8a97aa !important;
  }

  .h360x-empty-022a200.compact {
    min-height: 42px !important;
  }

  .h360x-schedule-022a200 .h360x-empty-022a200,
  .h360x-upcoming-022a200 .h360x-empty-022a200 {
    min-height: 46px !important;
  }

  .h360x-footer-link-022a200 {
    min-height: 24px !important;
    margin-top: 4px !important;
    font-size: 9.5px !important;
  }

  .h360x-performance-022a200,
  .h360x-patients-022a200 {
    min-height: 178px !important;
  }

  .h360x-chart-legend-022a200 {
    gap: 14px !important;
    margin-bottom: 2px !important;
    font-size: 9px !important;
  }

  .h360x-chart-box-022a200 {
    min-height: 112px !important;
    max-height: 118px !important;
    overflow: hidden !important;
    border-radius: 12px !important;
  }

  .h360x-performance-svg-022a200 {
    height: 116px !important;
    max-height: 116px !important;
  }

  .h360x-patient-row-022a200 {
    min-height: 34px !important;
    padding: 4px 0 !important;
    grid-template-columns: 26px minmax(0, 1fr) 82px 62px !important;
    gap: 6px !important;
  }

  .h360x-patient-row-022a200 .h360x-avatar-022a200 {
    width: 24px !important;
    height: 24px !important;
    font-size: 7.5px !important;
  }

  .h360x-patient-row-022a200 strong {
    font-size: 9.5px !important;
  }

  .h360x-patient-row-022a200 small,
  .h360x-patient-row-022a200 time {
    font-size: 8px !important;
  }
}

@media (min-width: 1180px) and (max-height: 850px) {
  body.h360-clean-dashboard-shell-022a200 .main-content {
    padding-top: 9px !important;
  }

  body.h360-clean-dashboard-shell-022a200 .topbar {
    min-height: 62px !important;
    padding-block: 8px !important;
    margin-bottom: 9px !important;
  }

  .h360x-kpi-022a200 {
    min-height: 96px !important;
    padding-block: 10px 7px !important;
  }

  .h360x-schedule-022a200,
  .h360x-upcoming-022a200 {
    min-height: 176px !important;
  }

  .h360x-schedule-022a200:has(.h360x-empty-022a200),
  .h360x-upcoming-022a200:has(.h360x-empty-022a200) {
    min-height: 158px !important;
  }

  .h360x-alerts-022a200 {
    min-height: 148px !important;
  }

  .h360x-quick-022a200 {
    min-height: 194px !important;
  }

  .h360x-performance-022a200,
  .h360x-patients-022a200 {
    min-height: 158px !important;
  }

  .h360x-chart-box-022a200 {
    min-height: 96px !important;
    max-height: 100px !important;
  }

  .h360x-performance-svg-022a200 {
    height: 98px !important;
    max-height: 98px !important;
  }

  #h360-sidebar-promo-022a200 {
    min-height: 130px !important;
  }

  #h360-sidebar-promo-022a200 .h360-promo-tooth-022a200 {
    width: 54px !important;
    height: 54px !important;
  }
}

@media (max-width: 1179px) {
  .h360x-schedule-022a200:has(.h360x-empty-022a200),
  .h360x-upcoming-022a200:has(.h360x-empty-022a200) {
    min-height: 170px !important;
  }

  .h360x-empty-022a200 {
    min-height: 56px !important;
  }

  .h360x-chart-box-022a200 {
    max-height: 130px !important;
  }

  .h360x-performance-svg-022a200 {
    height: 128px !important;
  }
}

:root[data-theme="dark"] .h360x-empty-022a200 {
  color: #9ba9bd !important;
}
/* 0.22A.20.3_HEALTH360_EMPTY_STATES_CHART_POLISH_CSS_END */

/* 0.22A.20.3.1_HEALTH360_KPI_TYPOGRAPHY_CHART_BALANCE_CSS_START */
@media (min-width:1180px){
  .h360x-kpis-022a200{gap:10px!important;margin-bottom:10px!important;}
  .h360x-kpi-022a200{min-height:118px!important;padding:14px 14px 10px!important;border-radius:15px!important;display:grid!important;grid-template-columns:minmax(0,1fr) 50px!important;grid-template-rows:minmax(58px,auto) 26px!important;column-gap:12px!important;row-gap:6px!important;align-items:start!important;overflow:hidden!important;}
  .h360x-kpi-icon-022a200{grid-column:2!important;grid-row:1!important;width:46px!important;height:46px!important;border-radius:13px!important;justify-self:end!important;align-self:start!important;flex:0 0 46px!important;}
  .h360x-kpi-icon-022a200 svg{width:23px!important;height:23px!important;}
  .h360x-kpi-copy-022a200{grid-column:1!important;grid-row:1!important;min-width:0!important;max-width:100%!important;display:flex!important;flex-direction:column!important;align-items:flex-end!important;justify-content:flex-start!important;text-align:right!important;gap:3px!important;overflow:hidden!important;}
  .h360x-kpi-copy-022a200 span{max-width:100%!important;display:block!important;font-size:12px!important;font-weight:800!important;line-height:1.18!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;letter-spacing:0!important;}
  .h360x-kpi-copy-022a200 strong{max-width:100%!important;display:block!important;font-size:clamp(22px,2.1vw,31px)!important;line-height:1.02!important;font-weight:950!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important;letter-spacing:-.02em!important;}
  .h360x-kpi-copy-022a200 small{max-width:100%!important;display:block!important;font-size:9.6px!important;line-height:1.35!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
  .h360x-kpi-progress-022a200{grid-column:1/-1!important;grid-row:2!important;height:24px!important;min-height:24px!important;align-self:end!important;margin-top:0!important;}
  .h360x-grid-022a200{grid-template-columns:260px minmax(420px,1.06fr) minmax(330px,.94fr)!important;gap:10px!important;}
  .h360x-schedule-022a200,.h360x-upcoming-022a200{min-height:174px!important;}
  .h360x-schedule-022a200:has(.h360x-empty-022a200),.h360x-upcoming-022a200:has(.h360x-empty-022a200){min-height:158px!important;}
  .h360x-empty-022a200{min-height:46px!important;padding:8px 4px!important;line-height:1.5!important;}
  .h360x-performance-022a200,.h360x-patients-022a200{min-height:172px!important;}
  .h360x-chart-box-022a200{min-height:118px!important;max-height:124px!important;overflow:hidden!important;padding:4px 6px 0!important;}
  .h360x-performance-svg-022a200{height:120px!important;max-height:120px!important;display:block!important;}
}
@media (min-width:1180px) and (max-height:850px){
  .h360x-kpi-022a200{min-height:108px!important;padding:12px 13px 8px!important;grid-template-rows:minmax(54px,auto) 23px!important;}
  .h360x-kpi-copy-022a200 span{font-size:11.5px!important;}
  .h360x-kpi-copy-022a200 strong{font-size:clamp(21px,1.95vw,29px)!important;}
  .h360x-kpi-copy-022a200 small{font-size:9px!important;}
  .h360x-schedule-022a200,.h360x-upcoming-022a200{min-height:158px!important;}
  .h360x-schedule-022a200:has(.h360x-empty-022a200),.h360x-upcoming-022a200:has(.h360x-empty-022a200){min-height:148px!important;}
  .h360x-performance-022a200,.h360x-patients-022a200{min-height:162px!important;}
  .h360x-chart-box-022a200{min-height:106px!important;max-height:112px!important;}
  .h360x-performance-svg-022a200{height:108px!important;max-height:108px!important;}
}
@media (max-width:1179px){
  .h360x-kpi-022a200{min-height:112px!important;}
  .h360x-kpi-copy-022a200 span,.h360x-kpi-copy-022a200 strong,.h360x-kpi-copy-022a200 small{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
}
/* 0.22A.20.3.1_HEALTH360_KPI_TYPOGRAPHY_CHART_BALANCE_CSS_END */

/* 0.22A.20.3.2_HEALTH360_KPI_ICONS_REFERENCE_MATCH_CSS_START */
.h360x-kpi-icon-022a200 {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.55);
}

.h360x-kpi-icon-022a200 .h360x-kpi-reference-svg-022a2032 {
  width: 31px !important;
  height: 31px !important;
  display: block !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.05 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  vector-effect: non-scaling-stroke !important;
}

.h360x-kpi-022a200.tone-orange .h360x-kpi-icon-022a200 {
  background: linear-gradient(135deg, #fff6ec 0%, #fff0df 100%) !important;
  color: #ff981f !important;
}

.h360x-kpi-022a200.tone-purple .h360x-kpi-icon-022a200 {
  background: linear-gradient(135deg, #f6efff 0%, #efe4ff 100%) !important;
  color: #9358ff !important;
}

.h360x-kpi-022a200.tone-green .h360x-kpi-icon-022a200 {
  background: linear-gradient(135deg, #ebfbf4 0%, #dff8ee 100%) !important;
  color: #17b978 !important;
}

.h360x-kpi-022a200.tone-blue .h360x-kpi-icon-022a200 {
  background: linear-gradient(135deg, #eef7ff 0%, #e6f1ff 100%) !important;
  color: #2d85f6 !important;
}

.h360x-kpi-reference-orange-022a2032 { stroke-width: 2.05 !important; }
.h360x-kpi-reference-purple-022a2032 { stroke-width: 2 !important; }
.h360x-kpi-reference-green-022a2032 { stroke-width: 2.05 !important; }
.h360x-kpi-reference-blue-022a2032 { stroke-width: 2 !important; }

@media (min-width: 1180px) {
  .h360x-kpi-icon-022a200 {
    width: 50px !important;
    height: 50px !important;
    border-radius: 14px !important;
  }

  .h360x-kpi-icon-022a200 .h360x-kpi-reference-svg-022a2032 {
    width: 32px !important;
    height: 32px !important;
  }
}

@media (min-width: 1180px) and (max-height: 850px) {
  .h360x-kpi-icon-022a200 {
    width: 46px !important;
    height: 46px !important;
    border-radius: 13px !important;
  }

  .h360x-kpi-icon-022a200 .h360x-kpi-reference-svg-022a2032 {
    width: 29px !important;
    height: 29px !important;
  }
}

:root[data-theme="dark"] .h360x-kpi-022a200.tone-orange .h360x-kpi-icon-022a200 { background: rgba(255, 152, 31, .14) !important; }
:root[data-theme="dark"] .h360x-kpi-022a200.tone-purple .h360x-kpi-icon-022a200 { background: rgba(147, 88, 255, .16) !important; }
:root[data-theme="dark"] .h360x-kpi-022a200.tone-green .h360x-kpi-icon-022a200 { background: rgba(23, 185, 120, .14) !important; }
:root[data-theme="dark"] .h360x-kpi-022a200.tone-blue .h360x-kpi-icon-022a200 { background: rgba(45, 133, 246, .14) !important; }
/* 0.22A.20.3.2_HEALTH360_KPI_ICONS_REFERENCE_MATCH_CSS_END */

/* 0.22A.20.3.3_HEALTH360_KPI_REFERENCE_LAYOUT_CSS_START */
@media (min-width:1180px) {
  body.h360-clean-dashboard-shell-022a200 .main-content {
    padding-inline: 14px !important;
  }

  .h360x-kpis-022a200 {
    gap: 10px !important;
    align-items: stretch !important;
  }

  .h360x-kpi-022a200 {
    min-height: 132px !important;
    height: 132px !important;
    padding: 17px 18px 12px !important;
    border-radius: 16px !important;
    display: grid !important;
    direction: rtl !important;
    grid-template-columns: 62px minmax(0, 1fr) !important;
    grid-template-rows: 74px 36px !important;
    grid-template-areas:
      "icon copy"
      "spark spark" !important;
    column-gap: 14px !important;
    row-gap: 8px !important;
    align-items: start !important;
    overflow: hidden !important;
  }

  .h360x-kpi-icon-022a200 {
    grid-area: icon !important;
    width: 56px !important;
    height: 56px !important;
    border-radius: 15px !important;
    justify-self: start !important;
    align-self: start !important;
    display: grid !important;
    place-items: center !important;
    margin: 0 !important;
    box-shadow: none !important;
  }

  .h360x-kpi-022a200.tone-orange .h360x-kpi-icon-022a200 {
    background: #fff3e4 !important;
    color: #ff970f !important;
  }

  .h360x-kpi-022a200.tone-purple .h360x-kpi-icon-022a200 {
    background: #f1e7ff !important;
    color: #9656ff !important;
  }

  .h360x-kpi-022a200.tone-green .h360x-kpi-icon-022a200 {
    background: #e7faf2 !important;
    color: #16bd78 !important;
  }

  .h360x-kpi-022a200.tone-blue .h360x-kpi-icon-022a200 {
    background: #eaf4ff !important;
    color: #3489ff !important;
  }

  .h360x-kpi-reference-svg-022a2032 {
    width: 34px !important;
    height: 34px !important;
    stroke-width: 2.35 !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  .h360x-kpi-copy-022a200 {
    grid-area: copy !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: right !important;
    gap: 3px !important;
    padding-top: 1px !important;
    overflow: hidden !important;
  }

  .h360x-kpi-copy-022a200 span {
    max-width: 100% !important;
    font-size: 13px !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    color: #4b5871 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .h360x-kpi-copy-022a200 strong {
    max-width: 100% !important;
    font-size: clamp(30px, 2.55vw, 38px) !important;
    line-height: .98 !important;
    font-weight: 950 !important;
    color: #07142b !important;
    letter-spacing: -.035em !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  .h360x-kpi-copy-022a200 small {
    max-width: 100% !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
    color: #7b889c !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .h360x-kpi-trend-022a201 {
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    max-width: 100% !important;
    font-size: 10.8px !important;
    line-height: 1.2 !important;
    font-weight: 850 !important;
    color: #06a164 !important;
    white-space: nowrap !important;
  }

  .h360x-kpi-progress-022a200 {
    grid-area: spark !important;
    width: 100% !important;
    height: 34px !important;
    min-height: 34px !important;
    align-self: end !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  .h360x-kpi-spark-022a201 {
    width: 100% !important;
    height: 34px !important;
    display: block !important;
    overflow: visible !important;
  }

  .h360x-kpi-spark-022a201 polygon {
    opacity: .14 !important;
  }

  .h360x-kpi-spark-022a201 polyline {
    stroke-width: 2.2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    vector-effect: non-scaling-stroke !important;
  }
}

@media (min-width:1180px) and (max-height:850px) {
  .h360x-kpi-022a200 {
    min-height: 124px !important;
    height: 124px !important;
    padding: 14px 17px 10px !important;
    grid-template-columns: 58px minmax(0, 1fr) !important;
    grid-template-rows: 70px 32px !important;
  }

  .h360x-kpi-icon-022a200 {
    width: 52px !important;
    height: 52px !important;
  }

  .h360x-kpi-reference-svg-022a2032 {
    width: 31px !important;
    height: 31px !important;
  }

  .h360x-kpi-copy-022a200 strong {
    font-size: clamp(28px, 2.45vw, 35px) !important;
  }

  .h360x-kpi-progress-022a200,
  .h360x-kpi-spark-022a201 {
    height: 31px !important;
    min-height: 31px !important;
  }
}

@media (max-width:1179px) {
  .h360x-kpi-022a200 {
    direction: rtl !important;
    grid-template-columns: 56px minmax(0, 1fr) !important;
    grid-template-areas:
      "icon copy"
      "spark spark" !important;
  }

  .h360x-kpi-icon-022a200 {
    grid-area: icon !important;
    justify-self: start !important;
  }

  .h360x-kpi-copy-022a200 {
    grid-area: copy !important;
  }

  .h360x-kpi-progress-022a200 {
    grid-area: spark !important;
  }
}
/* 0.22A.20.3.3_HEALTH360_KPI_REFERENCE_LAYOUT_CSS_END */

/* 0.22A.20.3.4_HEALTH360_KPI_REFERENCE_PIXEL_POLISH_CSS_START */
@media (min-width:1180px) {
  .h360x-kpis-022a200 {
    gap: 12px !important;
    margin-bottom: 12px !important;
  }

  .h360x-kpi-022a200 {
    height: 150px !important;
    min-height: 150px !important;
    padding: 18px 20px 12px !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    border: 1px solid rgba(207, 220, 235, .82) !important;
    box-shadow: 0 12px 30px rgba(21, 63, 96, .055) !important;
    direction: rtl !important;
    display: grid !important;
    grid-template-columns: 68px minmax(0, 1fr) !important;
    grid-template-rows: 80px 44px !important;
    grid-template-areas:
      "icon copy"
      "spark spark" !important;
    column-gap: 16px !important;
    row-gap: 6px !important;
    align-items: start !important;
    overflow: hidden !important;
  }

  .h360x-kpi-icon-022a200 {
    grid-area: icon !important;
    width: 62px !important;
    height: 62px !important;
    min-width: 62px !important;
    min-height: 62px !important;
    border-radius: 17px !important;
    justify-self: start !important;
    align-self: start !important;
    display: grid !important;
    place-items: center !important;
    margin: 0 !important;
    box-shadow: none !important;
  }

  .h360x-kpi-reference-svg-022a2032 {
    width: 38px !important;
    height: 38px !important;
    stroke-width: 2.2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  .h360x-kpi-022a200.tone-orange .h360x-kpi-icon-022a200 {
    background: #fff1df !important;
    color: #ff950f !important;
  }

  .h360x-kpi-022a200.tone-purple .h360x-kpi-icon-022a200 {
    background: #f0e4ff !important;
    color: #9657ff !important;
  }

  .h360x-kpi-022a200.tone-green .h360x-kpi-icon-022a200 {
    background: #e4f9f0 !important;
    color: #14ba73 !important;
  }

  .h360x-kpi-022a200.tone-blue .h360x-kpi-icon-022a200 {
    background: #e7f3ff !important;
    color: #3388ff !important;
  }

  .h360x-kpi-copy-022a200 {
    grid-area: copy !important;
    padding-top: 1px !important;
    min-width: 0 !important;
    max-width: 100% !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: right !important;
    gap: 4px !important;
    overflow: visible !important;
  }

  .h360x-kpi-copy-022a200 span {
    font-size: 14px !important;
    font-weight: 850 !important;
    line-height: 1.12 !important;
    color: #46546d !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .h360x-kpi-copy-022a200 strong {
    display: block !important;
    font-size: clamp(34px, 2.75vw, 42px) !important;
    line-height: .96 !important;
    font-weight: 950 !important;
    color: #07142b !important;
    letter-spacing: -.038em !important;
    white-space: nowrap !important;
    max-width: 100% !important;
    overflow: visible !important;
    transform: translateY(1px) !important;
  }

  .h360x-kpi-copy-022a200 small {
    font-size: 10px !important;
    line-height: 1.25 !important;
    color: #7a879b !important;
    white-space: nowrap !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .h360x-kpi-trend-022a201 {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 11.2px !important;
    line-height: 1.15 !important;
    font-weight: 900 !important;
    color: #069e64 !important;
    white-space: nowrap !important;
    transform: translateY(1px) !important;
  }

  .h360x-kpi-progress-022a200 {
    grid-area: spark !important;
    height: 43px !important;
    min-height: 43px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 1px !important;
    align-self: end !important;
    overflow: visible !important;
  }

  .h360x-kpi-spark-022a201 {
    width: 100% !important;
    height: 42px !important;
    display: block !important;
    overflow: visible !important;
  }

  .h360x-kpi-spark-022a201 polyline {
    stroke-width: 2.4 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
    vector-effect: non-scaling-stroke !important;
  }

  .h360x-kpi-spark-022a201 polygon {
    opacity: .12 !important;
  }
}

@media (min-width:1180px) and (max-height:850px) {
  .h360x-kpi-022a200 {
    height: 140px !important;
    min-height: 140px !important;
    padding: 16px 18px 11px !important;
    grid-template-columns: 64px minmax(0, 1fr) !important;
    grid-template-rows: 74px 40px !important;
  }

  .h360x-kpi-icon-022a200 {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    min-height: 58px !important;
  }

  .h360x-kpi-reference-svg-022a2032 {
    width: 35px !important;
    height: 35px !important;
  }

  .h360x-kpi-copy-022a200 span {
    font-size: 13px !important;
  }

  .h360x-kpi-copy-022a200 strong {
    font-size: clamp(31px, 2.55vw, 39px) !important;
  }

  .h360x-kpi-copy-022a200 small {
    font-size: 9.6px !important;
  }

  .h360x-kpi-trend-022a201 {
    font-size: 10.6px !important;
  }

  .h360x-kpi-progress-022a200 {
    height: 39px !important;
    min-height: 39px !important;
  }

  .h360x-kpi-spark-022a201 {
    height: 38px !important;
  }
}

@media (max-width:1179px) {
  .h360x-kpi-022a200 {
    direction: rtl !important;
    grid-template-columns: 62px minmax(0, 1fr) !important;
    grid-template-areas:
      "icon copy"
      "spark spark" !important;
  }

  .h360x-kpi-icon-022a200 {
    grid-area: icon !important;
    justify-self: start !important;
  }

  .h360x-kpi-copy-022a200 {
    grid-area: copy !important;
    align-items: flex-start !important;
  }

  .h360x-kpi-progress-022a200 {
    grid-area: spark !important;
  }
}
/* 0.22A.20.3.4_HEALTH360_KPI_REFERENCE_PIXEL_POLISH_CSS_END */

/* 0.22A.21.0_HEALTH360_PATIENTS_REFERENCE_REDESIGN_CSS_START */
.h360p-page-022a210{display:grid;gap:16px;color:#17213a}
.h360p-page-022a210 *{box-sizing:border-box}
.h360p-titlebar-022a210{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin:-2px 0 0}
.h360p-titlebar-022a210 h1{margin:0;color:#091631;font-size:22px;font-weight:950;line-height:1}
.h360p-titlebar-022a210 p{margin:6px 0 0;color:#71809a;font-size:12px;font-weight:700}
.h360p-titlebar-022a210 p span{margin-inline:5px;color:#b0bad0}
.h360p-title-icon-022a210{width:34px;height:34px;border-radius:12px;background:#eef7ff;color:#2685ff;display:grid;place-items:center}
.h360p-title-icon-022a210 svg,.h360p-page-022a210 button svg,.h360p-kpi-icon-022a210 svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

.h360p-kpis-022a210{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.h360p-kpi-022a210{min-height:116px;background:#fff;border:1px solid rgba(207,220,235,.86);border-radius:16px;padding:18px 20px;display:grid;grid-template-columns:minmax(0,1fr) 58px;gap:16px;align-items:start;box-shadow:0 10px 26px rgba(19,54,86,.052)}
.h360p-kpi-copy-022a210{display:grid;gap:7px;text-align:right;justify-items:start;min-width:0}
.h360p-kpi-copy-022a210 span{font-size:13px;font-weight:850;color:#4a5770;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.h360p-kpi-copy-022a210 strong{font-size:25px;line-height:1;font-weight:950;color:#07142b;letter-spacing:-.02em;white-space:nowrap}
.h360p-kpi-copy-022a210 small{font-size:11px;font-weight:800;color:#0ba568;white-space:nowrap}
.h360p-kpi-icon-022a210{width:58px;height:58px;border-radius:15px;display:grid;place-items:center;justify-self:end}
.h360p-kpi-icon-022a210 svg{width:31px;height:31px}
.h360p-kpi-022a210.tone-orange .h360p-kpi-icon-022a210{background:#fff0de;color:#ff8f12}
.h360p-kpi-022a210.tone-green .h360p-kpi-icon-022a210{background:#e5f9f0;color:#16b975}
.h360p-kpi-022a210.tone-blue .h360p-kpi-icon-022a210{background:#e9f4ff;color:#3387ff}
.h360p-kpi-022a210.tone-purple .h360p-kpi-icon-022a210{background:#f1e7ff;color:#8d55ff}

.h360p-content-grid-022a210{display:grid;grid-template-columns:minmax(0,1fr) 304px;gap:16px;align-items:start}
.h360p-main-022a210{display:grid;gap:14px;min-width:0}
.h360p-side-022a210{display:grid;gap:14px;min-width:0}
.h360p-toolbar-022a210{background:#fff;border:1px solid rgba(207,220,235,.86);border-radius:16px;padding:14px;display:grid;grid-template-columns:minmax(240px,1fr) 230px 170px 150px 110px;gap:12px;align-items:end;box-shadow:0 10px 24px rgba(19,54,86,.045)}
.h360p-toolbar-022a210 label{display:grid;gap:6px;color:#6e7c96;font-size:11px;font-weight:800}
.h360p-toolbar-022a210 input,.h360p-toolbar-022a210 select{height:42px;border:1px solid #dce5f1;border-radius:12px;background:#fbfdff;color:#23304a;padding:0 12px;font-weight:750;outline:none}
.h360p-search-022a210{position:relative}
.h360p-search-022a210 svg{position:absolute;left:13px;bottom:10px;width:22px;height:22px;color:#6b7892;fill:none;stroke:currentColor;stroke-width:2}
.h360p-search-022a210 input{padding-inline-start:44px}
.h360p-export-022a210{height:42px;border:1px solid #dce5f1;border-radius:12px;background:#fff;color:#41516d;font-weight:900;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer}
.h360p-export-022a210:hover{border-color:#2f80ed;color:#2f80ed}

.h360p-table-card-022a210{background:#fff;border:1px solid rgba(207,220,235,.86);border-radius:16px;box-shadow:0 10px 24px rgba(19,54,86,.045);overflow:hidden}
.h360p-table-wrap-022a210{overflow:auto}
.h360p-table-card-022a210 table{width:100%;border-collapse:separate;border-spacing:0;background:#fff}
.h360p-table-card-022a210 th{background:#fbfcff;color:#60708c;font-size:12px;font-weight:900;text-align:right;padding:14px 16px;border-bottom:1px solid #e7edf5;white-space:nowrap}
.h360p-table-card-022a210 td{padding:13px 16px;border-bottom:1px solid #edf2f7;color:#2a354d;font-size:13px;font-weight:700;white-space:nowrap;text-align:right}
.h360p-table-card-022a210 tbody tr:hover{background:#f8fbff}
.h360p-name-cell-022a210{display:flex;align-items:center;gap:10px}
.h360p-avatar-022a210,.h360p-large-avatar-022a210{display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#dfeaff,#edf7ff);color:#2f7cf4;font-weight:950;border:2px solid #fff;box-shadow:0 0 0 1px #dfe7f2}
.h360p-avatar-022a210{width:34px;height:34px;font-size:11px;flex:0 0 34px}
.h360p-large-avatar-022a210{width:72px;height:72px;font-size:18px}
.h360p-name-cell-022a210 strong{display:block;color:#15213b;font-size:13px;font-weight:950}
.h360p-name-cell-022a210 small{display:block;margin-top:4px;color:#7e8ca3;font-size:11px}
.h360p-status-022a210{display:inline-flex;align-items:center;justify-content:center;min-width:74px;border-radius:8px;padding:7px 10px;font-size:12px;font-weight:900}
.h360p-status-022a210.is-active{background:#e5f8ef;color:#0b9a60}
.h360p-status-022a210.is-followup{background:#fff1df;color:#d98010}
.h360p-status-022a210.is-treatment{background:#eaf4ff;color:#2578f1}
.h360p-status-022a210.is-risk,.h360p-status-022a210.is-late{background:#ffe8ed;color:#e0455e}
.h360p-balance-022a210{font-weight:950}
.h360p-balance-022a210.is-clear{color:#0aa865}
.h360p-balance-022a210.is-due{color:#f28b18}
.h360p-row-action-022a210{width:38px;height:34px;border:1px solid #dde6f2;border-radius:10px;background:#fff;color:#24334f;display:grid;place-items:center;cursor:pointer}
.h360p-row-action-022a210 svg{width:21px;height:21px}
.h360p-table-card-022a210 footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 16px;color:#72809a;font-size:12px;font-weight:800}
.h360p-pages-022a210{display:flex;align-items:center;gap:8px}
.h360p-pages-022a210 button{width:30px;height:30px;border:0;border-radius:9px;background:#f3f7fc;color:#5d6b84;font-weight:850}
.h360p-pages-022a210 button.active{background:#2f80ed;color:#fff;box-shadow:0 8px 16px rgba(47,128,237,.22)}
.h360p-table-card-022a210 footer select{height:34px;border:1px solid #dce5f1;border-radius:10px;background:#fff;color:#5e6c84;padding:0 10px;font-weight:800}

.h360p-today-022a210,.h360p-selected-card-022a210{background:#fff;border:1px solid rgba(207,220,235,.86);border-radius:16px;padding:15px;box-shadow:0 10px 24px rgba(19,54,86,.045)}
.h360p-today-022a210 header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #edf2f7;padding-bottom:11px;margin-bottom:8px}
.h360p-today-022a210 h2{margin:0;font-size:15px;color:#142039;font-weight:950}
.h360p-today-022a210 header button{border:0;background:transparent;color:#1f7af2;font-weight:900;cursor:pointer}
.h360p-appts-022a210{display:grid}
.h360p-appt-row-022a210{width:100%;border:0;background:#fff;border-bottom:1px solid #edf2f7;padding:10px 0;display:grid;grid-template-columns:9px 52px minmax(0,1fr) 70px;gap:8px;align-items:center;text-align:right;cursor:pointer}
.h360p-appt-row-022a210:last-child{border-bottom:0}
.h360p-appt-dot-022a210{width:8px;height:8px;border-radius:50%;background:#11b981}
.h360p-appt-row-022a210 time{font-size:11px;color:#24324c;font-weight:900;white-space:nowrap}
.h360p-appt-row-022a210 strong{display:block;font-size:12px;color:#18243f;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.h360p-appt-row-022a210 small{display:block;margin-top:3px;font-size:10.5px;color:#77859d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.h360p-chip-022a210{justify-self:end;font-style:normal;border-radius:8px;background:#dff8ec;color:#0da264;font-size:10.5px;font-weight:950;padding:6px 9px}
.h360p-schedule-link-022a210{width:100%;height:38px;border:0;background:transparent;color:#1f7af2;font-weight:900;display:flex;align-items:center;justify-content:center;gap:7px;cursor:pointer}
.h360p-schedule-link-022a210 svg{width:18px;height:18px}

.h360p-selected-card-022a210 header{display:flex;align-items:center;gap:13px;margin-bottom:14px}
.h360p-selected-card-022a210 h3{margin:0;color:#16223d;font-size:18px;font-weight:950;display:flex;align-items:center;gap:5px}
.h360p-selected-card-022a210 h3 i{color:#ffab2e;display:inline-grid}
.h360p-selected-card-022a210 h3 svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.h360p-selected-card-022a210 p{margin:5px 0 0;color:#6f7e98;font-size:12px;font-weight:800}
.h360p-selected-card-022a210 dl{display:grid;gap:9px;border-top:1px solid #edf2f7;border-bottom:1px solid #edf2f7;padding:12px 0;margin:0 0 14px}
.h360p-selected-card-022a210 dl div{display:grid;grid-template-columns:95px minmax(0,1fr);align-items:center;gap:8px}
.h360p-selected-card-022a210 dt{color:#7b8aa2;font-size:11px;font-weight:900}
.h360p-selected-card-022a210 dd{margin:0;color:#26354f;font-size:12px;font-weight:850;min-width:0}
.h360p-selected-card-022a210 footer{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.h360p-selected-card-022a210 footer button{height:44px;border-radius:12px;font-weight:950;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.h360p-outline-022a210{background:#fff;color:#2f80ed;border:1px solid #2f80ed}
.h360p-primary-022a210{background:#247cf2;color:#fff;border:1px solid #247cf2;box-shadow:0 10px 18px rgba(36,124,242,.25)}
.h360p-empty-022a210{min-height:64px;display:grid;place-items:center;text-align:center;color:#8a98ad;font-size:12px;font-weight:800}

@media(max-width:1280px){
  .h360p-content-grid-022a210{grid-template-columns:1fr}
  .h360p-side-022a210{grid-template-columns:1fr 1fr}
  .h360p-toolbar-022a210{grid-template-columns:1fr 1fr 1fr}
}
@media(max-width:900px){
  .h360p-kpis-022a210{grid-template-columns:1fr 1fr}
  .h360p-side-022a210{grid-template-columns:1fr}
  .h360p-toolbar-022a210{grid-template-columns:1fr}
  .h360p-table-card-022a210 footer{flex-direction:column;align-items:stretch}
}
@media(max-width:620px){
  .h360p-kpis-022a210{grid-template-columns:1fr}
  .h360p-selected-card-022a210 footer{grid-template-columns:1fr}
}
:root[data-theme="dark"] .h360p-kpi-022a210,
:root[data-theme="dark"] .h360p-toolbar-022a210,
:root[data-theme="dark"] .h360p-table-card-022a210,
:root[data-theme="dark"] .h360p-today-022a210,
:root[data-theme="dark"] .h360p-selected-card-022a210{background:#111827;border-color:#29354a;color:#e9eef8}
:root[data-theme="dark"] .h360p-table-card-022a210 table,
:root[data-theme="dark"] .h360p-table-card-022a210 th,
:root[data-theme="dark"] .h360p-appt-row-022a210{background:#111827}
:root[data-theme="dark"] .h360p-kpi-copy-022a210 strong,
:root[data-theme="dark"] .h360p-titlebar-022a210 h1,
:root[data-theme="dark"] .h360p-today-022a210 h2,
:root[data-theme="dark"] .h360p-selected-card-022a210 h3,
:root[data-theme="dark"] .h360p-name-cell-022a210 strong{color:#f7fbff}
/* 0.22A.21.0_HEALTH360_PATIENTS_REFERENCE_REDESIGN_CSS_END */

/* 0.22A.21.0.1_HEALTH360_PATIENTS_LAYOUT_REFERENCE_FIT_CSS_START */
@media (min-width:1180px) {
  .h360p-page-022a210 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 318px !important;
    grid-template-areas:
      "kpis side"
      "main side" !important;
    column-gap: 16px !important;
    row-gap: 14px !important;
    align-items: start !important;
    direction: ltr !important;
    padding: 0 18px 18px !important;
    max-width: none !important;
  }

  .h360p-titlebar-022a210 {
    display: none !important;
  }

  .h360p-kpis-022a210 {
    grid-area: kpis !important;
    direction: ltr !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 0 !important;
    width: 100% !important;
  }

  .h360p-kpi-022a210 {
    direction: rtl !important;
    min-height: 118px !important;
    padding: 16px 18px !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 24px rgba(19, 54, 86, .045) !important;
    grid-template-columns: minmax(0, 1fr) 58px !important;
    gap: 14px !important;
  }

  .h360p-kpi-copy-022a210 {
    align-items: flex-start !important;
    justify-items: start !important;
    text-align: right !important;
    gap: 6px !important;
  }

  .h360p-kpi-copy-022a210 strong {
    font-size: 28px !important;
    line-height: 1 !important;
  }

  .h360p-kpi-icon-022a210 {
    width: 58px !important;
    height: 58px !important;
    border-radius: 15px !important;
  }

  .h360p-kpi-icon-022a210 svg {
    width: 31px !important;
    height: 31px !important;
  }

  .h360p-content-grid-022a210 {
    display: contents !important;
  }

  .h360p-main-022a210 {
    grid-area: main !important;
    direction: rtl !important;
    display: grid !important;
    gap: 14px !important;
    min-width: 0 !important;
  }

  .h360p-side-022a210 {
    grid-area: side !important;
    direction: rtl !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    min-width: 0 !important;
    align-content: start !important;
  }

  .h360p-toolbar-022a210 {
    display: grid !important;
    grid-template-columns: minmax(250px, 1fr) 230px 170px 150px 112px !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    border-radius: 16px !important;
    align-items: end !important;
    direction: rtl !important;
    margin: 0 !important;
  }

  .h360p-toolbar-022a210 label {
    min-width: 0 !important;
  }

  .h360p-toolbar-022a210 input,
  .h360p-toolbar-022a210 select,
  .h360p-export-022a210 {
    height: 42px !important;
    border-radius: 12px !important;
    font-size: 12px !important;
  }

  .h360p-table-card-022a210 {
    border-radius: 16px !important;
    overflow: hidden !important;
    min-height: 320px !important;
  }

  .h360p-table-wrap-022a210 {
    min-height: 230px !important;
  }

  .h360p-table-card-022a210 th {
    padding: 13px 16px !important;
    font-size: 12px !important;
  }

  .h360p-table-card-022a210 td {
    padding: 13px 16px !important;
    font-size: 13px !important;
  }

  .h360p-table-card-022a210 footer {
    min-height: 56px !important;
    padding: 12px 16px !important;
  }

  .h360p-today-022a210 {
    min-height: 250px !important;
    padding: 16px !important;
    border-radius: 16px !important;
  }

  .h360p-today-022a210 header {
    padding-bottom: 12px !important;
    margin-bottom: 10px !important;
  }

  .h360p-today-022a210 h2 {
    font-size: 15px !important;
  }

  .h360p-today-022a210 header button {
    font-size: 12px !important;
  }

  .h360p-appt-row-022a210 {
    grid-template-columns: 8px 52px minmax(0, 1fr) 68px !important;
    min-height: 46px !important;
    padding: 9px 0 !important;
  }

  .h360p-selected-card-022a210 {
    min-height: 292px !important;
    padding: 16px !important;
    border-radius: 16px !important;
  }

  .h360p-selected-card-022a210 header {
    gap: 12px !important;
    margin-bottom: 12px !important;
  }

  .h360p-large-avatar-022a210 {
    width: 72px !important;
    height: 72px !important;
    flex: 0 0 72px !important;
  }

  .h360p-selected-card-022a210 h3 {
    font-size: 17px !important;
  }

  .h360p-selected-card-022a210 dl {
    gap: 9px !important;
    padding: 12px 0 !important;
  }

  .h360p-selected-card-022a210 footer {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }

  .h360p-selected-card-022a210 footer button {
    height: 44px !important;
    border-radius: 12px !important;
  }
}

@media (min-width:1180px) and (max-width:1450px) {
  .h360p-page-022a210 {
    grid-template-columns: minmax(0, 1fr) 300px !important;
    column-gap: 14px !important;
    padding-inline: 14px !important;
  }

  .h360p-kpis-022a210 {
    gap: 10px !important;
  }

  .h360p-kpi-022a210 {
    min-height: 108px !important;
    padding: 14px 16px !important;
  }

  .h360p-kpi-copy-022a210 span {
    font-size: 12px !important;
  }

  .h360p-kpi-copy-022a210 strong {
    font-size: 25px !important;
  }

  .h360p-kpi-copy-022a210 small {
    font-size: 10px !important;
  }

  .h360p-toolbar-022a210 {
    grid-template-columns: minmax(220px, 1fr) 190px 145px 135px 104px !important;
    gap: 10px !important;
  }

  .h360p-table-card-022a210 th,
  .h360p-table-card-022a210 td {
    padding-inline: 12px !important;
  }
}

@media (max-width:1179px) {
  .h360p-titlebar-022a210 {
    display: none !important;
  }

  .h360p-page-022a210 {
    padding: 0 12px 16px !important;
  }

  .h360p-content-grid-022a210 {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .h360p-kpis-022a210 {
    direction: ltr !important;
  }

  .h360p-kpi-022a210 {
    direction: rtl !important;
  }
}
/* 0.22A.21.0.1_HEALTH360_PATIENTS_LAYOUT_REFERENCE_FIT_CSS_END */

/* 0.22A.21.0.2_HEALTH360_PATIENTS_REFERENCE_EXACT_LAYOUT_POLISH_CSS_START */
body:has(.h360p-page-022a210) {
  overflow-x: hidden !important;
}

body:has(.h360p-page-022a210) .main-content {
  overflow-x: hidden !important;
}

@media (min-width:1180px) {
  .h360p-page-022a210 {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    display: grid !important;
    direction: ltr !important;
    grid-template-columns: minmax(0, 1fr) clamp(286px, 21.5vw, 318px) !important;
    grid-template-areas:
      "kpis side"
      "main side" !important;
    column-gap: 16px !important;
    row-gap: 14px !important;
    align-items: start !important;
    padding: 0 14px 18px !important;
  }

  .h360p-titlebar-022a210 {
    display: none !important;
  }

  .h360p-kpis-022a210 {
    grid-area: kpis !important;
    width: 100% !important;
    min-width: 0 !important;
    display: grid !important;
    direction: ltr !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 0 !important;
  }

  .h360p-kpi-022a210 {
    min-width: 0 !important;
    min-height: 104px !important;
    height: 104px !important;
    padding: 14px 15px !important;
    border-radius: 15px !important;
    direction: rtl !important;
    grid-template-columns: minmax(0, 1fr) 54px !important;
    gap: 12px !important;
    overflow: hidden !important;
  }

  .h360p-kpi-icon-022a210 {
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    min-height: 54px !important;
    border-radius: 14px !important;
  }

  .h360p-kpi-icon-022a210 svg {
    width: 29px !important;
    height: 29px !important;
  }

  .h360p-kpi-copy-022a210 {
    min-width: 0 !important;
    align-items: flex-start !important;
    text-align: right !important;
    gap: 5px !important;
  }

  .h360p-kpi-copy-022a210 span {
    max-width: 100% !important;
    font-size: 12.5px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .h360p-kpi-copy-022a210 strong {
    max-width: 100% !important;
    font-size: clamp(24px, 2vw, 30px) !important;
    line-height: .98 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: clip !important;
  }

  .h360p-kpi-copy-022a210 small {
    max-width: 100% !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .h360p-content-grid-022a210 {
    display: contents !important;
  }

  .h360p-main-022a210 {
    grid-area: main !important;
    direction: rtl !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    display: grid !important;
    gap: 12px !important;
    overflow: visible !important;
  }

  .h360p-side-022a210 {
    grid-area: side !important;
    direction: rtl !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    align-content: start !important;
    overflow: visible !important;
  }

  .h360p-toolbar-022a210 {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    display: grid !important;
    direction: rtl !important;
    grid-template-columns: minmax(190px, 1.2fr) minmax(140px, .85fr) minmax(112px, .7fr) minmax(112px, .7fr) 92px !important;
    gap: 10px !important;
    padding: 13px 14px !important;
    border-radius: 16px !important;
    align-items: end !important;
    overflow: hidden !important;
  }

  .h360p-toolbar-022a210 label {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .h360p-toolbar-022a210 input,
  .h360p-toolbar-022a210 select,
  .h360p-export-022a210 {
    width: 100% !important;
    min-width: 0 !important;
    height: 42px !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    box-sizing: border-box !important;
  }

  .h360p-table-card-022a210 {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    min-height: 300px !important;
    box-sizing: border-box !important;
  }

  .h360p-table-wrap-022a210 {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
  }

  .h360p-table-022a210,
  .h360p-table-card-022a210 table {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
  }

  .h360p-table-card-022a210 th,
  .h360p-table-card-022a210 td {
    padding: 12px 10px !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    vertical-align: middle !important;
  }

  .h360p-table-card-022a210 th {
    font-size: 11.5px !important;
  }

  .h360p-table-card-022a210 td {
    font-size: 12px !important;
  }

  .h360p-table-card-022a210 td strong,
  .h360p-table-card-022a210 td small,
  .h360p-table-card-022a210 td span {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .h360p-table-card-022a210 footer {
    min-height: 54px !important;
    padding: 10px 12px !important;
    gap: 8px !important;
    overflow: hidden !important;
  }

  .h360p-pagination-022a210,
  .h360p-page-buttons-022a210 {
    min-width: 0 !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
  }

  .h360p-page-btn-022a210,
  .h360p-pagination-022a210 button {
    width: 36px !important;
    min-width: 36px !important;
    height: 34px !important;
    border-radius: 10px !important;
  }

  .h360p-today-022a210 {
    min-height: 248px !important;
    padding: 16px !important;
    border-radius: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .h360p-today-022a210 header {
    padding-bottom: 12px !important;
    margin-bottom: 10px !important;
  }

  .h360p-today-022a210 h2 {
    font-size: 16px !important;
  }

  .h360p-empty-022a210 {
    min-height: 72px !important;
    font-size: 13px !important;
  }

  .h360p-selected-card-022a210 {
    min-height: 286px !important;
    max-height: none !important;
    padding: 16px !important;
    border-radius: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .h360p-selected-card-022a210 header {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 72px !important;
    gap: 12px !important;
    align-items: center !important;
    margin-bottom: 12px !important;
  }

  .h360p-large-avatar-022a210 {
    width: 72px !important;
    height: 72px !important;
    min-width: 72px !important;
    border-radius: 50% !important;
  }

  .h360p-selected-card-022a210 h3 {
    font-size: 16px !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .h360p-selected-card-022a210 dl {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px 12px !important;
    padding: 12px 0 !important;
  }

  .h360p-selected-card-022a210 footer {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    margin-top: 12px !important;
  }

  .h360p-selected-card-022a210 footer button {
    height: 42px !important;
    min-width: 0 !important;
    border-radius: 12px !important;
    font-size: 13px !important;
  }
}

@media (min-width:1180px) and (max-width:1450px) {
  .h360p-page-022a210 {
    grid-template-columns: minmax(0, 1fr) 286px !important;
    column-gap: 12px !important;
    padding-inline: 10px !important;
  }

  .h360p-kpis-022a210 {
    gap: 10px !important;
  }

  .h360p-kpi-022a210 {
    height: 96px !important;
    min-height: 96px !important;
    padding: 12px 13px !important;
    grid-template-columns: minmax(0, 1fr) 48px !important;
    gap: 9px !important;
  }

  .h360p-kpi-icon-022a210 {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    border-radius: 13px !important;
  }

  .h360p-kpi-icon-022a210 svg {
    width: 26px !important;
    height: 26px !important;
  }

  .h360p-kpi-copy-022a210 span {
    font-size: 11px !important;
  }

  .h360p-kpi-copy-022a210 strong {
    font-size: 23px !important;
  }

  .h360p-kpi-copy-022a210 small {
    font-size: 9px !important;
  }

  .h360p-toolbar-022a210 {
    grid-template-columns: minmax(170px, 1fr) minmax(126px, .8fr) minmax(104px, .62fr) minmax(104px, .62fr) 82px !important;
    gap: 8px !important;
    padding: 12px !important;
  }

  .h360p-table-card-022a210 th,
  .h360p-table-card-022a210 td {
    padding-inline: 8px !important;
    font-size: 11.5px !important;
  }

  .h360p-selected-card-022a210 {
    padding: 14px !important;
  }

  .h360p-selected-card-022a210 footer button {
    font-size: 12px !important;
  }
}

@media (max-width:1179px) {
  body:has(.h360p-page-022a210) {
    overflow-x: hidden !important;
  }

  .h360p-page-022a210 {
    padding: 0 12px 16px !important;
    overflow-x: hidden !important;
  }

  .h360p-titlebar-022a210 {
    display: none !important;
  }

  .h360p-content-grid-022a210 {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .h360p-toolbar-022a210,
  .h360p-table-card-022a210,
  .h360p-table-wrap-022a210 {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .h360p-table-022a210,
  .h360p-table-card-022a210 table {
    min-width: 0 !important;
    width: 100% !important;
    table-layout: fixed !important;
  }
}
/* 0.22A.21.0.2_HEALTH360_PATIENTS_REFERENCE_EXACT_LAYOUT_POLISH_CSS_END */

/* 0.22A.21.0.3_PATIENT_VIEW_FILE_BUTTON_FIX_CSS_START */
.h360pf-page-022a2103 {
  direction: rtl;
  display: grid;
  gap: 16px;
  padding: 0 14px 18px;
  max-width: 100%;
  overflow-x: hidden;
}

.h360pf-hero-022a2103,
.h360pf-panel-022a2103,
.h360pf-stat-022a2103 {
  background: #fff;
  border: 1px solid rgba(207, 220, 235, .86);
  box-shadow: 0 12px 30px rgba(21, 63, 96, .055);
}

.h360pf-hero-022a2103 {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 16px;
  align-items: center;
  border-radius: 18px;
  padding: 16px;
}

.h360pf-back-022a2103,
.h360pf-outline-022a2103,
.h360pf-primary-022a2103 {
  height: 44px;
  border-radius: 13px;
  font-weight: 900;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.h360pf-back-022a2103,
.h360pf-outline-022a2103 {
  background: #fff;
  color: #287df0;
  border: 1px solid #cfe0ff;
}

.h360pf-primary-022a2103 {
  background: #2f80ed;
  color: #fff;
  border: 1px solid #2f80ed;
  box-shadow: 0 12px 24px rgba(47,128,237,.18);
}

.h360pf-page-022a2103 svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.h360pf-patient-head-022a2103 {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.h360pf-avatar-022a2103 {
  width: 72px;
  height: 72px;
  border-radius: 22px;
  background: #eaf4ff;
  color: #287df0;
  display: grid;
  place-items: center;
  font-size: 22px;
  font-weight: 950;
  border: 1px solid #cfe0ff;
  flex: 0 0 72px;
}

.h360pf-patient-head-022a2103 h1 {
  margin: 0;
  font-size: 24px;
  line-height: 1.15;
  color: #07142b;
  font-weight: 950;
}

.h360pf-patient-head-022a2103 p {
  margin: 4px 0 0;
  color: #70809a;
  font-size: 13px;
}

.h360pf-hero-actions-022a2103 {
  display: flex;
  gap: 10px;
  align-items: center;
}

.h360pf-stats-022a2103 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.h360pf-stat-022a2103 {
  min-height: 96px;
  border-radius: 16px;
  padding: 16px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 54px;
  gap: 12px;
  align-items: center;
}

.h360pf-stat-022a2103 > span {
  width: 54px;
  height: 54px;
  border-radius: 15px;
  display: grid;
  place-items: center;
}

.h360pf-stat-022a2103.tone-green > span { background:#e5f9f1; color:#11a86a; }
.h360pf-stat-022a2103.tone-orange > span { background:#fff0df; color:#ff9415; }
.h360pf-stat-022a2103.tone-purple > span { background:#f1e5ff; color:#9657ff; }
.h360pf-stat-022a2103.tone-blue > span { background:#eaf4ff; color:#2f80ed; }

.h360pf-stat-022a2103 small {
  color: #70809a;
  font-size: 12px;
  font-weight: 800;
}

.h360pf-stat-022a2103 strong {
  display: block;
  margin-top: 5px;
  color: #07142b;
  font-size: 24px;
  line-height: 1;
  font-weight: 950;
}

.h360pf-grid-022a2103 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.h360pf-panel-022a2103 {
  border-radius: 16px;
  padding: 16px;
  min-width: 0;
  overflow: hidden;
}

.h360pf-panel-022a2103 header {
  border-bottom: 1px solid #e7edf6;
  padding-bottom: 10px;
  margin-bottom: 12px;
}

.h360pf-panel-022a2103 h2 {
  margin: 0;
  font-size: 16px;
  color: #07142b;
  font-weight: 950;
}

.h360pf-panel-022a2103 p {
  margin: 4px 0 0;
  color: #70809a;
  font-size: 12px;
}

.h360pf-wide-022a2103 {
  grid-column: 1 / -1;
}

.h360pf-dl-022a2103 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
  margin: 0;
}

.h360pf-dl-022a2103 div,
.h360pf-list-row-022a2103 {
  min-width: 0;
  border-bottom: 1px solid #edf2f8;
  padding: 8px 0;
}

.h360pf-dl-022a2103 dt {
  color: #70809a;
  font-size: 12px;
  font-weight: 800;
}

.h360pf-dl-022a2103 dd {
  margin: 4px 0 0;
  color: #07142b;
  font-size: 13px;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.h360pf-list-022a2103 {
  display: grid;
  gap: 2px;
}

.h360pf-list-row-022a2103 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.h360pf-list-row-022a2103 strong {
  display: block;
  color: #07142b;
  font-size: 13px;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.h360pf-list-row-022a2103 small {
  display: block;
  margin-top: 3px;
  color: #70809a;
  font-size: 11px;
}

.h360pf-list-row-022a2103 em {
  font-style: normal;
  color: #287df0;
  font-weight: 900;
  font-size: 12px;
  white-space: nowrap;
}

.h360pf-empty-022a2103 {
  min-height: 70px;
  display: grid;
  place-items: center;
  color: #8a97aa;
  font-size: 13px;
  text-align: center;
}

@media (max-width: 980px) {
  .h360pf-hero-022a2103,
  .h360pf-stats-022a2103,
  .h360pf-grid-022a2103 {
    grid-template-columns: 1fr;
  }

  .h360pf-hero-actions-022a2103 {
    flex-wrap: wrap;
  }

  .h360pf-hero-actions-022a2103 button {
    flex: 1 1 180px;
  }
}
/* 0.22A.21.0.3_PATIENT_VIEW_FILE_BUTTON_FIX_CSS_END */

/* 0.22A.22.0.1_IQD_GLOBAL_FINANCIAL_CURRENCY_FINAL_FIX_CSS_START */
.currency-iqd,
[data-currency="IQD"],
.iqd-currency-badge-022a2201 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .28rem;
  white-space: nowrap;
  font-weight: 900;
  letter-spacing: 0;
}

.iqd-currency-badge-022a2201 {
  min-height: 24px;
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef8f3;
  color: #087a4b;
  border: 1px solid #caecdc;
}

input[name="currency"][value="IQD"],
select[name="clinic.currency"] {
  font-weight: 900;
}
/* 0.22A.22.0.1_IQD_GLOBAL_FINANCIAL_CURRENCY_FINAL_FIX_CSS_END */

/* 0.22A.22.2_APPOINTMENTS_ADD_DENTAL_CHAIR_CSS_START */
.chair-create-panel-action-022a222 {
  min-height: 40px;
  border-radius: 12px;
  padding-inline: 14px;
  font-weight: 900;
}

.chair-empty-create-022a222 {
  min-height: 210px;
  border: 1px dashed rgba(154, 171, 234, .72);
  border-radius: 18px;
  background:
    radial-gradient(circle at 50% 18%, rgba(47, 128, 237, .08), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(248,251,255,.94));
  padding: 22px;
}

.chair-empty-plus-022a222 {
  width: 72px;
  height: 72px;
  border-radius: 24px;
  display: grid;
  place-items: center;
  border: 1px solid #cfe0ff;
  background: #eef5ff;
  color: #2f80ed;
  box-shadow: 0 14px 30px rgba(47, 128, 237, .13);
  cursor: pointer;
}

.chair-empty-plus-022a222:hover,
.chair-create-panel-action-022a222:hover {
  transform: translateY(-1px);
}

.chair-empty-plus-022a222 svg {
  width: 34px;
  height: 34px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.chair-empty-create-022a222 h3 {
  margin: 12px 0 4px;
  color: #07142b;
  font-size: 18px;
  font-weight: 950;
}

.chair-empty-create-022a222 p {
  max-width: 360px;
  margin: 0;
  color: #70809a;
  font-size: 13px;
  line-height: 1.8;
}

.chair-create-form-022a222 {
  gap: 14px;
}

.chair-create-form-022a222 .span-2 {
  grid-column: 1 / -1;
}

.chair-create-help-022a222 {
  margin: 8px 0 0;
  color: #70809a;
  font-size: 13px;
  line-height: 1.8;
}

.chair-create-help-022a222 strong {
  color: #0f2452;
}

@media (max-width: 720px) {
  .chair-create-panel-action-022a222 {
    width: 100%;
  }
  .chair-empty-plus-022a222 {
    width: 64px;
    height: 64px;
    border-radius: 20px;
  }
}
/* 0.22A.22.2_APPOINTMENTS_ADD_DENTAL_CHAIR_CSS_END */

/* 0.22A.22.2.1_APPOINTMENTS_ADD_CHAIR_FORCE_FUNCTIONAL_CSS_START */
.chair-force-empty-022a2221 {
  min-height: 240px;
  width: 100%;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  text-align: center;
  border: 1px dashed rgba(154, 171, 234, .72);
  border-radius: 22px;
  background:
    radial-gradient(circle at 50% 18%, rgba(47, 128, 237, .10), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,251,255,.96));
  padding: 24px;
}

.chair-force-plus-022a2221 {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 4px solid #a9b8df;
  background: #ffffff;
  color: #2f80ed;
  font-size: 42px;
  line-height: 1;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 16px 32px rgba(47, 128, 237, .13);
}

.chair-force-plus-022a2221:hover,
.chair-force-button-022a2221:hover {
  transform: translateY(-1px);
}

.chair-force-empty-022a2221 h3 {
  margin: 8px 0 0;
  color: #07142b;
  font-size: 18px;
  font-weight: 950;
}

.chair-force-empty-022a2221 p {
  max-width: 390px;
  margin: 0;
  color: #70809a;
  font-size: 13px;
  line-height: 1.8;
}

.chair-force-button-022a2221 {
  min-width: 170px;
  height: 44px;
  border-radius: 13px;
  font-weight: 950;
  margin-top: 4px;
}

.chair-force-form-022a2221 {
  gap: 14px;
}

.chair-force-form-022a2221 .span-2 {
  grid-column: 1 / -1;
}

@media (max-width: 720px) {
  .chair-force-empty-022a2221 {
    min-height: 220px;
    padding: 18px;
  }

  .chair-force-button-022a2221 {
    width: 100%;
  }
}
/* 0.22A.22.2.1_APPOINTMENTS_ADD_CHAIR_FORCE_FUNCTIONAL_CSS_END */

/* 0.22A.23.0_HEALTH360_TREATMENT_PLAN_REFERENCE_REDESIGN_CSS_START */
.h360tr-page-022a230 {
  --h360tr-blue:#2f80ed;
  --h360tr-navy:#061936;
  --h360tr-muted:#70809a;
  --h360tr-line:#dce7f5;
  --h360tr-bg:#f4f8fd;
  --h360tr-card:#ffffff;
  direction: rtl;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 236px;
  gap: 18px;
  min-height: calc(100vh - 120px);
  background: var(--h360tr-bg);
  padding: 0 0 18px 18px;
}

.h360tr-main-022a230 {
  min-width: 0;
  display: grid;
  gap: 14px;
}

.h360tr-top-022a230 {
  display: grid;
  justify-items: end;
  gap: 8px;
  padding: 8px 2px 0;
}

.h360tr-top-022a230 div {
  display: flex;
  gap: 8px;
  color: #8291aa;
  font-size: 12px;
}

.h360tr-top-022a230 h1 {
  margin: 0;
  color: var(--h360tr-navy);
  font-size: 22px;
  font-weight: 950;
}

.h360tr-grid-022a230 {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.28fr);
  gap: 14px;
  align-items: stretch;
}

.h360tr-card {
  background: var(--h360tr-card);
  border: 1px solid var(--h360tr-line);
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(17, 52, 86, .055);
  overflow: hidden;
}

.h360tr-card header {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 18px 8px;
}

.h360tr-card h2 {
  margin: 0;
  color: var(--h360tr-navy);
  font-size: 15px;
  font-weight: 950;
}

.h360tr-card svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.h360tr-patient-card-022a230 {
  min-height: 250px;
  padding: 22px 22px 18px;
}

.h360tr-patient-main-022a230 {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  justify-items: end;
  border-bottom: 1px solid #edf2f8;
  padding-bottom: 18px;
}

.h360tr-avatar-022a230 {
  width: 92px;
  height: 92px;
  border-radius: 28px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #e9f4ff, #f8fbff);
  color: var(--h360tr-blue);
  border: 1px solid #cfe0ff;
  box-shadow: inset 0 0 0 5px #f4f8ff;
  font-size: 25px;
  font-weight: 950;
}

.h360tr-patient-main-022a230 h2 {
  margin: 0;
  display: flex;
  gap: 8px;
  align-items: center;
  color: var(--h360tr-navy);
  font-size: 21px;
  font-weight: 950;
}

.h360tr-patient-main-022a230 h2 span {
  color: #2f80ed;
  font-size: 12px;
}

.h360tr-patient-main-022a230 p {
  margin: 8px 0 0;
  color: #8291aa;
  font-weight: 800;
}

.h360tr-patient-info-022a230 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px 18px;
  padding-top: 18px;
}

.h360tr-patient-info-022a230 div {
  min-width: 0;
  display: grid;
  justify-items: center;
  gap: 5px;
  color: #93a1b8;
  text-align: center;
}

.h360tr-patient-info-022a230 span {
  font-size: 12px;
  color: #7a88a0;
}

.h360tr-patient-info-022a230 strong {
  color: var(--h360tr-navy);
  font-size: 12.5px;
  font-weight: 900;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.h360tr-odontogram-card-022a230 {
  min-height: 250px;
}

.h360tr-odontogram-022a230 {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) 74px;
  gap: 12px;
  padding: 8px 16px 18px;
  direction: ltr;
}

.h360tr-tooth-tabs-022a230 {
  display: grid;
  gap: 7px;
  align-content: center;
  direction: rtl;
}

.h360tr-tooth-tabs-022a230 button {
  min-height: 46px;
  border-radius: 10px;
  border: 1px solid #d8e5f6;
  background: #fff;
  color: #6f7f99;
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 800;
}

.h360tr-tooth-tabs-022a230 button.active {
  background: #eef6ff;
  color: #2f80ed;
  border-color: #bfd8ff;
}

.h360tr-teeth-stage-022a230 {
  min-width: 0;
  display: grid;
  gap: 8px;
  align-content: center;
}

.h360tr-teeth-row-022a230 {
  display: grid;
  grid-template-columns: repeat(16, minmax(22px, 1fr));
  gap: 5px;
  direction: ltr;
  align-items: end;
}

.h360tr-tooth-022a230 {
  min-width: 0;
  border: 0;
  background: transparent;
  color: #8ca0bf;
  display: grid;
  place-items: center;
  gap: 2px;
  padding: 0;
  cursor: pointer;
  position: relative;
}

.h360tr-tooth-022a230 span {
  font-size: 10px;
  font-weight: 900;
  color: #596b86;
}

.h360tr-tooth-022a230 svg {
  width: 28px;
  height: 38px;
  fill: #fff;
  stroke: #9fb4d4;
  stroke-width: 1.4;
  filter: drop-shadow(0 4px 6px rgba(46, 78, 121, .07));
}

.h360tr-tooth-022a230 i {
  position: absolute;
  bottom: 10px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: currentColor;
  opacity: .22;
}

.h360tr-tooth-022a230.tone-blue { color:#2f80ed; }
.h360tr-tooth-022a230.tone-green { color:#10a66f; }
.h360tr-tooth-022a230.tone-orange { color:#ff8a1d; }
.h360tr-tooth-022a230.tone-red { color:#e84b5b; }
.h360tr-tooth-022a230.tone-purple { color:#8d55ff; }
.h360tr-tooth-022a230.tone-gray { color:#8d98aa; }

.h360tr-tooth-022a230:not(.tone-clean) svg {
  stroke: currentColor;
  fill: #fff;
}

.h360tr-jaw-label-022a230 {
  text-align: center;
  color: #71809a;
  font-weight: 900;
  font-size: 11px;
  direction: rtl;
}

.h360tr-legend-022a230 {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 7px;
  align-content: center;
  direction: rtl;
  color: #52647e;
  font-size: 11px;
  font-weight: 900;
}

.h360tr-legend-022a230 li {
  display: flex;
  align-items: center;
  gap: 7px;
}

.h360tr-legend-022a230 b {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}

.h360tr-legend-022a230 .blue { background:#2f80ed; }
.h360tr-legend-022a230 .green { background:#10a66f; }
.h360tr-legend-022a230 .orange { background:#ff8a1d; }
.h360tr-legend-022a230 .red { background:#e84b5b; }
.h360tr-legend-022a230 .purple { background:#8d55ff; }
.h360tr-legend-022a230 .gray { background:#8d98aa; }

.h360tr-plan-card-022a230,
.h360tr-notes-022a230,
.h360tr-docs-022a230,
.h360tr-cost-022a230 {
  min-height: 214px;
}

.h360tr-plan-card-022a230 header button,
.h360tr-docs-022a230 header button,
.h360tr-cost-022a230 footer button,
.h360tr-link-022a230 {
  border: 0;
  background: transparent;
  color: #2f80ed;
  font-weight: 950;
  cursor: pointer;
}

.h360tr-plan-line-022a230 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 14px 22px 12px;
  position: relative;
}

.h360tr-plan-line-022a230::before {
  content: "";
  position: absolute;
  left: 30px;
  right: 30px;
  top: 28px;
  height: 2px;
  background: linear-gradient(90deg, #ffb16b, #17b98f, #8d55ff, #2f80ed);
  opacity: .48;
}

.h360tr-step-022a230 {
  position: relative;
  z-index: 1;
  min-height: 116px;
  border: 1px solid #dbe7f6;
  border-radius: 12px;
  padding: 32px 12px 12px;
  display: grid;
  gap: 6px;
  background: #fff;
}

.h360tr-step-number-022a230 {
  position: absolute;
  top: -3px;
  inset-inline-end: 14px;
  width: 33px;
  height: 33px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #fff;
  border: 2px solid currentColor;
  font-weight: 950;
}

.h360tr-step-022a230 strong {
  color: var(--h360tr-navy);
  font-size: 13px;
  font-weight: 950;
}

.h360tr-step-022a230 small,
.h360tr-step-022a230 span {
  color: #70809a;
  font-size: 11px;
  font-weight: 800;
}

.h360tr-step-022a230.tone-blue { color:#2f80ed; background:#f4f9ff; border-color:#cfe0ff; }
.h360tr-step-022a230.tone-green { color:#10a66f; background:#f1fbf6; border-color:#cbeee0; }
.h360tr-step-022a230.tone-orange { color:#ff8a1d; background:#fff7ef; border-color:#ffddbd; }
.h360tr-step-022a230.tone-purple { color:#8d55ff; background:#f8f4ff; border-color:#dfd1ff; }

.h360tr-plan-card-022a230 footer {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding-bottom: 10px;
}

.h360tr-notes-022a230 ul {
  margin: 0 20px;
  padding: 8px 20px 4px;
  color: #52647e;
  line-height: 1.9;
  font-size: 12.5px;
}

.h360tr-notes-022a230 footer {
  padding: 10px 18px 14px;
  color: #8291aa;
  font-size: 11px;
  border-top: 1px solid #edf2f8;
}

.h360tr-docs-grid-022a230 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  padding: 12px 18px 18px;
}

.h360tr-doc-022a230,
.h360tr-upload-tile-022a230 {
  min-height: 126px;
  border: 1px solid #dce7f5;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  display: grid;
  align-content: start;
  text-align: center;
}

.h360tr-doc-preview-022a230,
.h360tr-upload-tile-022a230 {
  place-items: center;
}

.h360tr-doc-preview-022a230 {
  height: 70px;
  display: grid;
  background: linear-gradient(135deg, #eef4fb, #dce7f5);
  color: #2f80ed;
}

.h360tr-doc-022a230 strong {
  padding-top: 8px;
  color: var(--h360tr-navy);
  font-size: 12px;
}

.h360tr-doc-022a230 small,
.h360tr-doc-022a230 span,
.h360tr-upload-tile-022a230 span {
  color: #70809a;
  font-size: 11px;
}

.h360tr-upload-tile-022a230 {
  border-style: dashed;
  color: #70809a;
  gap: 7px;
  grid-column: span 4;
}

.h360tr-cost-grid-022a230 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 12px 18px;
}

.h360tr-cost-grid-022a230 div {
  min-height: 72px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  gap: 5px;
  background: #f4f9ff;
}

.h360tr-cost-grid-022a230 div:nth-child(2) { background:#eefaf4; }
.h360tr-cost-grid-022a230 div:nth-child(3) { background:#fff7ef; }

.h360tr-cost-grid-022a230 span {
  color: #70809a;
  font-size: 11px;
  font-weight: 800;
}

.h360tr-cost-grid-022a230 strong {
  color: var(--h360tr-blue);
  font-size: 18px;
  font-weight: 950;
}

.h360tr-progress-022a230 {
  height: 16px;
  margin: 0 18px;
  background: #e9eef5;
  border-radius: 999px;
  overflow: hidden;
}

.h360tr-progress-022a230 i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #0fb98b, #14c8a0);
  border-radius: inherit;
}

.h360tr-cost-022a230 footer {
  padding: 12px 18px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.h360tr-cost-022a230 footer span {
  background: #12b886;
  color: #fff;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 950;
}

.h360tr-empty-022a230 {
  min-height: 122px;
  display: grid;
  place-items: center;
  color: #8291aa;
  font-size: 13px;
}

.h360tr-rail-022a230 {
  min-height: calc(100vh - 120px);
  background: linear-gradient(180deg, #075c82, #053f68 58%, #06395d);
  color: #fff;
  border-radius: 0 0 0 22px;
  padding: 26px 18px;
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: 24px;
  box-shadow: 0 18px 36px rgba(3, 56, 90, .2);
}

.h360tr-logo-022a230 {
  display: flex;
  align-items: center;
  gap: 12px;
}

.h360tr-logo-022a230 svg {
  width: 42px;
  height: 42px;
}

.h360tr-logo-022a230 strong {
  display: block;
  font-size: 20px;
  font-weight: 950;
}

.h360tr-logo-022a230 span {
  display: block;
  opacity: .88;
  font-size: 12px;
  margin-top: 4px;
}

.h360tr-rail-022a230 nav {
  display: grid;
  gap: 8px;
}

.h360tr-rail-022a230 nav button {
  min-height: 44px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: rgba(255,255,255,.86);
  font-weight: 900;
  text-align: right;
  padding: 0 14px;
}

.h360tr-rail-022a230 nav button.active,
.h360tr-rail-022a230 nav button:hover {
  background: rgba(255,255,255,.13);
  color: #fff;
}

.h360tr-rail-card-022a230 {
  align-self: end;
  min-height: 170px;
  border-radius: 16px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.12);
  display: grid;
  place-items: center;
  text-align: center;
  gap: 8px;
  padding: 18px 12px;
}

.h360tr-rail-card-022a230 svg {
  width: 52px;
  height: 52px;
}

.h360tr-rail-card-022a230 strong {
  font-size: 14px;
  font-weight: 950;
}

.h360tr-rail-card-022a230 span {
  font-size: 11px;
  opacity: .82;
}

@media (max-width: 1260px) {
  .h360tr-page-022a230 {
    grid-template-columns: 1fr;
    padding-inline: 12px;
  }
  .h360tr-rail-022a230 {
    display: none;
  }
}

@media (max-width: 980px) {
  .h360tr-grid-022a230,
  .h360tr-patient-info-022a230,
  .h360tr-plan-line-022a230,
  .h360tr-cost-grid-022a230 {
    grid-template-columns: 1fr;
  }
  .h360tr-odontogram-022a230 {
    grid-template-columns: 1fr;
  }
  .h360tr-tooth-tabs-022a230 {
    grid-template-columns: repeat(4, 1fr);
  }
  .h360tr-legend-022a230 {
    grid-template-columns: repeat(3, 1fr);
  }
  .h360tr-docs-grid-022a230 {
    grid-template-columns: 1fr 1fr;
  }
  .h360tr-upload-tile-022a230 {
    grid-column: 1 / -1;
  }
}
/* 0.22A.23.0_HEALTH360_TREATMENT_PLAN_REFERENCE_REDESIGN_CSS_END */

/* 0.22A.23.0.1_TREATMENT_PLANS_NAV_REFERENCE_TARGET_FIX_CSS_START */
.h360tr-page-022a230 {
  grid-template-columns: minmax(0, 1fr) !important;
  padding: 0 14px 18px !important;
  background: transparent !important;
}

.h360tr-rail-022a230 {
  display: none !important;
}

.h360tr-switcher-022a2301 {
  min-height: 76px;
  background: #fff;
  border: 1px solid #dce7f5;
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(17, 52, 86, .055);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px) auto;
  gap: 14px;
  align-items: center;
  padding: 14px 18px;
}

.h360tr-switcher-022a2301 strong {
  display: block;
  color: #061936;
  font-size: 16px;
  font-weight: 950;
}

.h360tr-switcher-022a2301 span {
  display: block;
  color: #70809a;
  font-size: 12px;
  margin-top: 4px;
}

.h360tr-switcher-022a2301 label {
  display: grid;
  gap: 6px;
  color: #70809a;
  font-size: 12px;
  font-weight: 900;
}

.h360tr-switcher-022a2301 select {
  height: 42px;
  border-radius: 12px;
  border: 1px solid #dce7f5;
  padding: 0 12px;
  background: #f8fbff;
  color: #061936;
  font-weight: 900;
}

.h360tr-switcher-022a2301 button,
.h360tr-nav-empty-022a2301 button {
  min-height: 42px;
  border-radius: 12px;
  border: 1px solid #cfe0ff;
  background: #fff;
  color: #2f80ed;
  font-weight: 950;
  padding: 0 14px;
  cursor: pointer;
}

.h360tr-nav-empty-022a2301 {
  min-height: 320px;
  background: #fff;
  border: 1px solid #dce7f5;
  border-radius: 18px;
  display: grid;
  place-items: center;
  gap: 14px;
  text-align: center;
  padding: 28px;
}

.h360tr-nav-empty-022a2301 strong {
  color: #061936;
  font-size: 22px;
  font-weight: 950;
}

.h360tr-nav-empty-022a2301 p {
  color: #70809a;
}

@media (max-width: 980px) {
  .h360tr-switcher-022a2301 {
    grid-template-columns: 1fr;
  }
}
/* 0.22A.23.0.1_TREATMENT_PLANS_NAV_REFERENCE_TARGET_FIX_CSS_END */

/* 0.22A.23.0.2_HEALTH360_TREATMENT_PAGE_REFERENCE_PIXEL_FINAL_CSS_START */
.h360tr-switcher-022a2301,
.h360tr-top-022a230,
.h360tr-rail-022a230 {
  display: none !important;
}

.h360ex-page {
  --blue:#2f80ed;
  --navy:#061936;
  --muted:#72829a;
  --line:#dce7f5;
  --soft:#f5f8fd;
  --card:#fff;
  direction: rtl;
  width: 100%;
  padding: 8px 10px 26px;
  background: transparent;
}

.h360ex-grid {
  display: grid;
  grid-template-columns: minmax(420px, .86fr) minmax(560px, 1.14fr);
  grid-template-areas:
    "patient odont"
    "plan notes"
    "docs cost";
  gap: 14px;
  align-items: stretch;
}

.h360ex-patient-area { grid-area: patient; }
.h360ex-odont-area { grid-area: odont; }
.h360ex-plan-area { grid-area: plan; }
.h360ex-notes-area { grid-area: notes; }
.h360ex-docs-area { grid-area: docs; }
.h360ex-cost-area { grid-area: cost; }

.h360ex-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 12px 30px rgba(17, 52, 86, .055);
  overflow: hidden;
}

.h360ex-card header {
  height: 50px;
  padding: 14px 18px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.h360ex-card h2 {
  margin: 0;
  color: var(--navy);
  font-size: 15px;
  font-weight: 950;
}

.h360ex-card svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.h360ex-patient-card,
.h360ex-odontogram-card {
  height: 252px;
}

.h360ex-patient-card {
  padding: 22px 22px 16px;
}

.h360ex-patient-top {
  height: 104px;
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  border-bottom: 1px solid #edf2f8;
}

.h360ex-avatar {
  position: relative;
  width: 96px;
  height: 96px;
  border-radius: 34px;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 52% 38%, #ffffff 0 0, transparent 0),
    linear-gradient(135deg, #e7f1ff, #f8fbff);
  color: var(--blue);
  border: 1px solid #cfe0ff;
  box-shadow: inset 0 0 0 6px #f4f8ff;
  font-size: 26px;
  font-weight: 950;
}

.h360ex-avatar button {
  position: absolute;
  inset-inline-start: 3px;
  bottom: 3px;
  width: 26px;
  height: 26px;
  border: 1px solid #d8e5f6;
  border-radius: 50%;
  background: #fff;
  color: #72829a;
}

.h360ex-patient-name {
  min-width: 0;
}

.h360ex-patient-name h2 {
  margin: 0;
  color: var(--navy);
  font-size: 21px;
  font-weight: 950;
  display: flex;
  align-items: center;
  gap: 8px;
}

.h360ex-patient-name h2 span {
  color: var(--blue);
  font-size: 13px;
}

.h360ex-patient-name p {
  margin: 10px 0 0;
  color: #8291aa;
  font-size: 13px;
  font-weight: 850;
}

.h360ex-patient-metrics {
  height: 110px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 14px;
  padding-top: 16px;
}

.h360ex-patient-metrics div {
  min-width: 0;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 5px;
  text-align: center;
}

.h360ex-patient-metrics svg {
  color: #97a6bd;
  width: 19px;
  height: 19px;
}

.h360ex-patient-metrics span {
  color: #7a88a0;
  font-size: 11px;
  font-weight: 850;
}

.h360ex-patient-metrics strong {
  max-width: 100%;
  color: var(--navy);
  font-size: 12px;
  font-weight: 950;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.h360ex-odontogram-card header {
  padding-inline: 22px;
}

.h360ex-head-icon {
  color: #6c7b92;
}

.h360ex-odontogram-body {
  height: 202px;
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) 76px;
  gap: 12px;
  padding: 0 18px 16px;
  direction: ltr;
}

.h360ex-tooth-tabs {
  display: grid;
  gap: 7px;
  align-content: center;
  direction: rtl;
}

.h360ex-tooth-tabs button {
  height: 45px;
  border-radius: 10px;
  border: 1px solid #d8e5f6;
  background: #fff;
  color: #6f7f99;
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 850;
}

.h360ex-tooth-tabs button.active {
  background: #eef6ff;
  color: #2f80ed;
  border-color: #bfd8ff;
}

.h360ex-teeth-stage {
  min-width: 0;
  display: grid;
  align-content: center;
  gap: 7px;
}

.h360ex-teeth-row {
  display: grid;
  grid-template-columns: repeat(16, minmax(20px, 1fr));
  gap: 5px;
  direction: ltr;
}

.h360ex-tooth {
  position: relative;
  border: 0;
  background: transparent;
  display: grid;
  place-items: center;
  gap: 1px;
  color: #91a6c5;
  padding: 0;
  cursor: pointer;
}

.h360ex-tooth span {
  color: #52647e;
  font-size: 10px;
  font-weight: 950;
}

.h360ex-tooth svg {
  width: 28px;
  height: 38px;
  fill: #fff;
  stroke: #9fb4d4;
  stroke-width: 1.45;
  filter: drop-shadow(0 4px 6px rgba(46, 78, 121, .06));
}

.h360ex-tooth i {
  position: absolute;
  bottom: 10px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: currentColor;
  opacity: .22;
}

.h360ex-tooth.tone-blue { color:#2f80ed; }
.h360ex-tooth.tone-green { color:#10a66f; }
.h360ex-tooth.tone-orange { color:#ff8a1d; }
.h360ex-tooth.tone-red { color:#e84b5b; }
.h360ex-tooth.tone-purple { color:#8d55ff; }
.h360ex-tooth.tone-gray { color:#8d98aa; }
.h360ex-tooth:not(.tone-clean) svg { stroke: currentColor; }

.h360ex-jaw-label {
  text-align: center;
  color: #71809a;
  font-weight: 900;
  font-size: 11px;
  direction: rtl;
}

.h360ex-legend {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  align-content: center;
  gap: 7px;
  direction: rtl;
  color: #52647e;
  font-size: 11px;
  font-weight: 900;
}

.h360ex-legend li {
  display: flex;
  align-items: center;
  gap: 7px;
}

.h360ex-legend b {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}

.h360ex-legend .blue { background:#2f80ed; }
.h360ex-legend .green { background:#10a66f; }
.h360ex-legend .orange { background:#ff8a1d; }
.h360ex-legend .red { background:#e84b5b; }
.h360ex-legend .purple { background:#8d55ff; }
.h360ex-legend .gray { background:#8d98aa; }

.h360ex-plan-card,
.h360ex-notes-card,
.h360ex-docs-card,
.h360ex-cost-card {
  height: 244px;
}

.h360ex-plan-track {
  position: relative;
  min-height: 142px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 18px 22px 10px;
}

.h360ex-plan-track::before {
  content: "";
  position: absolute;
  left: 32px;
  right: 32px;
  top: 34px;
  height: 2px;
  background: linear-gradient(90deg, #ffb16b, #17b98f, #8d55ff, #2f80ed);
  opacity: .48;
}

.h360ex-plan-step {
  position: relative;
  z-index: 1;
  min-height: 122px;
  border: 1px solid #dbe7f6;
  border-radius: 12px;
  padding: 34px 12px 12px;
  display: grid;
  gap: 6px;
  background: #fff;
}

.h360ex-plan-number {
  position: absolute;
  top: -4px;
  inset-inline-end: 14px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #fff;
  border: 2px solid currentColor;
  font-weight: 950;
}

.h360ex-plan-step strong {
  color: var(--navy);
  font-size: 13px;
  font-weight: 950;
}

.h360ex-plan-step small,
.h360ex-plan-step span {
  color: #70809a;
  font-size: 11px;
  font-weight: 850;
}

.h360ex-plan-step.tone-blue { color:#2f80ed; background:#f4f9ff; border-color:#cfe0ff; }
.h360ex-plan-step.tone-green { color:#10a66f; background:#f1fbf6; border-color:#cbeee0; }
.h360ex-plan-step.tone-orange { color:#ff8a1d; background:#fff7ef; border-color:#ffddbd; }
.h360ex-plan-step.tone-purple { color:#8d55ff; background:#f8f4ff; border-color:#dfd1ff; }

.h360ex-plan-empty {
  grid-column: 1 / -1;
  min-height: 120px;
  border: 1px dashed #cfe0ff;
  border-radius: 14px;
  background: #f8fbff;
  color: #70809a;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 18px;
  font-weight: 850;
}

.h360ex-plan-card footer {
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 0 18px;
}

.h360ex-plan-card footer button,
.h360ex-docs-card header button,
.h360ex-cost-card footer button {
  border: 0;
  background: transparent;
  color: #2f80ed;
  font-weight: 950;
  cursor: pointer;
}

.h360ex-notes-box {
  margin: 10px 18px 16px;
  min-height: 164px;
  border: 1px solid #dcecff;
  border-radius: 13px;
  background: linear-gradient(180deg, #f5faff, #eef6ff);
  position: relative;
  color: #52647e;
}

.h360ex-notes-box ul {
  margin: 0;
  padding: 18px 30px 8px 18px;
  line-height: 1.85;
  font-size: 12.5px;
}

.h360ex-notes-box footer {
  position: absolute;
  bottom: 12px;
  inset-inline-start: 18px;
  color: #8291aa;
  font-size: 11px;
}

.h360ex-notes-box button {
  position: absolute;
  bottom: 10px;
  inset-inline-end: 12px;
  border: 0;
  background: transparent;
  color: #7b8ca6;
}

.h360ex-docs-grid {
  height: 174px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  padding: 10px 18px 18px;
}

.h360ex-doc,
.h360ex-upload {
  border: 1px solid #dce7f5;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  display: grid;
  align-content: start;
  text-align: center;
  color: #52647e;
}

.h360ex-doc div {
  height: 74px;
  background: linear-gradient(135deg, #ecf3fb, #dce7f5);
  display: grid;
  place-items: center;
  color: #2f80ed;
}

.h360ex-doc strong {
  padding-top: 8px;
  color: var(--navy);
  font-size: 12px;
}

.h360ex-doc small,
.h360ex-doc span {
  color: #70809a;
  font-size: 11px;
}

.h360ex-upload {
  border-style: dashed;
  place-items: center;
  align-content: center;
  gap: 8px;
  color: #70809a;
  cursor: pointer;
}

.h360ex-upload svg {
  width: 32px;
  height: 32px;
}

.h360ex-cost-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 12px 18px;
}

.h360ex-cost-grid div {
  min-height: 74px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  gap: 5px;
  background: #f4f9ff;
}

.h360ex-cost-grid div:nth-child(2) { background:#eefaf4; }
.h360ex-cost-grid div:nth-child(3) { background:#fff7ef; }

.h360ex-cost-grid span {
  color: #70809a;
  font-size: 11px;
  font-weight: 850;
}

.h360ex-cost-grid strong {
  color: var(--blue);
  font-size: 18px;
  font-weight: 950;
}

.h360ex-progress {
  height: 17px;
  margin: 2px 18px 0;
  background: #e9eef5;
  border-radius: 999px;
  overflow: hidden;
}

.h360ex-progress i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #0fb98b, #14c8a0);
  border-radius: inherit;
}

.h360ex-cost-card footer {
  height: 72px;
  padding: 10px 18px 16px;
  display: grid;
  grid-template-columns: 1fr 190px;
  gap: 12px;
  align-items: center;
}

.h360ex-cost-card footer button:first-child {
  text-align: right;
}

.h360ex-cost-card footer button:last-child {
  height: 46px;
  border-radius: 12px;
  background: linear-gradient(135deg, #11b98b, #0aa87d);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: 0 12px 24px rgba(12, 166, 125, .22);
}

.h360ex-empty-screen {
  min-height: 340px;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 18px;
  display: grid;
  place-items: center;
  text-align: center;
  color: var(--muted);
}

.h360ex-empty-screen strong {
  color: var(--navy);
  font-size: 22px;
  font-weight: 950;
}

@media (max-width: 1280px) {
  .h360ex-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "patient"
      "odont"
      "plan"
      "notes"
      "docs"
      "cost";
  }
  .h360ex-patient-card,
  .h360ex-odontogram-card,
  .h360ex-plan-card,
  .h360ex-notes-card,
  .h360ex-docs-card,
  .h360ex-cost-card {
    height: auto;
    min-height: 240px;
  }
}

@media (max-width: 840px) {
  .h360ex-patient-top,
  .h360ex-patient-metrics,
  .h360ex-odontogram-body,
  .h360ex-plan-track,
  .h360ex-docs-grid,
  .h360ex-cost-grid,
  .h360ex-cost-card footer {
    grid-template-columns: 1fr;
  }
  .h360ex-teeth-row {
    grid-template-columns: repeat(8, minmax(26px, 1fr));
  }
}
/* 0.22A.23.0.2_HEALTH360_TREATMENT_PAGE_REFERENCE_PIXEL_FINAL_CSS_END */

/* 0.22A.23.0.3_HEALTH360_TREATMENT_PHYSICAL_REFERENCE_FINAL_CSS_START */

/* hard reset of treatment reference canvas */
.h360tr-switcher-022a2301,
.h360tr-top-022a230,
.h360tr-rail-022a230,
.h360ex-page .h360tr-switcher-022a2301 {
  display: none !important;
}

.h360ex-page.h360ex-reference-final-022a2303,
.h360ex-page {
  direction: rtl !important;
  width: 100% !important;
  padding: 0 8px 30px !important;
  background: transparent !important;
  box-sizing: border-box !important;
}

/*
  Critical fix:
  The reference image is physical LTR in card placement:
  LEFT = patient / plan / docs
  RIGHT = odontogram / notes / cost.
  Since the app is RTL, CSS Grid without this block visually reverses the columns.
*/
.h360ex-grid.h360ex-reference-grid-final-022a2303,
.h360ex-grid {
  direction: ltr !important;
  display: grid !important;
  grid-template-columns: minmax(500px, 0.88fr) minmax(610px, 1.12fr) !important;
  grid-template-areas:
    "patient odont"
    "plan notes"
    "docs cost" !important;
  gap: 14px !important;
  align-items: stretch !important;
  width: 100% !important;
}

.h360ex-grid > * {
  direction: rtl !important;
  min-width: 0 !important;
}

.h360ex-patient-area { grid-area: patient !important; }
.h360ex-odont-area { grid-area: odont !important; }
.h360ex-plan-area { grid-area: plan !important; }
.h360ex-notes-area { grid-area: notes !important; }
.h360ex-docs-area { grid-area: docs !important; }
.h360ex-cost-area { grid-area: cost !important; }

.h360ex-card {
  border: 1px solid #dce7f5 !important;
  border-radius: 17px !important;
  background: #fff !important;
  box-shadow: 0 14px 34px rgba(17, 52, 86, .058) !important;
  overflow: hidden !important;
}

.h360ex-card header {
  height: 54px !important;
  padding: 15px 20px 8px !important;
}

.h360ex-card h2 {
  color: #061936 !important;
  font-size: 16px !important;
  font-weight: 950 !important;
}

/* top row proportions matching reference */
.h360ex-patient-card,
.h360ex-odontogram-card {
  height: 334px !important;
  min-height: 334px !important;
}

.h360ex-patient-card {
  padding: 24px 24px 18px !important;
}

.h360ex-patient-top {
  height: 140px !important;
  display: grid !important;
  grid-template-columns: 122px minmax(0, 1fr) !important;
  gap: 18px !important;
  align-items: center !important;
  border-bottom: 1px solid #edf2f8 !important;
}

.h360ex-avatar {
  width: 116px !important;
  height: 116px !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at 54% 42%, rgba(255,255,255,.96), rgba(255,255,255,.2) 42%, transparent 43%),
    linear-gradient(135deg, #e7f1ff, #f8fbff) !important;
  border: 1px solid #cfe0ff !important;
  box-shadow: inset 0 0 0 7px #f4f8ff !important;
  color: #2f80ed !important;
}

.h360ex-avatar button {
  inset-inline-start: 4px !important;
  bottom: 5px !important;
  width: 30px !important;
  height: 30px !important;
}

.h360ex-patient-name h2 {
  font-size: 23px !important;
  font-weight: 950 !important;
  line-height: 1.22 !important;
}

.h360ex-patient-name p {
  margin-top: 11px !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  color: #8190a8 !important;
}

.h360ex-patient-metrics {
  height: 142px !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px 16px !important;
  padding-top: 18px !important;
}

.h360ex-patient-metrics div {
  gap: 7px !important;
}

.h360ex-patient-metrics svg {
  width: 21px !important;
  height: 21px !important;
}

.h360ex-patient-metrics span {
  font-size: 12px !important;
  color: #7a88a0 !important;
}

.h360ex-patient-metrics strong {
  font-size: 12.5px !important;
  color: #061936 !important;
}

/* odontogram: larger, like the reference */
.h360ex-odontogram-card header {
  padding-inline: 24px !important;
}

.h360ex-odontogram-body {
  height: 280px !important;
  display: grid !important;
  grid-template-columns: 66px minmax(0, 1fr) 86px !important;
  gap: 14px !important;
  padding: 0 20px 18px !important;
  direction: ltr !important;
}

.h360ex-tooth-tabs {
  gap: 8px !important;
  align-content: center !important;
}

.h360ex-tooth-tabs button {
  height: 52px !important;
  border-radius: 11px !important;
  font-size: 11.5px !important;
}

.h360ex-tooth-tabs svg {
  width: 22px !important;
  height: 22px !important;
}

.h360ex-teeth-stage {
  gap: 9px !important;
  align-content: center !important;
}

.h360ex-teeth-row {
  grid-template-columns: repeat(16, minmax(24px, 1fr)) !important;
  gap: 6px !important;
}

.h360ex-tooth svg {
  width: 33px !important;
  height: 44px !important;
}

.h360ex-tooth span {
  font-size: 10.5px !important;
  color: #52647e !important;
}

.h360ex-tooth i {
  bottom: 13px !important;
  width: 14px !important;
  height: 14px !important;
}

.h360ex-jaw-label {
  font-size: 11.5px !important;
  font-weight: 950 !important;
}

.h360ex-legend {
  gap: 8px !important;
  font-size: 11.5px !important;
  font-weight: 950 !important;
}

.h360ex-legend b {
  width: 9px !important;
  height: 9px !important;
}

/* second/third rows */
.h360ex-plan-card,
.h360ex-notes-card,
.h360ex-docs-card,
.h360ex-cost-card {
  height: 252px !important;
  min-height: 252px !important;
}

.h360ex-plan-track {
  min-height: 146px !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 13px !important;
  padding: 20px 24px 10px !important;
}

.h360ex-plan-track::before {
  left: 34px !important;
  right: 34px !important;
  top: 38px !important;
  height: 2px !important;
}

.h360ex-plan-step {
  min-height: 126px !important;
  border-radius: 13px !important;
  padding: 36px 13px 12px !important;
}

.h360ex-plan-number {
  top: -5px !important;
  width: 36px !important;
  height: 36px !important;
  font-size: 16px !important;
}

.h360ex-plan-step strong {
  font-size: 13px !important;
}

.h360ex-plan-step small,
.h360ex-plan-step span {
  font-size: 11.5px !important;
}

.h360ex-plan-card footer {
  height: 50px !important;
}

.h360ex-notes-box {
  margin: 10px 20px 17px !important;
  min-height: 172px !important;
  border-radius: 13px !important;
}

.h360ex-notes-box ul {
  padding: 19px 34px 8px 20px !important;
  line-height: 1.9 !important;
  font-size: 12.5px !important;
}

.h360ex-docs-grid {
  height: 182px !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
  padding: 10px 20px 18px !important;
}

.h360ex-doc div {
  height: 78px !important;
}

.h360ex-doc strong {
  font-size: 12.2px !important;
}

.h360ex-upload {
  min-height: 128px !important;
  border-style: dashed !important;
}

.h360ex-cost-grid {
  padding: 13px 20px !important;
  gap: 13px !important;
}

.h360ex-cost-grid div {
  min-height: 78px !important;
  border-radius: 13px !important;
}

.h360ex-cost-grid strong {
  font-size: 19px !important;
}

.h360ex-progress {
  height: 18px !important;
  margin: 2px 20px 0 !important;
}

.h360ex-cost-card footer {
  height: 75px !important;
  padding: 10px 20px 17px !important;
  grid-template-columns: 1fr 200px !important;
  gap: 14px !important;
}

.h360ex-cost-card footer button:last-child {
  height: 48px !important;
  border-radius: 13px !important;
}

/* make page closer to the supplied reference at desktop sizes */
@media (min-width: 1281px) {
  .h360ex-page {
    margin-top: 2px !important;
  }
}

@media (max-width: 1280px) {
  .h360ex-grid,
  .h360ex-grid.h360ex-reference-grid-final-022a2303 {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "patient"
      "odont"
      "plan"
      "notes"
      "docs"
      "cost" !important;
  }

  .h360ex-patient-card,
  .h360ex-odontogram-card,
  .h360ex-plan-card,
  .h360ex-notes-card,
  .h360ex-docs-card,
  .h360ex-cost-card {
    height: auto !important;
    min-height: 252px !important;
  }
}

@media (max-width: 840px) {
  .h360ex-patient-top,
  .h360ex-patient-metrics,
  .h360ex-odontogram-body,
  .h360ex-plan-track,
  .h360ex-docs-grid,
  .h360ex-cost-grid,
  .h360ex-cost-card footer {
    grid-template-columns: 1fr !important;
  }

  .h360ex-teeth-row {
    grid-template-columns: repeat(8, minmax(26px, 1fr)) !important;
  }
}
/* 0.22A.23.0.3_HEALTH360_TREATMENT_PHYSICAL_REFERENCE_FINAL_CSS_END */

/* 0.22A.23.1_HEALTH360_TREATMENT_REAL_CONTENT_COMPLETION_CSS_START */
.h360tr-switcher-022a2301,
.h360tr-top-022a230,
.h360tr-rail-022a230,
.h360ex-page,
.h360ex-grid {
  display: none !important;
}

.h360real-page {
  --h360-blue:#2f80ed;
  --h360-navy:#061936;
  --h360-muted:#72829a;
  --h360-line:#dce7f5;
  --h360-soft:#f5f8fd;
  --h360-card:#fff;
  direction: rtl;
  width: 100%;
  padding: 0 8px 30px;
  background: transparent;
  box-sizing: border-box;
}

.h360real-grid {
  direction: ltr;
  display: grid;
  grid-template-columns: minmax(500px, 0.88fr) minmax(610px, 1.12fr);
  grid-template-areas:
    "patient odont"
    "plan notes"
    "docs cost";
  gap: 14px;
  align-items: stretch;
  width: 100%;
}

.h360real-grid > * {
  direction: rtl;
  min-width: 0;
}

.h360real-patient-area { grid-area: patient; }
.h360real-odont-area { grid-area: odont; }
.h360real-plan-area { grid-area: plan; }
.h360real-notes-area { grid-area: notes; }
.h360real-docs-area { grid-area: docs; }
.h360real-cost-area { grid-area: cost; }

.h360real-card {
  border: 1px solid var(--h360-line);
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(17, 52, 86, .058);
  overflow: hidden;
}

.h360real-card header {
  height: 54px;
  padding: 15px 20px 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.h360real-card h2 {
  margin: 0;
  color: var(--h360-navy);
  font-size: 16px;
  font-weight: 950;
}

.h360real-card svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.h360real-patient-card,
.h360real-odont-card {
  height: 334px;
  min-height: 334px;
}

.h360real-patient-card {
  padding: 24px 24px 18px;
}

.h360real-patient-top {
  height: 140px;
  display: grid;
  grid-template-columns: 122px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  border-bottom: 1px solid #edf2f8;
}

.h360real-avatar {
  position: relative;
  width: 116px;
  height: 116px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 54% 42%, rgba(255,255,255,.96), rgba(255,255,255,.2) 42%, transparent 43%),
    linear-gradient(135deg, #e7f1ff, #f8fbff);
  background-size: cover;
  background-position: center;
  border: 1px solid #cfe0ff;
  box-shadow: inset 0 0 0 7px #f4f8ff;
  color: var(--h360-blue);
  font-size: 27px;
  font-weight: 950;
  overflow: hidden;
}

.h360real-avatar.has-real-image {
  color: transparent;
}

.h360real-avatar button {
  position: absolute;
  inset-inline-start: 4px;
  bottom: 5px;
  width: 30px;
  height: 30px;
  border: 1px solid #d8e5f6;
  border-radius: 50%;
  background: #fff;
  color: #72829a;
}

.h360real-patient-title {
  min-width: 0;
}

.h360real-patient-title h2 {
  margin: 0;
  color: var(--h360-navy);
  font-size: 23px;
  font-weight: 950;
  line-height: 1.25;
  display: flex;
  align-items: center;
  gap: 8px;
}

.h360real-patient-title h2 span {
  color: var(--h360-blue);
  font-size: 13px;
}

.h360real-patient-title p {
  margin: 11px 0 0;
  font-size: 13px;
  color: #8190a8;
  font-weight: 900;
}

.h360real-metrics {
  height: 142px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px 16px;
  padding-top: 18px;
}

.h360real-metrics div {
  min-width: 0;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 7px;
  text-align: center;
}

.h360real-metrics svg {
  width: 21px;
  height: 21px;
  color: #97a6bd;
}

.h360real-metrics span {
  font-size: 12px;
  color: #7a88a0;
  font-weight: 850;
}

.h360real-metrics strong {
  max-width: 100%;
  color: var(--h360-navy);
  font-size: 12.5px;
  font-weight: 950;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.h360real-odont-card header {
  padding-inline: 24px;
}

.h360real-odont-body {
  height: 280px;
  display: grid;
  grid-template-columns: 66px minmax(0, 1fr) 86px;
  gap: 14px;
  padding: 0 20px 18px;
  direction: ltr;
}

.h360real-tabs {
  display: grid;
  gap: 8px;
  align-content: center;
  direction: rtl;
}

.h360real-tabs button {
  height: 52px;
  border-radius: 11px;
  border: 1px solid #d8e5f6;
  background: #fff;
  color: #6f7f99;
  display: grid;
  place-items: center;
  font-size: 11.5px;
  font-weight: 850;
}

.h360real-tabs button.active {
  background: #eef6ff;
  color: #2f80ed;
  border-color: #bfd8ff;
}

.h360real-tabs svg {
  width: 22px;
  height: 22px;
}

.h360real-teeth-stage {
  min-width: 0;
  display: grid;
  align-content: center;
  gap: 9px;
}

.h360real-teeth-row {
  display: grid;
  grid-template-columns: repeat(16, minmax(24px, 1fr));
  gap: 6px;
  direction: ltr;
}

.h360real-tooth {
  position: relative;
  border: 0;
  background: transparent;
  display: grid;
  place-items: center;
  gap: 1px;
  color: #91a6c5;
  padding: 0;
  cursor: pointer;
}

.h360real-tooth span {
  color: #52647e;
  font-size: 10.5px;
  font-weight: 950;
}

.h360real-tooth svg {
  width: 33px;
  height: 44px;
  fill: #fff;
  stroke: #9fb4d4;
  stroke-width: 1.45;
  filter: drop-shadow(0 4px 6px rgba(46, 78, 121, .06));
}

.h360real-tooth i {
  position: absolute;
  bottom: 13px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: currentColor;
  opacity: .22;
}

.h360real-tooth.tone-blue { color:#2f80ed; }
.h360real-tooth.tone-green { color:#10a66f; }
.h360real-tooth.tone-orange { color:#ff8a1d; }
.h360real-tooth.tone-red { color:#e84b5b; }
.h360real-tooth.tone-purple { color:#8d55ff; }
.h360real-tooth.tone-gray { color:#8d98aa; }
.h360real-tooth:not(.tone-clean) svg { stroke: currentColor; }

.h360real-jaw {
  text-align: center;
  color: #71809a;
  font-weight: 950;
  font-size: 11.5px;
  direction: rtl;
}

.h360real-legend {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  align-content: center;
  gap: 8px;
  direction: rtl;
  color: #52647e;
  font-size: 11.5px;
  font-weight: 950;
}

.h360real-legend li {
  display: flex;
  align-items: center;
  gap: 7px;
}

.h360real-legend b {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  display: inline-block;
}

.h360real-legend .blue { background:#2f80ed; }
.h360real-legend .green { background:#10a66f; }
.h360real-legend .orange { background:#ff8a1d; }
.h360real-legend .red { background:#e84b5b; }
.h360real-legend .purple { background:#8d55ff; }
.h360real-legend .gray { background:#8d98aa; }

.h360real-plan-card,
.h360real-notes-card,
.h360real-docs-card,
.h360real-cost-card {
  height: 252px;
  min-height: 252px;
}

.h360real-plan-track {
  position: relative;
  min-height: 146px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 13px;
  padding: 20px 24px 10px;
}

.h360real-plan-track::before {
  content: "";
  position: absolute;
  left: 34px;
  right: 34px;
  top: 38px;
  height: 2px;
  background: linear-gradient(90deg, #ffb16b, #17b98f, #8d55ff, #2f80ed);
  opacity: .48;
}

.h360real-plan-step {
  position: relative;
  z-index: 1;
  min-height: 126px;
  border: 1px solid #dbe7f6;
  border-radius: 13px;
  padding: 36px 13px 12px;
  display: grid;
  gap: 6px;
  background: #fff;
}

.h360real-step-no {
  position: absolute;
  top: -5px;
  inset-inline-end: 14px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #fff;
  border: 2px solid currentColor;
  font-size: 16px;
  font-weight: 950;
}

.h360real-plan-step strong {
  color: var(--h360-navy);
  font-size: 13px;
  font-weight: 950;
}

.h360real-plan-step small,
.h360real-plan-step span {
  color: #70809a;
  font-size: 11.5px;
  font-weight: 850;
}

.h360real-plan-step.tone-blue { color:#2f80ed; background:#f4f9ff; border-color:#cfe0ff; }
.h360real-plan-step.tone-green { color:#10a66f; background:#f1fbf6; border-color:#cbeee0; }
.h360real-plan-step.tone-orange { color:#ff8a1d; background:#fff7ef; border-color:#ffddbd; }
.h360real-plan-step.tone-purple { color:#8d55ff; background:#f8f4ff; border-color:#dfd1ff; }

.h360real-plan-empty {
  grid-column: 1 / -1;
  min-height: 120px;
  border: 1px dashed #cfe0ff;
  border-radius: 14px;
  background: #f8fbff;
  color: #70809a;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 18px;
  font-weight: 850;
}

.h360real-plan-card footer {
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 0 18px;
}

.h360real-plan-card footer button,
.h360real-docs-card header button,
.h360real-cost-card footer button,
.h360real-doc footer button {
  border: 0;
  background: transparent;
  color: #2f80ed;
  font-weight: 950;
  cursor: pointer;
}

.h360real-notes-box {
  margin: 10px 20px 17px;
  min-height: 172px;
  border: 1px solid #dcecff;
  border-radius: 13px;
  background: linear-gradient(180deg, #f5faff, #eef6ff);
  position: relative;
  color: #52647e;
}

.h360real-notes-box ul {
  margin: 0;
  padding: 19px 34px 8px 20px;
  line-height: 1.9;
  font-size: 12.5px;
}

.h360real-notes-box footer {
  position: absolute;
  bottom: 12px;
  inset-inline-start: 18px;
  color: #8291aa;
  font-size: 11px;
}

.h360real-notes-box button {
  position: absolute;
  bottom: 10px;
  inset-inline-end: 12px;
  border: 0;
  background: transparent;
  color: #7b8ca6;
}

.h360real-docs-grid {
  height: 182px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  padding: 10px 20px 18px;
}

.h360real-doc,
.h360real-upload {
  border: 1px solid #dce7f5;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  display: grid;
  align-content: start;
  text-align: center;
  color: #52647e;
}

.h360real-doc-preview,
.h360real-doc > div {
  height: 78px;
  background: linear-gradient(135deg, #ecf3fb, #dce7f5);
  background-size: cover;
  background-position: center;
  display: grid;
  place-items: center;
  color: #2f80ed;
}

.h360real-doc-preview.has-real-image svg {
  display: none;
}

.h360real-doc strong {
  padding: 8px 8px 0;
  color: var(--h360-navy);
  font-size: 12.2px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.h360real-doc small,
.h360real-doc span {
  color: #70809a;
  font-size: 11px;
}

.h360real-doc footer {
  display: flex;
  justify-content: center;
  gap: 8px;
  padding: 3px 4px 6px;
}

.h360real-doc-empty {
  align-content: center;
  gap: 8px;
  color: #70809a;
  background: #f8fbff;
}

.h360real-upload {
  min-height: 128px;
  border-style: dashed;
  place-items: center;
  align-content: center;
  gap: 8px;
  color: #70809a;
  cursor: pointer;
}

.h360real-upload svg {
  width: 32px;
  height: 32px;
}

.h360real-cost-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 13px;
  padding: 13px 20px;
}

.h360real-cost-grid div {
  min-height: 78px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  gap: 5px;
  background: #f4f9ff;
}

.h360real-cost-grid div:nth-child(2) { background:#eefaf4; }
.h360real-cost-grid div:nth-child(3) { background:#fff7ef; }

.h360real-cost-grid span {
  color: #70809a;
  font-size: 11px;
  font-weight: 850;
}

.h360real-cost-grid strong {
  color: var(--h360-blue);
  font-size: 19px;
  font-weight: 950;
}

.h360real-progress {
  height: 18px;
  margin: 2px 20px 0;
  background: #e9eef5;
  border-radius: 999px;
  overflow: hidden;
}

.h360real-progress i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #0fb98b, #14c8a0);
  border-radius: inherit;
}

.h360real-cost-card footer {
  height: 75px;
  padding: 10px 20px 17px;
  display: grid;
  grid-template-columns: 1fr 200px;
  gap: 14px;
  align-items: center;
}

.h360real-cost-card footer button:first-child {
  text-align: right;
}

.h360real-cost-card footer button:last-child {
  height: 48px;
  border-radius: 13px;
  background: linear-gradient(135deg, #11b98b, #0aa87d);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: 0 12px 24px rgba(12, 166, 125, .22);
}

.h360real-empty-screen {
  min-height: 340px;
  border: 1px solid var(--h360-line);
  background: #fff;
  border-radius: 18px;
  display: grid;
  place-items: center;
  text-align: center;
  color: var(--h360-muted);
}

.h360real-empty-screen strong {
  color: var(--h360-navy);
  font-size: 22px;
  font-weight: 950;
}

@media (max-width: 1280px) {
  .h360real-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "patient"
      "odont"
      "plan"
      "notes"
      "docs"
      "cost";
  }

  .h360real-patient-card,
  .h360real-odont-card,
  .h360real-plan-card,
  .h360real-notes-card,
  .h360real-docs-card,
  .h360real-cost-card {
    height: auto;
    min-height: 252px;
  }
}

@media (max-width: 840px) {
  .h360real-patient-top,
  .h360real-metrics,
  .h360real-odont-body,
  .h360real-plan-track,
  .h360real-docs-grid,
  .h360real-cost-grid,
  .h360real-cost-card footer {
    grid-template-columns: 1fr;
  }

  .h360real-teeth-row {
    grid-template-columns: repeat(8, minmax(26px, 1fr));
  }
}
/* 0.22A.23.1_HEALTH360_TREATMENT_REAL_CONTENT_COMPLETION_CSS_END */

/* 0.22A.23.1.2_HEALTH360_TREATMENT_REFERENCE_VISUAL_ALIGNMENT_CSS_START */
.h360real-page {
  padding: 0 6px 22px !important;
}

.h360real-grid {
  direction: ltr !important;
  grid-template-columns: minmax(470px, .88fr) minmax(650px, 1.12fr) !important;
  grid-template-areas:
    "patient odont"
    "plan notes"
    "docs cost" !important;
  gap: 12px !important;
  align-items: stretch !important;
}

.h360real-grid > * {
  direction: rtl !important;
}

.h360real-card {
  border-radius: 15px !important;
  box-shadow: 0 10px 26px rgba(17, 52, 86, .045) !important;
}

.h360real-card header {
  height: 48px !important;
  padding: 13px 18px 6px !important;
}

.h360real-card h2 {
  font-size: 15px !important;
  letter-spacing: -.01em !important;
}

.h360real-patient-card,
.h360real-odont-card {
  height: 312px !important;
  min-height: 312px !important;
}

.h360real-patient-card {
  padding: 20px 20px 14px !important;
}

.h360real-patient-top {
  height: 120px !important;
  grid-template-columns: 108px minmax(0, 1fr) !important;
  gap: 16px !important;
}

.h360real-avatar {
  width: 102px !important;
  height: 102px !important;
  font-size: 21px !important;
  box-shadow: inset 0 0 0 6px #f4f8ff !important;
}

.h360real-avatar button {
  width: 24px !important;
  height: 24px !important;
  font-size: 10px !important;
  opacity: .75 !important;
}

.h360real-patient-title h2 {
  font-size: 20px !important;
  line-height: 1.22 !important;
  gap: 0 !important;
}

.h360real-patient-title h2 span {
  display: none !important;
}

.h360real-patient-title p {
  margin-top: 8px !important;
  font-size: 12px !important;
}

.h360real-metrics {
  height: 126px !important;
  gap: 8px 12px !important;
  padding-top: 15px !important;
}

.h360real-metrics div {
  gap: 5px !important;
}

.h360real-metrics svg {
  width: 19px !important;
  height: 19px !important;
}

.h360real-metrics span {
  font-size: 11.4px !important;
}

.h360real-metrics strong {
  font-size: 11.8px !important;
  line-height: 1.35 !important;
}

.h360real-odont-card header {
  padding-inline: 22px !important;
}

.h360real-odont-body {
  height: 260px !important;
  grid-template-columns: 74px minmax(0, 1fr) 118px !important;
  gap: 10px !important;
  padding: 0 18px 16px !important;
  overflow: hidden !important;
}

.h360real-tabs {
  gap: 7px !important;
}

.h360real-tabs button {
  height: 44px !important;
  border-radius: 10px !important;
  font-size: 10.8px !important;
}

.h360real-tabs svg {
  width: 19px !important;
  height: 19px !important;
}

.h360real-teeth-stage {
  gap: 6px !important;
  overflow: visible !important;
}

.h360real-teeth-row {
  grid-template-columns: repeat(16, minmax(21px, 1fr)) !important;
  gap: 4px !important;
}

.h360real-tooth span {
  font-size: 9.6px !important;
  line-height: 1 !important;
}

.h360real-tooth svg {
  width: 28px !important;
  height: 39px !important;
}

.h360real-tooth i {
  width: 12px !important;
  height: 12px !important;
  bottom: 11px !important;
}

.h360real-jaw {
  font-size: 10.6px !important;
  margin-top: -1px !important;
}

.h360real-legend {
  width: 118px !important;
  min-width: 118px !important;
  gap: 6px !important;
  font-size: 10.7px !important;
  line-height: 1.15 !important;
  overflow: hidden !important;
  align-content: center !important;
  justify-content: stretch !important;
}

.h360real-legend li {
  width: 100% !important;
  min-width: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  display: grid !important;
  grid-template-columns: 9px minmax(0, 1fr) !important;
  gap: 6px !important;
  align-items: center !important;
}

.h360real-legend b {
  width: 8px !important;
  height: 8px !important;
}

.h360real-plan-card,
.h360real-notes-card,
.h360real-docs-card,
.h360real-cost-card {
  height: 232px !important;
  min-height: 232px !important;
}

.h360real-plan-track {
  min-height: 126px !important;
  gap: 10px !important;
  padding: 16px 22px 8px !important;
}

.h360real-plan-track::before {
  top: 31px !important;
  left: 32px !important;
  right: 32px !important;
}

.h360real-plan-step {
  min-height: 106px !important;
  padding: 31px 11px 10px !important;
  border-radius: 12px !important;
}

.h360real-step-no {
  width: 32px !important;
  height: 32px !important;
  top: -4px !important;
  font-size: 14px !important;
}

.h360real-plan-step strong {
  font-size: 12.1px !important;
  line-height: 1.35 !important;
}

.h360real-plan-step small,
.h360real-plan-step span {
  font-size: 10.7px !important;
}

.h360real-plan-empty {
  min-height: 104px !important;
  padding: 14px !important;
  font-size: 12px !important;
}

.h360real-plan-card footer {
  height: 46px !important;
  padding: 0 16px !important;
}

.h360real-notes-box {
  margin: 8px 18px 15px !important;
  min-height: 158px !important;
  border-radius: 12px !important;
}

.h360real-notes-box ul {
  padding: 15px 30px 8px 18px !important;
  line-height: 1.72 !important;
  font-size: 11.8px !important;
}

.h360real-notes-box footer {
  bottom: 9px !important;
  font-size: 10.5px !important;
}

.h360real-docs-grid {
  height: 166px !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  padding: 8px 18px 14px !important;
}

.h360real-doc-preview,
.h360real-doc > div {
  height: 66px !important;
}

.h360real-doc strong {
  font-size: 11.4px !important;
}

.h360real-doc small,
.h360real-doc span {
  font-size: 10.4px !important;
}

.h360real-upload {
  min-height: 112px !important;
}

.h360real-upload svg {
  width: 28px !important;
  height: 28px !important;
}

.h360real-cost-grid {
  gap: 10px !important;
  padding: 10px 18px !important;
}

.h360real-cost-grid div {
  min-height: 66px !important;
  border-radius: 12px !important;
}

.h360real-cost-grid span {
  font-size: 10.6px !important;
}

.h360real-cost-grid strong {
  font-size: 17px !important;
}

.h360real-progress {
  height: 14px !important;
  margin: 0 18px !important;
}

.h360real-cost-card footer {
  height: 66px !important;
  padding: 8px 18px 14px !important;
  grid-template-columns: 1fr 178px !important;
  gap: 12px !important;
}

.h360real-cost-card footer button:last-child {
  height: 42px !important;
  border-radius: 12px !important;
}

@media (min-width: 1281px) and (max-height: 860px) {
  .h360real-patient-card,
  .h360real-odont-card {
    height: 300px !important;
    min-height: 300px !important;
  }

  .h360real-patient-top {
    height: 112px !important;
  }

  .h360real-avatar {
    width: 96px !important;
    height: 96px !important;
  }

  .h360real-metrics {
    height: 118px !important;
  }

  .h360real-odont-body {
    height: 248px !important;
  }

  .h360real-plan-card,
  .h360real-notes-card,
  .h360real-docs-card,
  .h360real-cost-card {
    height: 220px !important;
    min-height: 220px !important;
  }
}

@media (max-width: 1280px) {
  .h360real-grid {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "patient"
      "odont"
      "plan"
      "notes"
      "docs"
      "cost" !important;
  }

  .h360real-patient-card,
  .h360real-odont-card,
  .h360real-plan-card,
  .h360real-notes-card,
  .h360real-docs-card,
  .h360real-cost-card {
    height: auto !important;
    min-height: 220px !important;
  }
}
/* 0.22A.23.1.2_HEALTH360_TREATMENT_REFERENCE_VISUAL_ALIGNMENT_CSS_END */

/* 0.22A.23.2.1_HEALTH360_TREATMENT_PAGE_ACTIONS_ACTIVATION_CSS_START */
.h360actions-ready-022a2321 {
  position: relative;
}

.h360real-avatar,
.h360real-patient-title,
.h360real-tooth,
.h360real-tabs button,
.h360real-doc-empty,
.h360real-docs-card header,
.h360real-notes-card header,
.h360real-cost-card header {
  cursor: pointer !important;
}

.h360real-avatar:hover,
.h360real-tooth:hover,
.h360real-tabs button:hover {
  filter: brightness(.985);
  transform: translateY(-1px);
}

.h360actions-patient-row-022a2321 {
  position: absolute;
  inset-inline: 18px;
  bottom: 8px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.h360actions-patient-row-022a2321 button {
  height: 28px;
  border: 1px solid #d7e5f8;
  border-radius: 9px;
  background: linear-gradient(180deg, #fff, #f5f9ff);
  color: #2f6fcf;
  font-size: 10.5px;
  font-weight: 950;
  cursor: pointer;
}

.h360actions-patient-row-022a2321 button:hover {
  background: #eef6ff;
  border-color: #bdd6ff;
}

.h360real-patient-card .h360real-metrics {
  padding-bottom: 28px !important;
}

.h360actions-modal-022a2321 {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(5, 18, 42, .34);
  display: grid;
  place-items: center;
  padding: 24px;
}

.h360actions-panel-022a2321 {
  width: min(620px, calc(100vw - 42px));
  max-height: min(720px, calc(100vh - 42px));
  overflow: hidden;
  border-radius: 18px;
  background: #fff;
  border: 1px solid #dce7f5;
  box-shadow: 0 24px 70px rgba(8, 27, 62, .24);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.h360actions-panel-022a2321 header {
  height: 58px;
  padding: 0 20px;
  border-bottom: 1px solid #edf2f8;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.h360actions-panel-022a2321 header strong {
  color: #071a38;
  font-size: 17px;
  font-weight: 950;
}

.h360actions-panel-022a2321 header button {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 11px;
  background: #f1f5fb;
  color: #4e617c;
  font-size: 22px;
  cursor: pointer;
}

.h360actions-panel-022a2321 main {
  padding: 18px 20px;
  overflow: auto;
}

.h360actions-panel-022a2321 footer {
  min-height: 64px;
  padding: 12px 20px 16px;
  border-top: 1px solid #edf2f8;
  display: flex;
  gap: 10px;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.h360actions-panel-022a2321 footer button {
  min-width: 128px;
  height: 40px;
  border-radius: 11px;
  border: 1px solid #d7e5f8;
  background: #fff;
  color: #2f6fcf;
  font-weight: 950;
  cursor: pointer;
}

.h360actions-panel-022a2321 footer button.primary {
  border-color: #0fae83;
  background: linear-gradient(135deg, #13bf91, #0aa87d);
  color: #fff;
}

.h360actions-tooth-022a2321 {
  min-height: 118px;
  border: 1px dashed #cfe0ff;
  border-radius: 15px;
  background: #f8fbff;
  color: #63738c;
  display: grid;
  place-items: center;
  text-align: center;
  gap: 8px;
  padding: 18px;
}

.h360actions-tooth-022a2321 strong {
  color: #071a38;
  font-weight: 950;
}

.h360actions-plan-list-022a2321 {
  display: grid;
  gap: 12px;
}

.h360actions-plan-list-022a2321 article {
  border: 1px solid #dce7f5;
  border-radius: 14px;
  background: #f8fbff;
  padding: 14px;
}

.h360actions-plan-list-022a2321 .h360real-step-no {
  position: static !important;
  margin-bottom: 8px;
}

@media (max-width: 840px) {
  .h360actions-patient-row-022a2321 {
    position: static;
    margin-top: 10px;
    grid-template-columns: 1fr;
  }

  .h360real-patient-card .h360real-metrics {
    padding-bottom: 0 !important;
  }
}
/* 0.22A.23.2.1_HEALTH360_TREATMENT_PAGE_ACTIONS_ACTIVATION_CSS_END */

/* 0.22A.23.2.2_TREATMENT_PLAN_MODAL_PROFESSIONAL_LAYOUT_CSS_START */
.tpl-pro-modal-022a2322 {
  width: min(1180px, calc(100vw - 54px)) !important;
  max-height: min(820px, calc(100vh - 54px)) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at top right, rgba(48, 103, 231, .055), transparent 34%),
    #fff !important;
  border: 1px solid #dfe9f7 !important;
  box-shadow: 0 30px 90px rgba(8, 27, 62, .24) !important;
  padding: 28px 32px 26px !important;
  overflow: auto !important;
  direction: rtl !important;
}

.tpl-pro-modal-022a2322 * {
  box-sizing: border-box !important;
}

.tpl-pro-header-022a2322 {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 18px !important;
  margin-bottom: 14px !important;
  padding-bottom: 14px !important;
  border-bottom: 1px solid #edf3fb !important;
}

.tpl-pro-title-022a2322 {
  color: #061936 !important;
  font-size: 22px !important;
  font-weight: 950 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}

.tpl-pro-patient-name-022a2322 {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 28px !important;
  margin-top: 6px !important;
  color: #71809a !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

.tpl-pro-close-022a2322 {
  width: auto !important;
  min-width: 74px !important;
  height: 44px !important;
  border: 1px solid #dfe8f7 !important;
  border-radius: 12px !important;
  background: #f3f6fd !important;
  color: #2f5fd7 !important;
  font-weight: 950 !important;
  font-size: 14px !important;
  cursor: pointer !important;
}

.tpl-pro-guidance-022a2322 {
  margin: 0 0 18px !important;
  padding: 15px 18px !important;
  border: 1px solid #dceafe !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, #f7fbff, #f1f7ff) !important;
  color: #5f718d !important;
  display: grid !important;
  gap: 5px !important;
}

.tpl-pro-guidance-022a2322 strong {
  color: #061936 !important;
  font-size: 15px !important;
  font-weight: 950 !important;
}

.tpl-pro-guidance-022a2322 span {
  font-size: 12.5px !important;
  line-height: 1.7 !important;
  font-weight: 800 !important;
}

.tpl-pro-section-labels-022a2322 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 0 14px !important;
}

.tpl-pro-section-labels-022a2322 span {
  min-height: 34px !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  background: #f4f8ff !important;
  color: #2f6fcf !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  text-align: center !important;
  border: 1px solid #dceafe !important;
}

.tpl-pro-form-022a2322 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px 18px !important;
  align-items: start !important;
}

.tpl-pro-modal-022a2322 label,
.tpl-pro-modal-022a2322 .tpl-pro-field-title-022a2322,
.tpl-pro-modal-022a2322 .tpl-pro-field-doctor-022a2322,
.tpl-pro-modal-022a2322 .tpl-pro-field-diagnosis-022a2322,
.tpl-pro-modal-022a2322 .tpl-pro-field-procedure-022a2322,
.tpl-pro-modal-022a2322 .tpl-pro-field-tooth-022a2322,
.tpl-pro-modal-022a2322 .tpl-pro-field-price-022a2322,
.tpl-pro-modal-022a2322 .tpl-pro-field-discount-022a2322 {
  min-width: 0 !important;
}

.tpl-pro-modal-022a2322 label,
.tpl-pro-modal-022a2322 label > span,
.tpl-pro-modal-022a2322 label > div:first-child,
.tpl-pro-modal-022a2322 .form-label {
  color: #061936 !important;
  font-size: 14px !important;
  font-weight: 950 !important;
}

.tpl-pro-wide-022a2322,
.tpl-pro-field-diagnosis-022a2322 {
  grid-column: 1 / -1 !important;
}

.tpl-pro-control-022a2322,
.tpl-pro-modal-022a2322 input,
.tpl-pro-modal-022a2322 textarea,
.tpl-pro-modal-022a2322 select {
  width: 100% !important;
  min-height: 48px !important;
  border: 1px solid #dbe6f5 !important;
  border-radius: 13px !important;
  background: #fff !important;
  color: #071a38 !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  padding: 12px 14px !important;
  outline: none !important;
  box-shadow: 0 1px 0 rgba(10, 35, 70, .02) !important;
}

.tpl-pro-modal-022a2322 textarea {
  min-height: 108px !important;
  resize: vertical !important;
  line-height: 1.8 !important;
}

.tpl-pro-modal-022a2322 input:focus,
.tpl-pro-modal-022a2322 textarea:focus,
.tpl-pro-modal-022a2322 select:focus {
  border-color: #78a8ff !important;
  box-shadow: 0 0 0 4px rgba(47, 128, 237, .11) !important;
}

.tpl-pro-field-price-022a2322,
.tpl-pro-field-discount-022a2322 {
  position: relative !important;
}

.tpl-pro-field-price-022a2322::after,
.tpl-pro-field-discount-022a2322::after {
  content: "د.ع" !important;
  position: absolute !important;
  bottom: 13px !important;
  inset-inline-start: 14px !important;
  color: #8493aa !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  pointer-events: none !important;
}

.tpl-pro-field-discount-022a2322::after {
  content: "خصم" !important;
}

.tpl-pro-footer-022a2322 {
  grid-column: 1 / -1 !important;
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 8px !important;
  padding-top: 18px !important;
  border-top: 1px solid #edf3fb !important;
}

.tpl-pro-submit-022a2322 {
  min-width: 132px !important;
  height: 46px !important;
  border: 0 !important;
  border-radius: 13px !important;
  background: linear-gradient(135deg, #3565e8, #2c55d6) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  box-shadow: 0 12px 26px rgba(53, 101, 232, .22) !important;
  cursor: pointer !important;
}

.tpl-pro-cancel-022a2322 {
  min-width: 86px !important;
  height: 46px !important;
  border: 1px solid #dfe8f7 !important;
  border-radius: 13px !important;
  background: #f2f6fd !important;
  color: #3565e8 !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
}

@media (max-width: 900px) {
  .tpl-pro-modal-022a2322 {
    width: calc(100vw - 28px) !important;
    padding: 20px !important;
  }

  .tpl-pro-form-022a2322,
  .tpl-pro-section-labels-022a2322,
  .tpl-pro-header-022a2322 {
    grid-template-columns: 1fr !important;
  }

  .tpl-pro-footer-022a2322 {
    flex-direction: column-reverse !important;
    align-items: stretch !important;
  }

  .tpl-pro-submit-022a2322,
  .tpl-pro-cancel-022a2322 {
    width: 100% !important;
  }
}
/* 0.22A.23.2.2_TREATMENT_PLAN_MODAL_PROFESSIONAL_LAYOUT_CSS_END */

/* 0.22A.23.2.3_TREATMENT_PLAN_MODAL_FINAL_CLEAN_LAYOUT_CSS_START */
.tplfinal-modal-022a2323 {
  width: min(1120px, calc(100vw - 42px)) !important;
  max-height: min(780px, calc(100vh - 42px)) !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 24px !important;
  background: #ffffff !important;
  border: 1px solid #dce7f5 !important;
  box-shadow: 0 30px 90px rgba(5, 23, 54, .28) !important;
  direction: rtl !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) auto !important;
}

.tplfinal-modal-022a2323 * {
  box-sizing: border-box !important;
}

.tplfinal-modal-022a2323 .tpl-pro-guidance-022a2322,
.tplfinal-modal-022a2323 .tpl-pro-section-labels-022a2322 {
  display: none !important;
}

.tplfinal-topbar-022a2323 {
  min-height: 86px !important;
  padding: 22px 28px 18px !important;
  border-bottom: 1px solid #eef3fb !important;
  background:
    radial-gradient(circle at 88% 10%, rgba(47, 111, 207, .08), transparent 34%),
    linear-gradient(180deg, #ffffff, #fbfdff) !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 20px !important;
}

.tplfinal-titlebox-022a2323 {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
}

.tplfinal-titlebox-022a2323 h2 {
  margin: 0 !important;
  color: #071a38 !important;
  font-size: 24px !important;
  font-weight: 950 !important;
  line-height: 1.25 !important;
}

.tplfinal-titlebox-022a2323 p {
  margin: 0 !important;
  color: #73829a !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

.tplfinal-top-actions-022a2323 {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
}

.tplfinal-close-022a2323 {
  min-width: 82px !important;
  height: 42px !important;
  padding: 0 18px !important;
  border: 1px solid #dce7f7 !important;
  border-radius: 13px !important;
  background: #f4f7fd !important;
  color: #2f63df !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
}

.tplfinal-hint-022a2323 {
  margin: 0 !important;
  padding: 16px 28px !important;
  background: #f8fbff !important;
  border-bottom: 1px solid #eef3fb !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.tplfinal-hint-022a2323 article {
  min-height: 70px !important;
  padding: 12px 14px !important;
  border: 1px solid #dbe9ff !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  grid-template-areas:
    "no title"
    "no desc" !important;
  column-gap: 10px !important;
  align-items: center !important;
}

.tplfinal-hint-022a2323 strong {
  grid-area: no !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #eaf2ff, #f8fbff) !important;
  border: 1px solid #cfe0ff !important;
  color: #2f6fcf !important;
  display: grid !important;
  place-items: center !important;
  font-size: 14px !important;
  font-weight: 950 !important;
}

.tplfinal-hint-022a2323 span {
  grid-area: title !important;
  color: #071a38 !important;
  font-size: 13px !important;
  font-weight: 950 !important;
}

.tplfinal-hint-022a2323 small {
  grid-area: desc !important;
  color: #71809a !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  line-height: 1.45 !important;
}

.tplfinal-form-grid-022a2323 {
  padding: 22px 28px 20px !important;
  overflow: auto !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px 18px !important;
  align-items: start !important;
  align-content: start !important;
}

.tplfinal-field-022a2323 {
  display: grid !important;
  gap: 8px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.tplfinal-label-022a2323 {
  color: #071a38 !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  line-height: 1.3 !important;
}

.tplfinal-diagnosis-field-022a2323 {
  grid-column: 1 / -1 !important;
}

.tplfinal-control-022a2323,
.tplfinal-modal-022a2323 input,
.tplfinal-modal-022a2323 textarea,
.tplfinal-modal-022a2323 select {
  width: 100% !important;
  min-height: 48px !important;
  border: 1px solid #dbe6f5 !important;
  border-radius: 13px !important;
  background: #fff !important;
  color: #071a38 !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  padding: 12px 14px !important;
  outline: none !important;
  box-shadow: none !important;
}

.tplfinal-modal-022a2323 textarea {
  min-height: 112px !important;
  resize: vertical !important;
  line-height: 1.75 !important;
}

.tplfinal-modal-022a2323 input:focus,
.tplfinal-modal-022a2323 textarea:focus,
.tplfinal-modal-022a2323 select:focus {
  border-color: #78a8ff !important;
  box-shadow: 0 0 0 4px rgba(47, 128, 237, .11) !important;
}

.tplfinal-price-field-022a2323,
.tplfinal-discount-field-022a2323 {
  position: relative !important;
}

.tplfinal-price-field-022a2323::after {
  content: "د.ع" !important;
  position: absolute !important;
  bottom: 14px !important;
  inset-inline-start: 14px !important;
  color: #8190a6 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  pointer-events: none !important;
}

.tplfinal-discount-field-022a2323::after {
  content: "خصم" !important;
  position: absolute !important;
  bottom: 14px !important;
  inset-inline-start: 14px !important;
  color: #8190a6 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  pointer-events: none !important;
}

.tplfinal-footer-022a2323 {
  min-height: 78px !important;
  padding: 15px 28px 20px !important;
  border-top: 1px solid #eef3fb !important;
  background: #ffffff !important;
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 12px !important;
}

.tplfinal-submit-022a2323 {
  min-width: 142px !important;
  height: 46px !important;
  border: 0 !important;
  border-radius: 13px !important;
  background: linear-gradient(135deg, #3565e8, #2d56d6) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  box-shadow: 0 12px 26px rgba(53, 101, 232, .22) !important;
  cursor: pointer !important;
}

.tplfinal-cancel-022a2323 {
  min-width: 92px !important;
  height: 46px !important;
  border: 1px solid #dce7f7 !important;
  border-radius: 13px !important;
  background: #f4f7fd !important;
  color: #3565e8 !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
}

@media (max-width: 920px) {
  .tplfinal-modal-022a2323 {
    width: calc(100vw - 24px) !important;
    max-height: calc(100vh - 24px) !important;
  }

  .tplfinal-hint-022a2323,
  .tplfinal-form-grid-022a2323 {
    grid-template-columns: 1fr !important;
  }

  .tplfinal-topbar-022a2323,
  .tplfinal-hint-022a2323,
  .tplfinal-form-grid-022a2323,
  .tplfinal-footer-022a2323 {
    padding-inline: 18px !important;
  }

  .tplfinal-footer-022a2323 {
    flex-direction: column-reverse !important;
    align-items: stretch !important;
  }

  .tplfinal-submit-022a2323,
  .tplfinal-cancel-022a2323 {
    width: 100% !important;
  }
}
/* 0.22A.23.2.3_TREATMENT_PLAN_MODAL_FINAL_CLEAN_LAYOUT_CSS_END */

/* 0.22A.23.2.4_TREATMENT_PLAN_MODAL_ULTIMATE_CLEAN_GRID_CSS_START */
.tplultimate-modal-022a2324 {
  width: min(1080px, calc(100vw - 44px)) !important;
  height: auto !important;
  max-height: min(760px, calc(100vh - 44px)) !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 24px !important;
  background: #ffffff !important;
  border: 1px solid #dce7f5 !important;
  box-shadow: 0 28px 86px rgba(8, 26, 61, .26) !important;
  direction: rtl !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
}

.tplultimate-modal-022a2324 * {
  box-sizing: border-box !important;
}

.tplultimate-hidden-022a2324,
.tplultimate-original-label-hidden-022a2324,
.tplultimate-modal-022a2324 .tpl-pro-guidance-022a2322,
.tplultimate-modal-022a2324 .tpl-pro-section-labels-022a2322,
.tplultimate-modal-022a2324 .tplfinal-hint-022a2323,
.tplultimate-modal-022a2324 .tplfinal-topbar-022a2323,
.tplultimate-modal-022a2324 .tplfinal-footer-022a2323,
.tplultimate-modal-022a2324 .tplfinal-label-022a2323 {
  display: none !important;
}

.tplultimate-topbar-022a2324 {
  min-height: 82px !important;
  padding: 20px 28px 16px !important;
  border-bottom: 1px solid #eef3fb !important;
  background: linear-gradient(180deg, #fff, #fbfdff) !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 18px !important;
}

.tplultimate-titlebox-022a2324 {
  min-width: 0 !important;
  display: grid !important;
  gap: 4px !important;
}

.tplultimate-titlebox-022a2324 h2 {
  margin: 0 !important;
  color: #071a38 !important;
  font-size: 24px !important;
  line-height: 1.25 !important;
  font-weight: 950 !important;
}

.tplultimate-titlebox-022a2324 p {
  margin: 0 !important;
  color: #71809a !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  font-weight: 850 !important;
}

.tplultimate-closebox-022a2324 {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

.tplultimate-close-022a2324 {
  min-width: 82px !important;
  height: 42px !important;
  padding: 0 18px !important;
  border: 1px solid #dce7f7 !important;
  border-radius: 13px !important;
  background: #f4f7fd !important;
  color: #2f63df !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
}

.tplultimate-steps-022a2324 {
  padding: 14px 28px !important;
  border-bottom: 1px solid #eef3fb !important;
  background: #f8fbff !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.tplultimate-steps-022a2324 article {
  min-height: 58px !important;
  padding: 10px 12px !important;
  border: 1px solid #dbe9ff !important;
  border-radius: 15px !important;
  background: #fff !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
}

.tplultimate-steps-022a2324 b {
  width: 32px !important;
  height: 32px !important;
  border-radius: 999px !important;
  border: 1px solid #cfe0ff !important;
  background: #eef5ff !important;
  color: #2f6fcf !important;
  display: grid !important;
  place-items: center !important;
  font-size: 14px !important;
  font-weight: 950 !important;
}

.tplultimate-steps-022a2324 div {
  min-width: 0 !important;
  display: grid !important;
  gap: 2px !important;
}

.tplultimate-steps-022a2324 strong {
  color: #071a38 !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  line-height: 1.35 !important;
}

.tplultimate-steps-022a2324 span {
  color: #74839b !important;
  font-size: 11.6px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
}

.tplultimate-form-shell-022a2324 {
  min-height: 0 !important;
  overflow: auto !important;
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
}

.tplultimate-grid-022a2324 {
  padding: 20px 28px 18px !important;
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  gap: 15px 18px !important;
  align-content: start !important;
}

.tplultimate-field-022a2324 {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  gap: 8px !important;
  align-content: start !important;
}

.tplultimate-title-022a2324 {
  grid-column: span 6 !important;
}

.tplultimate-doctor-022a2324 {
  grid-column: span 6 !important;
}

.tplultimate-diagnosis-022a2324 {
  grid-column: 1 / -1 !important;
}

.tplultimate-procedure-022a2324 {
  grid-column: span 6 !important;
}

.tplultimate-tooth-022a2324 {
  grid-column: span 6 !important;
}

.tplultimate-price-022a2324 {
  grid-column: span 6 !important;
}

.tplultimate-discount-022a2324 {
  grid-column: span 6 !important;
}

.tplultimate-clean-label-022a2324 {
  color: #071a38 !important;
  font-size: 13.5px !important;
  font-weight: 950 !important;
  line-height: 1.35 !important;
}

.tplultimate-control-022a2324,
.tplultimate-modal-022a2324 input,
.tplultimate-modal-022a2324 textarea,
.tplultimate-modal-022a2324 select {
  width: 100% !important;
  min-height: 46px !important;
  border: 1px solid #dbe6f5 !important;
  border-radius: 13px !important;
  background: #fff !important;
  color: #071a38 !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  padding: 11px 14px !important;
  outline: none !important;
  box-shadow: none !important;
}

.tplultimate-modal-022a2324 textarea {
  min-height: 104px !important;
  resize: vertical !important;
  line-height: 1.7 !important;
}

.tplultimate-modal-022a2324 input:focus,
.tplultimate-modal-022a2324 textarea:focus,
.tplultimate-modal-022a2324 select:focus {
  border-color: #78a8ff !important;
  box-shadow: 0 0 0 4px rgba(47, 128, 237, .11) !important;
}

.tplultimate-price-022a2324,
.tplultimate-discount-022a2324 {
  position: relative !important;
}

.tplultimate-price-022a2324::after {
  content: "د.ع" !important;
  position: absolute !important;
  bottom: 13px !important;
  inset-inline-start: 14px !important;
  color: #8190a6 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  pointer-events: none !important;
}

.tplultimate-discount-022a2324::after {
  content: "خصم" !important;
  position: absolute !important;
  bottom: 13px !important;
  inset-inline-start: 14px !important;
  color: #8190a6 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  pointer-events: none !important;
}

.tplultimate-footer-022a2324 {
  min-height: 74px !important;
  padding: 14px 28px 18px !important;
  border-top: 1px solid #eef3fb !important;
  background: #fff !important;
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 12px !important;
}

.tplultimate-submit-022a2324 {
  min-width: 142px !important;
  height: 46px !important;
  border: 0 !important;
  border-radius: 13px !important;
  background: linear-gradient(135deg, #3565e8, #2d56d6) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  box-shadow: 0 12px 26px rgba(53, 101, 232, .22) !important;
  cursor: pointer !important;
}

.tplultimate-cancel-022a2324 {
  min-width: 92px !important;
  height: 46px !important;
  border: 1px solid #dce7f7 !important;
  border-radius: 13px !important;
  background: #f4f7fd !important;
  color: #3565e8 !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
}

@media (max-width: 920px) {
  .tplultimate-modal-022a2324 {
    width: calc(100vw - 24px) !important;
    max-height: calc(100vh - 24px) !important;
  }

  .tplultimate-topbar-022a2324,
  .tplultimate-steps-022a2324,
  .tplultimate-grid-022a2324,
  .tplultimate-footer-022a2324 {
    padding-inline: 18px !important;
  }

  .tplultimate-steps-022a2324,
  .tplultimate-grid-022a2324 {
    grid-template-columns: 1fr !important;
  }

  .tplultimate-field-022a2324,
  .tplultimate-title-022a2324,
  .tplultimate-doctor-022a2324,
  .tplultimate-diagnosis-022a2324,
  .tplultimate-procedure-022a2324,
  .tplultimate-tooth-022a2324,
  .tplultimate-price-022a2324,
  .tplultimate-discount-022a2324 {
    grid-column: 1 / -1 !important;
  }

  .tplultimate-footer-022a2324 {
    flex-direction: column-reverse !important;
    align-items: stretch !important;
  }

  .tplultimate-submit-022a2324,
  .tplultimate-cancel-022a2324 {
    width: 100% !important;
  }
}
/* 0.22A.23.2.4_TREATMENT_PLAN_MODAL_ULTIMATE_CLEAN_GRID_CSS_END */

/* 0.22A.23.2.5_TREATMENT_PLAN_MODAL_STABILITY_CLOSE_FIX_CSS_START */
html.tplstable-html-lock-022a2325,
body.tplstable-body-lock-022a2325 {
  overflow: hidden !important;
  height: 100% !important;
}

.tplstable-modal-022a2325 {
  position: fixed !important;
  inset: 24px !important;
  z-index: 100000 !important;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  min-height: 0 !important;
  transform: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 24px !important;
  background: #fff !important;
  border: 1px solid #dce7f5 !important;
  box-shadow: 0 30px 90px rgba(8, 26, 61, .30) !important;
  overflow: hidden !important;
  direction: rtl !important;
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
}

.tplstable-modal-022a2325 * {
  box-sizing: border-box !important;
}

.tplstable-modal-022a2325 .tplultimate-topbar-022a2324,
.tplstable-modal-022a2325 .tplultimate-steps-022a2324,
.tplstable-modal-022a2325 .tplfinal-topbar-022a2323,
.tplstable-modal-022a2325 .tplfinal-hint-022a2323,
.tplstable-modal-022a2325 .tpl-pro-guidance-022a2322,
.tplstable-modal-022a2325 .tpl-pro-section-labels-022a2322,
.tplstable-old-close-hidden-022a2325,
.tplstable-duplicate-label-hidden-022a2325,
.tplstable-modal-022a2325 .tplultimate-clean-label-022a2324,
.tplstable-modal-022a2325 .tplfinal-label-022a2323 {
  display: none !important;
}

.tplstable-topbar-022a2325 {
  min-height: 76px !important;
  padding: 18px 28px 14px !important;
  border-bottom: 1px solid #eef3fb !important;
  background: linear-gradient(180deg, #ffffff, #fbfdff) !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 18px !important;
}

.tplstable-titlebox-022a2325 {
  min-width: 0 !important;
  display: grid !important;
  gap: 4px !important;
}

.tplstable-titlebox-022a2325 h2 {
  margin: 0 !important;
  color: #071a38 !important;
  font-size: 23px !important;
  line-height: 1.25 !important;
  font-weight: 950 !important;
}

.tplstable-titlebox-022a2325 p {
  margin: 0 !important;
  color: #71809a !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  font-weight: 850 !important;
}

.tplstable-close-022a2325 {
  min-width: 86px !important;
  height: 42px !important;
  padding: 0 18px !important;
  border: 1px solid #dce7f7 !important;
  border-radius: 13px !important;
  background: #f4f7fd !important;
  color: #2f63df !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
}

.tplstable-close-022a2325:hover {
  background: #edf4ff !important;
}

.tplstable-steps-022a2325 {
  padding: 12px 28px !important;
  border-bottom: 1px solid #eef3fb !important;
  background: #f8fbff !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.tplstable-steps-022a2325 article {
  min-height: 54px !important;
  padding: 9px 12px !important;
  border: 1px solid #dbe9ff !important;
  border-radius: 15px !important;
  background: #fff !important;
  display: grid !important;
  grid-template-columns: 32px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
}

.tplstable-steps-022a2325 b {
  width: 30px !important;
  height: 30px !important;
  border-radius: 999px !important;
  border: 1px solid #cfe0ff !important;
  background: #eef5ff !important;
  color: #2f6fcf !important;
  display: grid !important;
  place-items: center !important;
  font-size: 13px !important;
  font-weight: 950 !important;
}

.tplstable-steps-022a2325 div {
  min-width: 0 !important;
  display: grid !important;
  gap: 1px !important;
}

.tplstable-steps-022a2325 strong {
  color: #071a38 !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  line-height: 1.35 !important;
}

.tplstable-steps-022a2325 span {
  color: #74839b !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
}

.tplstable-form-022a2325 {
  min-height: 0 !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) auto !important;
}

.tplstable-grid-022a2325 {
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 18px 28px 16px !important;
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  gap: 14px 18px !important;
  align-content: start !important;
}

.tplstable-field-022a2325 {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  gap: 7px !important;
  align-content: start !important;
}

.tplstable-field-title-022a2325,
.tplstable-field-doctor-022a2325,
.tplstable-field-procedure-022a2325,
.tplstable-field-tooth-022a2325,
.tplstable-field-price-022a2325,
.tplstable-field-discount-022a2325 {
  grid-column: span 6 !important;
}

.tplstable-field-diagnosis-022a2325 {
  grid-column: 1 / -1 !important;
}

.tplstable-label-022a2325 {
  color: #071a38 !important;
  font-size: 13.5px !important;
  font-weight: 950 !important;
  line-height: 1.35 !important;
}

.tplstable-control-022a2325,
.tplstable-modal-022a2325 input,
.tplstable-modal-022a2325 textarea,
.tplstable-modal-022a2325 select {
  width: 100% !important;
  min-height: 46px !important;
  border: 1px solid #dbe6f5 !important;
  border-radius: 13px !important;
  background: #fff !important;
  color: #071a38 !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  padding: 11px 14px !important;
  outline: none !important;
  box-shadow: none !important;
}

.tplstable-modal-022a2325 textarea {
  min-height: 96px !important;
  resize: vertical !important;
  line-height: 1.65 !important;
}

.tplstable-modal-022a2325 input:focus,
.tplstable-modal-022a2325 textarea:focus,
.tplstable-modal-022a2325 select:focus {
  border-color: #78a8ff !important;
  box-shadow: 0 0 0 4px rgba(47, 128, 237, .11) !important;
}

.tplstable-field-price-022a2325,
.tplstable-field-discount-022a2325 {
  position: relative !important;
}

.tplstable-field-price-022a2325::after {
  content: "د.ع" !important;
  position: absolute !important;
  bottom: 13px !important;
  inset-inline-start: 14px !important;
  color: #8190a6 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  pointer-events: none !important;
}

.tplstable-field-discount-022a2325::after {
  content: "خصم" !important;
  position: absolute !important;
  bottom: 13px !important;
  inset-inline-start: 14px !important;
  color: #8190a6 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  pointer-events: none !important;
}

.tplstable-footer-022a2325 {
  min-height: 72px !important;
  padding: 13px 28px 17px !important;
  border-top: 1px solid #eef3fb !important;
  background: #fff !important;
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 12px !important;
}

.tplstable-submit-022a2325 {
  min-width: 142px !important;
  height: 46px !important;
  border: 0 !important;
  border-radius: 13px !important;
  background: linear-gradient(135deg, #3565e8, #2d56d6) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  box-shadow: 0 12px 26px rgba(53, 101, 232, .22) !important;
  cursor: pointer !important;
}

.tplstable-cancel-022a2325 {
  min-width: 92px !important;
  height: 46px !important;
  border: 1px solid #dce7f7 !important;
  border-radius: 13px !important;
  background: #f4f7fd !important;
  color: #3565e8 !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
}

@media (max-width: 920px) {
  .tplstable-modal-022a2325 {
    inset: 12px !important;
  }

  .tplstable-topbar-022a2325,
  .tplstable-steps-022a2325,
  .tplstable-grid-022a2325,
  .tplstable-footer-022a2325 {
    padding-inline: 18px !important;
  }

  .tplstable-steps-022a2325,
  .tplstable-grid-022a2325 {
    grid-template-columns: 1fr !important;
  }

  .tplstable-field-022a2325 {
    grid-column: 1 / -1 !important;
  }

  .tplstable-footer-022a2325 {
    flex-direction: column-reverse !important;
    align-items: stretch !important;
  }

  .tplstable-submit-022a2325,
  .tplstable-cancel-022a2325 {
    width: 100% !important;
  }
}
/* 0.22A.23.2.5_TREATMENT_PLAN_MODAL_STABILITY_CLOSE_FIX_CSS_END */

/* 0.22A.24.0_HEALTH360_TREATMENT_PLAN_FULL_PAGE_REFERENCE_CSS_START */
.h360ref-loading-022a240{min-height:360px;display:grid;place-items:center;color:#64748b;font-weight:900}.h360ref-page-022a240{--teal:#008f89;--ink:#15233b;--muted:#6e7e96;--line:#e5edf6;min-height:calc(100vh - 20px);background:#f8fafc;color:var(--ink);padding:18px 20px 26px;font-family:inherit}.h360ref-page-022a240 *{box-sizing:border-box}.h360ref-titlebar{min-height:76px;display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:14px}.h360ref-titlebar nav{color:#8a98ad;font-size:12.5px;font-weight:800;margin-bottom:8px}.h360ref-titlebar h1{margin:0;color:#14213a;font-size:25px;line-height:1.2;font-weight:950}.h360ref-titlebar>span{width:38px;height:38px;border-radius:12px;border:1px solid var(--line);background:#fff;display:grid;place-items:center;color:#667896}.h360ref-patient-strip{min-height:86px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 8px 26px rgba(20,33,58,.04);display:grid;grid-template-columns:36px 58px minmax(160px,1fr) 1px minmax(110px,.55fr) 1px minmax(150px,.75fr) auto;gap:18px;align-items:center;padding:12px 18px;margin-bottom:18px}.h360ref-patient-strip>button,.h360ref-toolbar button,.h360ref-side button{height:38px;border:1px solid #dce7f4;border-radius:9px;background:#fff;color:#33445e;font-size:13px;font-weight:900;cursor:pointer;padding:0 14px}.h360ref-patient-strip>button:first-child{border:0;background:transparent;color:#8595ad;font-size:24px}.h360ref-patient-strip i{width:1px;height:42px;background:var(--line)}.h360ref-patient-strip .avatar{width:54px;height:54px;border-radius:999px;overflow:hidden;background:linear-gradient(135deg,#e8f7f5,#f4fafc);display:grid;place-items:center;border:1px solid #dce9f0;color:var(--teal);font-weight:950;font-size:20px}.h360ref-patient-strip .avatar img{width:100%;height:100%;object-fit:cover}.h360ref-patient-strip .person h2{margin:0 0 4px;font-size:16px;font-weight:950}.h360ref-patient-strip .person small,.h360ref-patient-strip span{color:#6e7e96;font-size:12.5px;font-weight:850}.h360ref-patient-strip b{display:block;color:#7b8aa0;font-size:12px;margin-bottom:5px}.h360ref-tabs{height:46px;display:flex;align-items:stretch;gap:20px;padding-inline:10px;border-bottom:1px solid var(--line);margin-bottom:16px}.h360ref-tabs button{border:0;background:transparent;color:#33445e;font-size:13px;font-weight:900;min-width:94px;position:relative;cursor:pointer}.h360ref-tabs button.active{color:var(--teal)}.h360ref-tabs button.active:after{content:"";position:absolute;height:3px;border-radius:999px;background:var(--teal);inset-inline:0;bottom:-1px}.h360ref-shell{display:grid;grid-template-columns:300px minmax(0,1fr);gap:18px;direction:ltr}.h360ref-shell>*{direction:rtl}.h360ref-side{display:grid;gap:14px;align-content:start}.h360ref-side article{border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:0 10px 28px rgba(20,33,58,.04);overflow:hidden}.h360ref-side header{min-height:48px;padding:13px 16px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;font-weight:950}.h360ref-side dl{margin:0;padding:12px 16px;display:grid;gap:12px}.h360ref-side dl div{display:flex;justify-content:space-between;gap:12px}.h360ref-side dt{color:#627089;font-size:12.5px;font-weight:850}.h360ref-side dd{margin:0;font-size:13px;font-weight:900}.danger{color:#e11d48!important}.ok{color:var(--teal)!important}.h360ref-side footer{margin:0 12px 12px;min-height:48px;border-radius:8px;background:#f0faf8;color:#006a71;display:flex;align-items:center;justify-content:space-between;padding:0 12px;font-weight:950}.h360ref-side p{padding:0 16px 12px;margin:0;color:#6f7f94;font-size:13px;line-height:1.8;font-weight:800}.h360ref-side .ring{--p:0;width:92px;height:92px;border-radius:999px;margin:18px auto 10px;display:grid;place-items:center;background:radial-gradient(closest-side,#fff 71%,transparent 73%),conic-gradient(#20b486 calc(var(--p)*1%),#e9edf2 0)}.h360ref-side .ring b{font-size:18px;font-weight:950}.h360ref-side button{width:calc(100% - 24px);margin:0 12px 14px;background:#f3fbfa;color:#006a71}.h360ref-toolbar{min-height:64px;border:1px solid var(--line);border-radius:12px 12px 0 0;background:#fff;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:14px}.h360ref-toolbar>div{display:flex;align-items:center;gap:10px}.h360ref-toolbar button.primary{background:var(--teal);border-color:var(--teal);color:#fff;min-width:124px}.h360ref-toolbar label{display:flex;align-items:center;gap:10px;color:#516178;font-size:13px;font-weight:850}.h360ref-toolbar label button{min-width:150px;color:var(--teal);background:#f3fbfa}.h360ref-table-card{border:1px solid var(--line);border-top:0;border-radius:0 0 12px 12px;background:#fff;overflow:hidden;box-shadow:0 10px 28px rgba(20,33,58,.04)}.h360ref-table-card table{width:100%;border-collapse:collapse;table-layout:fixed}.h360ref-table-card th{height:44px;padding:0 10px;background:#fbfcfe;border-bottom:1px solid var(--line);color:#516178;font-size:12px;font-weight:950;text-align:right}.h360ref-table-card td{min-height:54px;padding:10px;border-bottom:1px solid #edf2f8;color:#33445e;font-size:12.5px;font-weight:850;vertical-align:middle}.h360ref-table-card tr:last-child td{border-bottom:0}.h360ref-table-card .proc{display:grid;gap:4px}.h360ref-table-card .proc b{color:#15233b;font-size:13px;font-weight:950}.h360ref-table-card .proc span{color:#8a98ad;font-size:11.5px;font-weight:800}.h360ref-table-card em{min-width:78px;height:28px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 9px;font-style:normal;font-size:11.5px;font-weight:950}.h360ref-table-card em.done{background:#ecfbf4;color:#07835e;border:1px solid #c5efd9}.h360ref-table-card em.progress{background:#fff7e8;color:#d97706;border:1px solid #fde2ae}.h360ref-table-card em.planned{background:#eef6ff;color:#2563eb;border:1px solid #cfe3ff}.h360ref-table-card .dots{color:#7b8aa0;font-size:20px;text-align:center}@media(max-width:1180px){.h360ref-shell{grid-template-columns:1fr}.h360ref-side{grid-template-columns:repeat(2,minmax(0,1fr));order:2}.h360ref-shell main{order:1}}@media(max-width:840px){.h360ref-page-022a240{padding:12px}.h360ref-patient-strip{grid-template-columns:42px minmax(0,1fr)}.h360ref-patient-strip>button:first-child,.h360ref-patient-strip i,.h360ref-patient-strip>div:not(.avatar):not(.person){display:none}.h360ref-tabs,.h360ref-toolbar>div{overflow-x:auto}.h360ref-side{grid-template-columns:1fr}.h360ref-table-card{overflow-x:auto}.h360ref-table-card table{min-width:880px}}
/* 0.22A.24.0_HEALTH360_TREATMENT_PLAN_FULL_PAGE_REFERENCE_CSS_END */

/* 0.22A.24.1_HEALTH360_TREATMENT_PLAN_FULLSCREEN_REFERENCE_FINAL_CSS_START */
body.h360rfinal-body-lock-022a241 {
  overflow: hidden !important;
}

#h360rfinal-stage-022a241 {
  position: fixed !important;
  inset: 0 !important;
  z-index: 99990 !important;
  background: #f8fafc !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 248px !important;
  direction: ltr !important;
  overflow: hidden !important;
  font-family: inherit !important;
  color: #15233b !important;
}

#h360rfinal-stage-022a241 * {
  box-sizing: border-box !important;
}

.h360rfinal-sidebar {
  direction: rtl !important;
  background: linear-gradient(180deg, #073e48 0%, #064550 44%, #0a5660 100%) !important;
  color: #fff !important;
  padding: 24px 18px 18px !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) auto auto !important;
  gap: 18px !important;
  overflow: hidden !important;
}

.h360rfinal-logo {
  min-height: 70px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 44px !important;
  grid-template-areas: "title tooth" "sub tooth" !important;
  column-gap: 10px !important;
  align-items: center !important;
}

.h360rfinal-logo strong {
  grid-area: title !important;
  font-size: 27px !important;
  line-height: 1.1 !important;
  font-weight: 950 !important;
  letter-spacing: -.4px !important;
}

.h360rfinal-logo span {
  grid-area: sub !important;
  color: rgba(255,255,255,.78) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

.h360rfinal-logo b {
  grid-area: tooth !important;
  font-size: 34px !important;
}

.h360rfinal-sidebar nav {
  display: grid !important;
  gap: 8px !important;
  align-content: start !important;
  overflow: auto !important;
  padding-inline-end: 2px !important;
}

.h360rfinal-sidebar nav button {
  height: 48px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: rgba(255,255,255,.88) !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  text-align: right !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.h360rfinal-sidebar nav button i {
  font-style: normal !important;
  font-size: 20px !important;
  text-align: center !important;
}

.h360rfinal-sidebar nav button.active {
  background: rgba(255,255,255,.12) !important;
  box-shadow: inset 4px 0 0 #18d8ad !important;
}

.h360rfinal-sidebar nav button.active i {
  color: #19deb1 !important;
}

.h360rfinal-switch {
  height: 52px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 14px !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}

.h360rfinal-user {
  min-height: 52px !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) 10px !important;
  gap: 10px !important;
  align-items: center !important;
}

.h360rfinal-user-avatar {
  width: 44px !important;
  height: 44px !important;
  border-radius: 999px !important;
  background: #e6f7f5 !important;
  color: #006a71 !important;
  display: grid !important;
  place-items: center !important;
  font-weight: 950 !important;
}

.h360rfinal-user strong {
  display: block !important;
  color: #fff !important;
  font-size: 12.5px !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.h360rfinal-user span {
  color: rgba(255,255,255,.72) !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
}

.h360rfinal-user b {
  width: 9px !important;
  height: 9px !important;
  border-radius: 999px !important;
  background: #23d9ad !important;
}

.h360rfinal-workspace {
  min-width: 0 !important;
  height: 100vh !important;
  overflow: auto !important;
  direction: rtl !important;
  background: #f8fafc !important;
  padding: 0 18px 24px !important;
}

.h360rfinal-topbar {
  height: 78px !important;
  margin: 0 -18px 0 !important;
  padding: 0 18px !important;
  background: #fff !important;
  border-bottom: 1px solid #e5edf6 !important;
  box-shadow: 0 8px 24px rgba(20,33,58,.04) !important;
  display: grid !important;
  grid-template-columns: 240px 98px minmax(280px, 1fr) 260px !important;
  gap: 18px !important;
  align-items: center !important;
  direction: ltr !important;
}

.h360rfinal-topbar > * {
  direction: rtl !important;
}

.h360rfinal-doctor {
  height: 52px !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) 18px !important;
  gap: 9px !important;
  align-items: center !important;
  border: 1px solid #e5edf6 !important;
  border-radius: 12px !important;
  padding: 5px 8px !important;
  background: #fff !important;
}

.h360rfinal-doc-avatar {
  width: 40px !important;
  height: 40px !important;
  border-radius: 999px !important;
  background: #e8f7f5 !important;
  color: #006a71 !important;
  display: grid !important;
  place-items: center !important;
  font-weight: 950 !important;
}

.h360rfinal-doctor strong,
.h360rfinal-branch span {
  display: block !important;
  color: #15233b !important;
  font-size: 12.5px !important;
  font-weight: 950 !important;
}

.h360rfinal-doctor span,
.h360rfinal-branch small {
  color: #6e7e96 !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
}

.h360rfinal-doctor em {
  color: #8997ac !important;
  font-style: normal !important;
}

.h360rfinal-top-icons {
  display: flex !important;
  gap: 12px !important;
}

.h360rfinal-top-icons button {
  position: relative !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 999px !important;
  border: 0 !important;
  background: #f5f8fc !important;
  color: #61718a !important;
}

.h360rfinal-top-icons b {
  position: absolute !important;
  top: -6px !important;
  right: -4px !important;
  min-width: 18px !important;
  height: 18px !important;
  border-radius: 999px !important;
  background: #008f89 !important;
  color: #fff !important;
  display: grid !important;
  place-items: center !important;
  font-size: 10px !important;
}

.h360rfinal-search {
  height: 42px !important;
  border: 1px solid #e5edf6 !important;
  border-radius: 10px !important;
  background: #fff !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 34px !important;
  align-items: center !important;
  padding-inline: 10px !important;
}

.h360rfinal-search input {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: #15233b !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

.h360rfinal-search span {
  color: #71809a !important;
  font-size: 19px !important;
  text-align: center !important;
}

.h360rfinal-branch {
  height: 52px !important;
  border: 1px solid #e5edf6 !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: #15233b !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 18px !important;
  grid-template-rows: 20px 18px !important;
  align-items: center !important;
  padding: 7px 12px !important;
  text-align: right !important;
}

.h360rfinal-branch b {
  grid-column: 2 !important;
  grid-row: 1 / 3 !important;
  color: #8594aa !important;
  font-size: 15px !important;
}

.h360rfinal-title {
  min-height: 78px !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  padding-bottom: 14px !important;
}

.h360rfinal-title nav {
  color: #8a98ad !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
  margin-bottom: 7px !important;
}

.h360rfinal-title nav span {
  margin-inline: 8px !important;
  color: #b4bdcc !important;
}

.h360rfinal-title nav b {
  color: #008f89 !important;
}

.h360rfinal-title h1 {
  margin: 0 !important;
  color: #15233b !important;
  font-size: 25px !important;
  line-height: 1.2 !important;
  font-weight: 950 !important;
}

.h360rfinal-title i {
  width: 38px !important;
  height: 38px !important;
  border-radius: 12px !important;
  border: 1px solid #e5edf6 !important;
  background: #fff !important;
  color: #6e7e96 !important;
  display: grid !important;
  place-items: center !important;
  font-style: normal !important;
}

.h360rfinal-patient {
  min-height: 86px !important;
  border: 1px solid #e5edf6 !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 8px 26px rgba(20,33,58,.04) !important;
  display: grid !important;
  grid-template-columns: 36px 58px minmax(160px, 1fr) 1px minmax(110px,.55fr) 1px minmax(150px,.75fr) auto !important;
  gap: 18px !important;
  align-items: center !important;
  padding: 12px 18px !important;
  margin-bottom: 18px !important;
}

.h360rfinal-arrow {
  width: 32px !important;
  height: 32px !important;
  border: 0 !important;
  background: transparent !important;
  color: #8595ad !important;
  font-size: 24px !important;
}

.h360rfinal-avatar {
  width: 54px !important;
  height: 54px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: linear-gradient(135deg,#e8f7f5,#f4fafc) !important;
  border: 1px solid #dce9f0 !important;
  display: grid !important;
  place-items: center !important;
  color: #008f89 !important;
  font-size: 20px !important;
  font-weight: 950 !important;
}

.h360rfinal-avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.h360rfinal-person h2 {
  margin: 0 0 4px !important;
  color: #15233b !important;
  font-size: 16px !important;
  font-weight: 950 !important;
}

.h360rfinal-person span,
.h360rfinal-info b {
  color: #6e7e96 !important;
  font-size: 12.5px !important;
  font-weight: 850 !important;
}

.h360rfinal-info {
  display: grid !important;
  gap: 5px !important;
}

.h360rfinal-info span {
  color: #25344d !important;
  font-size: 13.5px !important;
  font-weight: 900 !important;
}

.h360rfinal-divider {
  width: 1px !important;
  height: 42px !important;
  background: #e5edf6 !important;
}

.h360rfinal-file,
.h360rfinal-toolbar button,
.h360rfinal-planstate button,
.h360rfinal-card button {
  height: 38px !important;
  border: 1px solid #dce7f4 !important;
  border-radius: 9px !important;
  background: #fff !important;
  color: #33445e !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
  padding: 0 14px !important;
}

.h360rfinal-tabs {
  height: 46px !important;
  display: flex !important;
  align-items: stretch !important;
  gap: 20px !important;
  padding-inline: 10px !important;
  border-bottom: 1px solid #e5edf6 !important;
  margin-bottom: 16px !important;
}

.h360rfinal-tabs button {
  min-width: 94px !important;
  border: 0 !important;
  background: transparent !important;
  color: #33445e !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  position: relative !important;
  cursor: pointer !important;
}

.h360rfinal-tabs button.active {
  color: #008f89 !important;
}

.h360rfinal-tabs button.active::after {
  content: "" !important;
  position: absolute !important;
  height: 3px !important;
  border-radius: 999px !important;
  background: #008f89 !important;
  inset-inline: 0 !important;
  bottom: -1px !important;
}

.h360rfinal-content {
  display: grid !important;
  grid-template-columns: 300px minmax(0,1fr) !important;
  gap: 18px !important;
  direction: ltr !important;
  align-items: start !important;
}

.h360rfinal-content > * {
  direction: rtl !important;
}

.h360rfinal-cards {
  display: grid !important;
  gap: 14px !important;
  align-content: start !important;
}

.h360rfinal-card {
  border: 1px solid #e5edf6 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 10px 28px rgba(20,33,58,.04) !important;
  overflow: hidden !important;
}

.h360rfinal-card header {
  min-height: 48px !important;
  padding: 13px 16px !important;
  border-bottom: 1px solid #e5edf6 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.h360rfinal-card header strong {
  color: #15233b !important;
  font-size: 14px !important;
  font-weight: 950 !important;
}

.h360rfinal-card dl {
  margin: 0 !important;
  padding: 12px 16px !important;
  display: grid !important;
  gap: 12px !important;
}

.h360rfinal-card dl div,
.h360rfinal-paylines span {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

.h360rfinal-card dt {
  color: #627089 !important;
  font-size: 12.5px !important;
  font-weight: 850 !important;
}

.h360rfinal-card dd {
  margin: 0 !important;
  color: #15233b !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}

.h360rfinal-card .danger {
  color: #e11d48 !important;
}

.h360rfinal-card .ok {
  color: #008f89 !important;
}

.h360rfinal-card.summary footer {
  margin: 0 12px 12px !important;
  min-height: 48px !important;
  border-radius: 8px !important;
  background: #f0faf8 !important;
  color: #006a71 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 12px !important;
  font-weight: 950 !important;
}

.h360rfinal-ring {
  --p: 0;
  width: 92px !important;
  height: 92px !important;
  border-radius: 999px !important;
  margin: 18px auto 10px !important;
  display: grid !important;
  place-items: center !important;
  background: radial-gradient(closest-side,#fff 71%,transparent 73%), conic-gradient(#20b486 calc(var(--p) * 1%), #e9edf2 0) !important;
}

.h360rfinal-ring b {
  color: #15233b !important;
  font-size: 18px !important;
  font-weight: 950 !important;
}

.h360rfinal-paylines {
  padding: 0 16px 12px !important;
  display: grid !important;
  gap: 6px !important;
  font-size: 12.5px !important;
  font-weight: 850 !important;
  color: #65748c !important;
}

.h360rfinal-card button {
  width: calc(100% - 24px) !important;
  margin: 0 12px 14px !important;
  background: #f3fbfa !important;
  color: #006a71 !important;
}

.h360rfinal-card.notes p {
  margin: 0 !important;
  padding: 14px 16px 20px !important;
  color: #6f7f94 !important;
  font-size: 13px !important;
  line-height: 1.8 !important;
  font-weight: 800 !important;
}

.h360rfinal-plan {
  min-width: 0 !important;
}

.h360rfinal-toolbar {
  min-height: 64px !important;
  border: 1px solid #e5edf6 !important;
  border-radius: 12px 12px 0 0 !important;
  background: #fff !important;
  padding: 12px 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
}

.h360rfinal-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.h360rfinal-toolbar button.primary {
  min-width: 124px !important;
  background: #008f89 !important;
  border-color: #008f89 !important;
  color: #fff !important;
}

.h360rfinal-planstate {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: #516178 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

.h360rfinal-planstate button {
  min-width: 150px !important;
  color: #008f89 !important;
  background: #f3fbfa !important;
}

.h360rfinal-tablebox {
  border: 1px solid #e5edf6 !important;
  border-top: 0 !important;
  border-radius: 0 0 12px 12px !important;
  background: #fff !important;
  overflow: hidden !important;
  box-shadow: 0 10px 28px rgba(20,33,58,.04) !important;
}

.h360rfinal-tablebox table {
  width: 100% !important;
  border-collapse: collapse !important;
  table-layout: fixed !important;
}

.h360rfinal-tablebox th {
  height: 44px !important;
  padding: 0 10px !important;
  background: #fbfcfe !important;
  border-bottom: 1px solid #e5edf6 !important;
  color: #516178 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  text-align: right !important;
}

.h360rfinal-tablebox td {
  padding: 10px !important;
  border-bottom: 1px solid #edf2f8 !important;
  color: #33445e !important;
  font-size: 12.5px !important;
  font-weight: 850 !important;
  vertical-align: middle !important;
}

.h360rfinal-tablebox tr:last-child td {
  border-bottom: 0 !important;
}

.h360rfinal-num {
  width: 42px !important;
  color: #77879f !important;
}

.h360rfinal-procedure {
  display: grid !important;
  gap: 4px !important;
}

.h360rfinal-procedure strong {
  color: #15233b !important;
  font-size: 13px !important;
  font-weight: 950 !important;
}

.h360rfinal-procedure span {
  color: #8a98ad !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
}

.h360rfinal-status {
  min-width: 78px !important;
  height: 28px !important;
  border-radius: 7px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  padding: 0 9px !important;
  font-size: 11.5px !important;
  font-weight: 950 !important;
  border: 1px solid transparent !important;
}

.h360rfinal-status.done {
  background: #ecfbf4 !important;
  color: #07835e !important;
  border-color: #c5efd9 !important;
}

.h360rfinal-status.progress {
  background: #fff7e8 !important;
  color: #d97706 !important;
  border-color: #fde2ae !important;
}

.h360rfinal-status.planned {
  background: #eef6ff !important;
  color: #2563eb !important;
  border-color: #cfe3ff !important;
}

.h360rfinal-menu {
  color: #7b8aa0 !important;
  font-size: 20px !important;
  text-align: center !important;
}

@media (max-width: 1180px) {
  #h360rfinal-stage-022a241 {
    grid-template-columns: minmax(0,1fr) 220px !important;
  }

  .h360rfinal-content {
    grid-template-columns: 1fr !important;
  }

  .h360rfinal-cards {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    order: 2 !important;
  }

  .h360rfinal-plan {
    order: 1 !important;
  }
}

@media (max-width: 820px) {
  #h360rfinal-stage-022a241 {
    grid-template-columns: 1fr !important;
  }

  .h360rfinal-sidebar {
    display: none !important;
  }

  .h360rfinal-topbar {
    grid-template-columns: 1fr !important;
    height: auto !important;
    padding-block: 12px !important;
  }

  .h360rfinal-patient {
    grid-template-columns: 54px minmax(0,1fr) !important;
  }

  .h360rfinal-arrow,
  .h360rfinal-divider,
  .h360rfinal-info {
    display: none !important;
  }

  .h360rfinal-tabs,
  .h360rfinal-actions {
    overflow-x: auto !important;
  }

  .h360rfinal-cards {
    grid-template-columns: 1fr !important;
  }

  .h360rfinal-tablebox {
    overflow-x: auto !important;
  }

  .h360rfinal-tablebox table {
    min-width: 880px !important;
  }
}
/* 0.22A.24.1_HEALTH360_TREATMENT_PLAN_FULLSCREEN_REFERENCE_FINAL_CSS_END */

/* 0.22A.24.2_HEALTH360_TREATMENT_PLAN_REFERENCE_PIXEL_FINAL_CSS_START */
body.h360pixel-body-lock-022a242 {
  overflow: hidden !important;
}

#h360pixel-stage-022a242 {
  position: fixed !important;
  inset: 0 !important;
  z-index: 99995 !important;
  background: #f8fafc !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 244px !important;
  direction: ltr !important;
  overflow: hidden !important;
  color: #15233b !important;
  font-family: inherit !important;
}

#h360pixel-stage-022a242 * {
  box-sizing: border-box !important;
}

.h360pixel-sidebar {
  direction: rtl !important;
  background: linear-gradient(180deg, #073d47 0%, #064752 45%, #095763 100%) !important;
  color: #fff !important;
  padding: 22px 16px 16px !important;
  display: grid !important;
  grid-template-rows: 78px minmax(0, 1fr) 52px 54px !important;
  gap: 14px !important;
  overflow: hidden !important;
}

.h360pixel-logo {
  display: grid !important;
  grid-template-columns: 48px minmax(0,1fr) !important;
  grid-template-rows: 36px 24px !important;
  gap: 0 9px !important;
  align-items: center !important;
}

.h360pixel-logo b {
  grid-row: 1 / 3 !important;
  font-size: 37px !important;
  line-height: 1 !important;
}

.h360pixel-logo strong {
  font-size: 29px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: -.6px !important;
}

.h360pixel-logo span {
  color: rgba(255,255,255,.78) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

.h360pixel-sidebar nav {
  display: grid !important;
  gap: 7px !important;
  align-content: start !important;
  overflow: hidden !important;
}

.h360pixel-sidebar nav button {
  height: 46px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: rgba(255,255,255,.9) !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0,1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  padding: 0 12px !important;
  text-align: right !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.h360pixel-sidebar nav button i {
  font-style: normal !important;
  text-align: center !important;
  font-size: 19px !important;
}

.h360pixel-sidebar nav button.active {
  background: rgba(255,255,255,.12) !important;
  box-shadow: inset 4px 0 0 #18d8ad !important;
}

.h360pixel-sidebar nav button.active i {
  color: #19deb1 !important;
}

.h360pixel-switch {
  height: 52px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  padding: 0 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}

.h360pixel-user {
  height: 54px !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0,1fr) 10px !important;
  gap: 10px !important;
  align-items: center !important;
}

.h360pixel-user > div {
  width: 44px !important;
  height: 44px !important;
  border-radius: 999px !important;
  background: #e6f7f5 !important;
  color: #006a71 !important;
  display: grid !important;
  place-items: center !important;
  font-weight: 950 !important;
}

.h360pixel-user p {
  margin: 0 !important;
  min-width: 0 !important;
  display: grid !important;
  gap: 2px !important;
}

.h360pixel-user strong {
  color: #fff !important;
  font-size: 12.5px !important;
  font-weight: 950 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.h360pixel-user span {
  color: rgba(255,255,255,.72) !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
}

.h360pixel-user b {
  width: 9px !important;
  height: 9px !important;
  border-radius: 999px !important;
  background: #23d9ad !important;
}

.h360pixel-workspace {
  direction: rtl !important;
  height: 100vh !important;
  min-width: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: #f8fafc !important;
  padding: 0 18px 22px !important;
}

.h360pixel-topbar {
  height: 78px !important;
  margin: 0 -18px !important;
  padding: 0 18px !important;
  background: #fff !important;
  border-bottom: 1px solid #e5edf6 !important;
  box-shadow: 0 8px 24px rgba(20,33,58,.04) !important;
  display: grid !important;
  grid-template-columns: 250px 96px minmax(300px, 1fr) 270px !important;
  gap: 18px !important;
  align-items: center !important;
  direction: ltr !important;
}

.h360pixel-topbar > * {
  direction: rtl !important;
}

.h360pixel-profile,
.h360pixel-branch {
  height: 52px !important;
  border: 1px solid #e5edf6 !important;
  border-radius: 12px !important;
  background: #fff !important;
}

.h360pixel-profile {
  display: grid !important;
  grid-template-columns: 44px minmax(0,1fr) 18px !important;
  gap: 9px !important;
  align-items: center !important;
  padding: 5px 8px !important;
}

.h360pixel-profile .avatar {
  width: 40px !important;
  height: 40px !important;
  border-radius: 999px !important;
  background: #e8f7f5 !important;
  color: #006a71 !important;
  display: grid !important;
  place-items: center !important;
  font-weight: 950 !important;
}

.h360pixel-profile p {
  margin: 0 !important;
  display: grid !important;
  gap: 2px !important;
}

.h360pixel-profile strong,
.h360pixel-branch strong {
  color: #15233b !important;
  font-size: 12.5px !important;
  font-weight: 950 !important;
}

.h360pixel-profile span,
.h360pixel-branch span {
  color: #6e7e96 !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
}

.h360pixel-profile em,
.h360pixel-branch em {
  color: #8897ad !important;
  font-style: normal !important;
}

.h360pixel-icons {
  display: flex !important;
  gap: 12px !important;
}

.h360pixel-icons button {
  position: relative !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 999px !important;
  border: 0 !important;
  background: #f5f8fc !important;
  color: #61718a !important;
}

.h360pixel-icons b {
  position: absolute !important;
  top: -6px !important;
  right: -4px !important;
  min-width: 18px !important;
  height: 18px !important;
  border-radius: 999px !important;
  background: #008f89 !important;
  color: #fff !important;
  display: grid !important;
  place-items: center !important;
  font-size: 10px !important;
}

.h360pixel-search {
  height: 42px !important;
  border: 1px solid #e5edf6 !important;
  border-radius: 10px !important;
  background: #fff !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 34px !important;
  align-items: center !important;
  padding: 0 10px !important;
}

.h360pixel-search input {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: #15233b !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

.h360pixel-search span {
  color: #71809a !important;
  text-align: center !important;
  font-size: 19px !important;
}

.h360pixel-branch {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 18px !important;
  grid-template-rows: 20px 18px !important;
  align-items: center !important;
  padding: 7px 12px !important;
  text-align: right !important;
}

.h360pixel-branch em {
  grid-column: 2 !important;
  grid-row: 1 / 3 !important;
}

.h360pixel-titlebar {
  height: 74px !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  padding-bottom: 12px !important;
}

.h360pixel-titlebar nav {
  display: block !important;
  color: #8a98ad !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
  margin-bottom: 7px !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.h360pixel-titlebar nav span {
  color: #b4bdcc !important;
  margin-inline: 8px !important;
}

.h360pixel-titlebar nav b {
  color: #008f89 !important;
}

.h360pixel-titlebar h1 {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  margin: 0 !important;
  color: #15233b !important;
  font-size: 25px !important;
  line-height: 1.15 !important;
  font-weight: 950 !important;
}

.h360pixel-titlebar i {
  width: 38px !important;
  height: 38px !important;
  border-radius: 12px !important;
  border: 1px solid #e5edf6 !important;
  background: #fff !important;
  color: #6e7e96 !important;
  display: grid !important;
  place-items: center !important;
  font-style: normal !important;
}

.h360pixel-patient {
  min-height: 86px !important;
  border: 1px solid #e5edf6 !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 8px 26px rgba(20,33,58,.04) !important;
  display: grid !important;
  grid-template-columns: 36px 58px minmax(160px, 1fr) 1px minmax(110px,.55fr) 1px minmax(150px,.75fr) auto !important;
  gap: 18px !important;
  align-items: center !important;
  padding: 12px 18px !important;
  margin-bottom: 16px !important;
}

.h360pixel-patient .arrow {
  width: 32px !important;
  height: 32px !important;
  border: 0 !important;
  background: transparent !important;
  color: #8595ad !important;
  font-size: 24px !important;
}

.h360pixel-patient .photo {
  width: 54px !important;
  height: 54px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: linear-gradient(135deg,#e8f7f5,#f4fafc) !important;
  border: 1px solid #dce9f0 !important;
  display: grid !important;
  place-items: center !important;
  color: #008f89 !important;
  font-size: 20px !important;
  font-weight: 950 !important;
}

.h360pixel-patient .photo img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.h360pixel-patient .name h2 {
  margin: 0 0 4px !important;
  color: #15233b !important;
  font-size: 16px !important;
  font-weight: 950 !important;
}

.h360pixel-patient .name span,
.h360pixel-patient .info b {
  color: #6e7e96 !important;
  font-size: 12.5px !important;
  font-weight: 850 !important;
}

.h360pixel-patient .info {
  display: grid !important;
  gap: 5px !important;
}

.h360pixel-patient .info span {
  color: #25344d !important;
  font-size: 13.5px !important;
  font-weight: 900 !important;
}

.h360pixel-patient .sep {
  width: 1px !important;
  height: 42px !important;
  background: #e5edf6 !important;
}

.h360pixel-patient .file,
.h360pixel-toolbar button,
.h360pixel-card button,
.h360pixel-toolbar .state button {
  height: 38px !important;
  border: 1px solid #dce7f4 !important;
  border-radius: 9px !important;
  background: #fff !important;
  color: #33445e !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
  padding: 0 14px !important;
}

.h360pixel-tabs {
  height: 44px !important;
  display: flex !important;
  align-items: stretch !important;
  gap: 20px !important;
  padding-inline: 10px !important;
  border-bottom: 1px solid #e5edf6 !important;
  margin-bottom: 16px !important;
}

.h360pixel-tabs button {
  min-width: 94px !important;
  border: 0 !important;
  background: transparent !important;
  color: #33445e !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  position: relative !important;
  cursor: pointer !important;
}

.h360pixel-tabs button.active {
  color: #008f89 !important;
}

.h360pixel-tabs button.active::after {
  content: "" !important;
  position: absolute !important;
  height: 3px !important;
  border-radius: 999px !important;
  background: #008f89 !important;
  inset-inline: 0 !important;
  bottom: -1px !important;
}

.h360pixel-content {
  display: grid !important;
  grid-template-columns: 300px minmax(0,1fr) !important;
  gap: 18px !important;
  direction: ltr !important;
  align-items: start !important;
}

.h360pixel-content > * {
  direction: rtl !important;
}

.h360pixel-leftcards {
  display: grid !important;
  gap: 14px !important;
  align-content: start !important;
}

.h360pixel-card {
  border: 1px solid #e5edf6 !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: 0 10px 28px rgba(20,33,58,.04) !important;
  overflow: hidden !important;
}

.h360pixel-card header {
  min-height: 48px !important;
  padding: 13px 16px !important;
  border-bottom: 1px solid #e5edf6 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.h360pixel-card header strong {
  color: #15233b !important;
  font-size: 14px !important;
  font-weight: 950 !important;
}

.h360pixel-card dl {
  margin: 0 !important;
  padding: 12px 16px !important;
  display: grid !important;
  gap: 12px !important;
}

.h360pixel-card dl div,
.h360pixel-card .paylines span {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

.h360pixel-card dt {
  color: #627089 !important;
  font-size: 12.5px !important;
  font-weight: 850 !important;
}

.h360pixel-card dd {
  margin: 0 !important;
  color: #15233b !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}

.h360pixel-card .danger {
  color: #e11d48 !important;
}

.h360pixel-card .ok {
  color: #008f89 !important;
}

.h360pixel-card.summary footer {
  margin: 0 12px 12px !important;
  min-height: 48px !important;
  border-radius: 8px !important;
  background: #f0faf8 !important;
  color: #006a71 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 12px !important;
  font-weight: 950 !important;
}

.h360pixel-card .ring {
  --p: 0;
  width: 92px !important;
  height: 92px !important;
  border-radius: 999px !important;
  margin: 18px auto 10px !important;
  display: grid !important;
  place-items: center !important;
  background: radial-gradient(closest-side,#fff 71%,transparent 73%), conic-gradient(#20b486 calc(var(--p) * 1%), #e9edf2 0) !important;
}

.h360pixel-card .ring b {
  color: #15233b !important;
  font-size: 18px !important;
  font-weight: 950 !important;
}

.h360pixel-card .paylines {
  padding: 0 16px 12px !important;
  display: grid !important;
  gap: 6px !important;
  color: #65748c !important;
  font-size: 12.5px !important;
  font-weight: 850 !important;
}

.h360pixel-card button {
  width: calc(100% - 24px) !important;
  margin: 0 12px 14px !important;
  background: #f3fbfa !important;
  color: #006a71 !important;
}

.h360pixel-card.notes p {
  margin: 0 !important;
  padding: 14px 16px 20px !important;
  color: #6f7f94 !important;
  font-size: 13px !important;
  line-height: 1.8 !important;
  font-weight: 800 !important;
}

.h360pixel-plan {
  min-width: 0 !important;
}

.h360pixel-toolbar {
  min-height: 64px !important;
  border: 1px solid #e5edf6 !important;
  border-radius: 12px 12px 0 0 !important;
  background: #fff !important;
  padding: 12px 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
}

.h360pixel-toolbar .actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.h360pixel-toolbar button.primary {
  min-width: 124px !important;
  background: #008f89 !important;
  border-color: #008f89 !important;
  color: #fff !important;
}

.h360pixel-toolbar .state {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: #516178 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

.h360pixel-toolbar .state button {
  min-width: 150px !important;
  color: #008f89 !important;
  background: #f3fbfa !important;
}

.h360pixel-tablebox {
  border: 1px solid #e5edf6 !important;
  border-top: 0 !important;
  border-radius: 0 0 12px 12px !important;
  background: #fff !important;
  overflow: hidden !important;
  box-shadow: 0 10px 28px rgba(20,33,58,.04) !important;
}

.h360pixel-tablebox table {
  width: 100% !important;
  border-collapse: collapse !important;
  table-layout: fixed !important;
}

.h360pixel-tablebox th {
  height: 44px !important;
  padding: 0 10px !important;
  background: #fbfcfe !important;
  border-bottom: 1px solid #e5edf6 !important;
  color: #516178 !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  text-align: right !important;
}

.h360pixel-tablebox td {
  padding: 10px !important;
  border-bottom: 1px solid #edf2f8 !important;
  color: #33445e !important;
  font-size: 12.5px !important;
  font-weight: 850 !important;
  vertical-align: middle !important;
}

.h360pixel-tablebox tr:last-child td {
  border-bottom: 0 !important;
}

.h360pixel-proc {
  display: grid !important;
  grid-template-columns: 26px minmax(0,1fr) !important;
  gap: 8px !important;
  align-items: center !important;
}

.h360pixel-proc .tooth {
  color: #2f7df6 !important;
  font-size: 18px !important;
}

.h360pixel-proc strong {
  display: block !important;
  color: #15233b !important;
  font-size: 13px !important;
  font-weight: 950 !important;
}

.h360pixel-proc small {
  display: block !important;
  color: #8a98ad !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  margin-top: 2px !important;
}

.h360pixel-status {
  min-width: 78px !important;
  height: 28px !important;
  border-radius: 7px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  padding: 0 9px !important;
  font-size: 11.5px !important;
  font-weight: 950 !important;
  border: 1px solid transparent !important;
}

.h360pixel-status.done {
  background: #ecfbf4 !important;
  color: #07835e !important;
  border-color: #c5efd9 !important;
}

.h360pixel-status.progress {
  background: #fff7e8 !important;
  color: #d97706 !important;
  border-color: #fde2ae !important;
}

.h360pixel-status.planned {
  background: #eef6ff !important;
  color: #2563eb !important;
  border-color: #cfe3ff !important;
}

.h360pixel-menu {
  color: #7b8aa0 !important;
  font-size: 20px !important;
  text-align: center !important;
}

@media (max-width: 1180px) {
  #h360pixel-stage-022a242 {
    grid-template-columns: minmax(0,1fr) 220px !important;
  }

  .h360pixel-content {
    grid-template-columns: 1fr !important;
  }

  .h360pixel-leftcards {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    order: 2 !important;
  }

  .h360pixel-plan {
    order: 1 !important;
  }
}

@media (max-width: 820px) {
  #h360pixel-stage-022a242 {
    grid-template-columns: 1fr !important;
  }

  .h360pixel-sidebar {
    display: none !important;
  }

  .h360pixel-topbar {
    height: auto !important;
    padding-block: 12px !important;
    grid-template-columns: 1fr !important;
  }

  .h360pixel-patient {
    grid-template-columns: 54px minmax(0,1fr) !important;
  }

  .h360pixel-patient .arrow,
  .h360pixel-patient .sep,
  .h360pixel-patient .info {
    display: none !important;
  }

  .h360pixel-tabs,
  .h360pixel-toolbar .actions {
    overflow-x: auto !important;
  }

  .h360pixel-leftcards {
    grid-template-columns: 1fr !important;
  }

  .h360pixel-tablebox {
    overflow-x: auto !important;
  }

  .h360pixel-tablebox table {
    min-width: 900px !important;
  }
}
/* 0.22A.24.2_HEALTH360_TREATMENT_PLAN_REFERENCE_PIXEL_FINAL_CSS_END */

/* 0.22A.25.0_HEALTH360_GLOBAL_SIDEBAR_REFERENCE_CSS_START */
.h360global-sidebar-reference-022a250 {
  --h360-side-bg-1: #0d778d;
  --h360-side-bg-2: #08697e;
  --h360-side-bg-3: #075a6f;
  --h360-side-panel: rgba(255, 255, 255, .12);
  --h360-side-panel-2: rgba(255, 255, 255, .16);
  --h360-side-text: #ffffff;
  --h360-side-muted: rgba(255, 255, 255, .82);
  --h360-side-accent: #1bd7c2;
  width: 292px !important;
  min-width: 292px !important;
  max-width: 292px !important;
  height: 100vh !important;
  min-height: 100vh !important;
  padding: 18px 10px 8px !important;
  background: linear-gradient(180deg, var(--h360-side-bg-1) 0%, var(--h360-side-bg-2) 38%, var(--h360-side-bg-3) 100%) !important;
  color: var(--h360-side-text) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important;
  grid-template-rows: 92px auto minmax(0, 1fr) auto auto !important;
  gap: 10px !important;
  overflow: hidden !important;
  direction: rtl !important;
  font-family: inherit !important;
}

.h360global-sidebar-reference-022a250 *,
.h360global-sidebar-reference-022a250 *::before,
.h360global-sidebar-reference-022a250 *::after {
  box-sizing: border-box !important;
}

.h360global-sidebar-reference-022a250 .h360global-logo-022a250 {
  height: 76px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 70px !important;
  gap: 10px !important;
  align-items: center !important;
  padding: 0 10px !important;
}

.h360global-logo-text-022a250 {
  display: grid !important;
  gap: 4px !important;
  text-align: right !important;
}

.h360global-logo-text-022a250 strong {
  color: #fff !important;
  font-size: 26px !important;
  line-height: 1.05 !important;
  font-weight: 950 !important;
  letter-spacing: -.7px !important;
}

.h360global-logo-text-022a250 strong b {
  color: #20d9c7 !important;
  font-weight: 950 !important;
}

.h360global-logo-text-022a250 span {
  color: #ffffff !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
  font-weight: 850 !important;
}

.h360global-tooth-022a250 {
  width: 66px !important;
  height: 66px !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.16) !important;
  display: grid !important;
  place-items: center !important;
  font-size: 45px !important;
  line-height: 1 !important;
}

.h360global-nav-022a250 {
  display: grid !important;
  gap: 14px !important;
  padding: 4px 0 0 !important;
  align-content: start !important;
}

.h360global-nav-item-022a250 {
  width: 100% !important;
  height: 54px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: #fff !important;
  padding: 0 16px !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  text-align: right !important;
  font-size: 16px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

.h360global-nav-item-022a250.active,
.h360global-nav-item-022a250:hover {
  background: linear-gradient(90deg, rgba(255,255,255,.20), rgba(255,255,255,.10)) !important;
}

.h360global-nav-icon-022a250 {
  width: 32px !important;
  height: 32px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  font-size: 23px !important;
  line-height: 1 !important;
}

.h360global-nav-label-022a250 {
  color: #fff !important;
  font-size: 16px !important;
  line-height: 1.3 !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
}

.h360global-promo-022a250 {
  align-self: end !important;
  min-height: 212px !important;
  margin: 0 2px 6px !important;
  padding: 24px 18px 18px !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.08)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 18px 46px rgba(0,0,0,.12) !important;
  display: grid !important;
  justify-items: center !important;
  align-content: center !important;
  gap: 8px !important;
  text-align: center !important;
}

.h360global-promo-tooth-022a250 {
  color: #fff !important;
  font-size: 60px !important;
  line-height: 1 !important;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.16)) !important;
}

.h360global-promo-022a250 h3 {
  margin: 6px 0 0 !important;
  color: #fff !important;
  font-size: 17px !important;
  line-height: 1.35 !important;
  font-weight: 950 !important;
}

.h360global-promo-022a250 p {
  margin: 0 !important;
  color: rgba(255,255,255,.86) !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  font-weight: 800 !important;
}

.h360global-promo-022a250 button {
  width: 100% !important;
  height: 40px !important;
  margin-top: 8px !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.07) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
}

.h360global-bottom-actions-022a250 {
  display: grid !important;
  gap: 8px !important;
  padding: 0 2px !important;
}

.h360global-night-022a250,
.h360global-logout-022a250 {
  width: 100% !important;
  height: 48px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  display: grid !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 14px !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

.h360global-night-022a250 {
  grid-template-columns: 54px minmax(0, 1fr) 30px !important;
}

.h360global-logout-022a250 {
  grid-template-columns: minmax(0, 1fr) 30px !important;
}

.h360global-night-022a250 strong,
.h360global-logout-022a250 strong {
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  font-weight: 950 !important;
  text-align: center !important;
}

.h360global-night-022a250 i,
.h360global-logout-022a250 i {
  color: #fff !important;
  font-size: 23px !important;
  font-style: normal !important;
  text-align: center !important;
}

.h360global-switch-dot-022a250 {
  width: 46px !important;
  height: 24px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.22) !important;
  position: relative !important;
}

.h360global-switch-dot-022a250::after {
  content: "" !important;
  position: absolute !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 999px !important;
  background: #dfe8f8 !important;
  top: 4px !important;
  left: 6px !important;
}

.h360global-logout-022a250 i {
  color: #ffb9c1 !important;
}

.h360global-original-hidden-022a250 {
  display: none !important;
}

.h360global-stage-sidebar-022a250 {
  width: 292px !important;
  min-width: 292px !important;
  max-width: 292px !important;
}

@media (max-height: 820px) {
  .h360global-sidebar-reference-022a250 {
    grid-template-rows: 82px auto minmax(0, 1fr) auto auto !important;
    gap: 8px !important;
    padding-top: 12px !important;
  }

  .h360global-nav-022a250 {
    gap: 8px !important;
  }

  .h360global-nav-item-022a250 {
    height: 46px !important;
  }

  .h360global-promo-022a250 {
    min-height: 160px !important;
    padding: 16px 16px 14px !important;
  }

  .h360global-promo-tooth-022a250 {
    font-size: 42px !important;
  }

  .h360global-promo-022a250 h3 {
    font-size: 15px !important;
  }

  .h360global-promo-022a250 p {
    font-size: 11px !important;
  }

  .h360global-promo-022a250 button {
    height: 34px !important;
  }

  .h360global-night-022a250,
  .h360global-logout-022a250 {
    height: 42px !important;
  }
}

@media (max-width: 900px) {
  .h360global-sidebar-reference-022a250 {
    width: 240px !important;
    min-width: 240px !important;
    max-width: 240px !important;
  }

  .h360global-logo-text-022a250 strong {
    font-size: 22px !important;
  }

  .h360global-tooth-022a250 {
    width: 56px !important;
    height: 56px !important;
    font-size: 38px !important;
  }

  .h360global-nav-item-022a250 {
    font-size: 14px !important;
  }

  .h360global-nav-label-022a250 {
    font-size: 14px !important;
  }
}
/* 0.22A.25.0_HEALTH360_GLOBAL_SIDEBAR_REFERENCE_CSS_END */

/* 0.22A.25.1_HEALTH360_GLOBAL_SIDEBAR_STRICT_REBUILD_CSS_START */
.h360strict-sidebar-022a251{--bg1:#11899f;--bg2:#0b7086;--bg3:#075f75;--cyan:#21d8c8;position:relative!important;width:292px!important;min-width:292px!important;max-width:292px!important;height:100vh!important;min-height:100vh!important;max-height:100vh!important;padding:16px 10px 8px!important;margin:0!important;border:0!important;border-radius:0!important;background:linear-gradient(180deg,var(--bg1) 0%,var(--bg2) 42%,var(--bg3) 100%)!important;color:#fff!important;overflow:hidden!important;display:grid!important;grid-template-rows:92px auto minmax(0,1fr) 212px 96px!important;gap:8px!important;direction:rtl!important;box-shadow:none!important;font-family:inherit!important}.h360strict-sidebar-022a251 *,.h360strict-sidebar-022a251 *:before,.h360strict-sidebar-022a251 *:after{box-sizing:border-box!important}.h360strict-sidebar-022a251::-webkit-scrollbar,.h360strict-sidebar-022a251 *::-webkit-scrollbar{width:0!important;height:0!important}.h360strict-logo-022a251{width:100%!important;height:92px!important;display:grid!important;grid-template-columns:86px minmax(0,1fr)!important;gap:10px!important;align-items:center!important;padding:0 16px 0 8px!important;overflow:hidden!important}.h360strict-logo-mark-022a251{width:70px!important;height:70px!important;border-radius:22px!important;background:rgba(255,255,255,.18)!important;display:grid!important;place-items:center!important;font-size:49px!important;line-height:1!important;overflow:hidden!important}.h360strict-logo-text-022a251{min-width:0!important;display:grid!important;gap:4px!important;align-content:center!important;text-align:right!important;overflow:hidden!important}.h360strict-logo-text-022a251 strong{color:#fff!important;font-size:25px!important;line-height:1!important;font-weight:950!important;letter-spacing:-.8px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important}.h360strict-logo-text-022a251 strong b{color:var(--cyan)!important;font-weight:950!important}.h360strict-logo-text-022a251 span{color:#fff!important;font-size:12.5px!important;line-height:1.2!important;font-weight:850!important;white-space:nowrap!important;overflow:hidden!important}.h360strict-nav-022a251{display:grid!important;gap:12px!important;align-content:start!important;padding:0!important;margin:0!important;overflow:hidden!important}.h360strict-nav-022a251 button{width:100%!important;height:54px!important;border:0!important;border-radius:12px!important;background:transparent!important;color:#fff!important;box-shadow:none!important;padding:0 18px!important;display:grid!important;grid-template-columns:34px minmax(0,1fr)!important;gap:10px!important;align-items:center!important;text-align:right!important;cursor:pointer!important;text-decoration:none!important}.h360strict-nav-022a251 button.active,.h360strict-nav-022a251 button:hover{background:linear-gradient(90deg,rgba(255,255,255,.22),rgba(255,255,255,.11))!important}.h360strict-nav-022a251 button span{width:32px!important;height:32px!important;display:grid!important;place-items:center!important;color:#fff!important;font-size:23px!important;line-height:1!important}.h360strict-nav-022a251 button b{color:#fff!important;font-size:16px!important;line-height:1.2!important;font-weight:950!important;white-space:nowrap!important;overflow:hidden!important}.h360strict-spacer-022a251{min-height:0!important}.h360strict-promo-022a251{width:100%!important;min-height:212px!important;max-height:212px!important;padding:22px 18px 18px!important;margin:0!important;border-radius:18px!important;border:1px solid rgba(255,255,255,.14)!important;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,.08))!important;box-shadow:0 18px 46px rgba(0,0,0,.13)!important;display:grid!important;justify-items:center!important;align-content:center!important;gap:8px!important;text-align:center!important;overflow:hidden!important}.h360strict-promo-tooth-022a251{height:64px!important;display:grid!important;place-items:center!important;color:#fff!important;font-size:58px!important;line-height:1!important;filter:drop-shadow(0 10px 18px rgba(0,0,0,.16))!important}.h360strict-promo-022a251 h3{margin:0!important;color:#fff!important;font-size:17px!important;line-height:1.35!important;font-weight:950!important;white-space:nowrap!important}.h360strict-promo-022a251 p{margin:0!important;color:rgba(255,255,255,.88)!important;font-size:12px!important;line-height:1.45!important;font-weight:800!important}.h360strict-promo-022a251 button{width:100%!important;height:40px!important;border:1px solid rgba(255,255,255,.30)!important;border-radius:10px!important;background:rgba(255,255,255,.07)!important;color:#fff!important;font-size:13px!important;font-weight:950!important;cursor:pointer!important;margin:2px 0 0!important;padding:0!important;box-shadow:none!important}.h360strict-actions-022a251{width:100%!important;height:96px!important;display:grid!important;gap:8px!important;padding:0!important;margin:0!important}.h360strict-night-022a251,.h360strict-logout-022a251{width:100%!important;height:44px!important;border:0!important;border-radius:10px!important;background:rgba(255,255,255,.12)!important;color:#fff!important;box-shadow:none!important;padding:0 14px!important;cursor:pointer!important;display:grid!important;align-items:center!important;gap:8px!important;text-decoration:none!important}.h360strict-night-022a251{grid-template-columns:54px minmax(0,1fr) 30px!important}.h360strict-logout-022a251{grid-template-columns:minmax(0,1fr) 30px!important}.h360strict-night-022a251 b,.h360strict-logout-022a251 b{color:#fff!important;font-size:15px!important;line-height:1.2!important;font-weight:950!important;text-align:center!important;white-space:nowrap!important}.h360strict-night-022a251 em,.h360strict-logout-022a251 em{color:#fff!important;font-size:23px!important;font-style:normal!important;text-align:center!important}.h360strict-logout-022a251 em{color:#ffbbc4!important}.h360strict-night-022a251 .switch{width:46px!important;height:24px!important;border-radius:999px!important;background:rgba(255,255,255,.25)!important;position:relative!important;display:block!important}.h360strict-night-022a251 .switch i{position:absolute!important;width:16px!important;height:16px!important;border-radius:999px!important;background:#dfe8f8!important;top:4px!important;left:6px!important}.h360strict-sidebar-022a251 .h360global-logo-022a250,.h360strict-sidebar-022a251 .h360global-promo-022a250,.h360strict-sidebar-022a251 .h360global-nav-022a250,.h360strict-sidebar-022a251 .h360global-bottom-actions-022a250,.h360strict-sidebar-022a251 .h360global-original-hidden-022a250{display:none!important}@media(max-height:820px){.h360strict-sidebar-022a251{grid-template-rows:78px auto minmax(0,1fr) 158px 86px!important;padding-top:10px!important;gap:7px!important}.h360strict-logo-022a251{height:78px!important}.h360strict-logo-mark-022a251{width:58px!important;height:58px!important;border-radius:18px!important;font-size:40px!important}.h360strict-logo-text-022a251 strong{font-size:22px!important}.h360strict-logo-text-022a251 span{font-size:11.5px!important}.h360strict-nav-022a251{gap:7px!important}.h360strict-nav-022a251 button{height:43px!important}.h360strict-promo-022a251{min-height:158px!important;max-height:158px!important;padding:12px 16px!important;gap:4px!important}.h360strict-promo-tooth-022a251{height:42px!important;font-size:40px!important}.h360strict-promo-022a251 h3{font-size:15px!important}.h360strict-promo-022a251 p{font-size:11px!important}.h360strict-promo-022a251 button{height:32px!important}.h360strict-actions-022a251{height:86px!important}.h360strict-night-022a251,.h360strict-logout-022a251{height:39px!important}}@media(max-width:900px){.h360strict-sidebar-022a251{width:250px!important;min-width:250px!important;max-width:250px!important}.h360strict-logo-022a251{grid-template-columns:64px minmax(0,1fr)!important;padding-inline:10px!important}.h360strict-logo-mark-022a251{width:58px!important;height:58px!important;font-size:40px!important}.h360strict-logo-text-022a251 strong{font-size:22px!important}.h360strict-nav-022a251 button b{font-size:14px!important}}
/* 0.22A.25.1_HEALTH360_GLOBAL_SIDEBAR_STRICT_REBUILD_CSS_END */

/* 0.22A.25.2_HEALTH360_GLOBAL_SIDEBAR_HARD_FINAL_CSS_START */
.h360hard-sidebar-022a252 {
  --h360hard-bg1: #0f879b;
  --h360hard-bg2: #0b7488;
  --h360hard-bg3: #075f74;
  --h360hard-text: #ffffff;
  --h360hard-cyan: #26dcca;
  --h360hard-panel: rgba(255,255,255,.14);
  width: 292px !important;
  min-width: 292px !important;
  max-width: 292px !important;
  height: 100vh !important;
  min-height: 100vh !important;
  max-height: 100vh !important;
  padding: 18px 10px 8px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, var(--h360hard-bg1) 0%, var(--h360hard-bg2) 40%, var(--h360hard-bg3) 100%) !important;
  color: var(--h360hard-text) !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-rows: 92px 248px minmax(0, 1fr) 212px 96px !important;
  gap: 8px !important;
  direction: rtl !important;
  box-shadow: none !important;
  font-family: inherit !important;
  isolation: isolate !important;
}

.h360hard-sidebar-022a252 *,
.h360hard-sidebar-022a252 *::before,
.h360hard-sidebar-022a252 *::after {
  box-sizing: border-box !important;
}

.h360hard-sidebar-022a252::-webkit-scrollbar,
.h360hard-sidebar-022a252 *::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
}

.h360hard-logo-022a252 {
  height: 92px !important;
  width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 70px !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 0 12px !important;
  overflow: hidden !important;
  direction: ltr !important;
}

.h360hard-logo-text-022a252 {
  min-width: 0 !important;
  display: grid !important;
  align-content: center !important;
  gap: 4px !important;
  text-align: right !important;
  direction: rtl !important;
  overflow: hidden !important;
}

.h360hard-logo-text-022a252 strong {
  display: block !important;
  color: #fff !important;
  font-size: 26px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: -.9px !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

.h360hard-logo-text-022a252 strong b {
  color: var(--h360hard-cyan) !important;
  font-weight: 950 !important;
}

.h360hard-logo-text-022a252 span {
  display: block !important;
  color: #fff !important;
  font-size: 12.5px !important;
  line-height: 1.2 !important;
  font-weight: 850 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}

.h360hard-tooth-022a252 {
  width: 66px !important;
  height: 66px !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.18) !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  font-size: 45px !important;
  line-height: 1 !important;
  overflow: hidden !important;
  flex: none !important;
}

.h360hard-nav-022a252 {
  width: 100% !important;
  height: 248px !important;
  display: grid !important;
  grid-template-rows: repeat(4, 54px) !important;
  gap: 10px !important;
  align-content: start !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

.h360hard-nav-022a252 button {
  width: 100% !important;
  height: 54px !important;
  min-height: 54px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: #fff !important;
  padding: 0 16px !important;
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  text-align: right !important;
  cursor: pointer !important;
  box-shadow: none !important;
  text-decoration: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.h360hard-nav-022a252 button.active,
.h360hard-nav-022a252 button:hover {
  background: linear-gradient(90deg, rgba(255,255,255,.22), rgba(255,255,255,.11)) !important;
}

.h360hard-nav-022a252 button span {
  width: 32px !important;
  height: 32px !important;
  color: #fff !important;
  display: grid !important;
  place-items: center !important;
  font-size: 23px !important;
  line-height: 1 !important;
  opacity: 1 !important;
}

.h360hard-nav-022a252 button b {
  color: #fff !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.h360hard-fill-022a252 {
  min-height: 0 !important;
}

.h360hard-promo-022a252 {
  width: 100% !important;
  height: 212px !important;
  min-height: 212px !important;
  max-height: 212px !important;
  padding: 22px 18px 18px !important;
  margin: 0 !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.15), rgba(255,255,255,.08)) !important;
  box-shadow: 0 18px 46px rgba(0,0,0,.13) !important;
  display: grid !important;
  justify-items: center !important;
  align-content: center !important;
  gap: 8px !important;
  text-align: center !important;
  overflow: hidden !important;
}

.h360hard-promo-tooth-022a252 {
  width: 72px !important;
  height: 66px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  font-size: 58px !important;
  line-height: 1 !important;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.16)) !important;
}

.h360hard-promo-022a252 h3 {
  margin: 0 !important;
  color: #fff !important;
  font-size: 17px !important;
  line-height: 1.35 !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
}

.h360hard-promo-022a252 p {
  margin: 0 !important;
  color: rgba(255,255,255,.88) !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  font-weight: 800 !important;
}

.h360hard-promo-022a252 button {
  width: 100% !important;
  height: 40px !important;
  border: 1px solid rgba(255,255,255,.30) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.07) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.h360hard-actions-022a252 {
  width: 100% !important;
  height: 96px !important;
  display: grid !important;
  grid-template-rows: 44px 44px !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
}

.h360hard-night-022a252,
.h360hard-logout-022a252 {
  width: 100% !important;
  height: 44px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  box-shadow: none !important;
  padding: 0 14px !important;
  margin: 0 !important;
  cursor: pointer !important;
  display: grid !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important;
}

.h360hard-night-022a252 {
  grid-template-columns: 54px minmax(0, 1fr) 30px !important;
}

.h360hard-logout-022a252 {
  grid-template-columns: minmax(0, 1fr) 30px !important;
}

.h360hard-night-022a252 b,
.h360hard-logout-022a252 b {
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  font-weight: 950 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.h360hard-night-022a252 em,
.h360hard-logout-022a252 em {
  color: #fff !important;
  font-size: 23px !important;
  font-style: normal !important;
  text-align: center !important;
}

.h360hard-logout-022a252 em {
  color: #ffbbc4 !important;
}

.h360hard-night-022a252 .toggle {
  width: 46px !important;
  height: 24px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.25) !important;
  position: relative !important;
  display: block !important;
}

.h360hard-night-022a252 .toggle i {
  position: absolute !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 999px !important;
  background: #dfe8f8 !important;
  top: 4px !important;
  left: 6px !important;
}

.h360hard-sidebar-022a252 .h360global-logo-022a250,
.h360hard-sidebar-022a252 .h360global-promo-022a250,
.h360hard-sidebar-022a252 .h360global-nav-022a250,
.h360hard-sidebar-022a252 .h360global-bottom-actions-022a250,
.h360hard-sidebar-022a252 .h360strict-logo-022a251,
.h360hard-sidebar-022a252 .h360strict-nav-022a251,
.h360hard-sidebar-022a252 .h360strict-promo-022a251,
.h360hard-sidebar-022a252 .h360strict-actions-022a251 {
  display: none !important;
}

@media (max-height: 820px) {
  .h360hard-sidebar-022a252 {
    grid-template-rows: 78px 200px minmax(0, 1fr) 158px 86px !important;
    gap: 7px !important;
    padding-top: 10px !important;
  }

  .h360hard-logo-022a252 {
    height: 78px !important;
    grid-template-columns: minmax(0,1fr) 58px !important;
  }

  .h360hard-tooth-022a252 {
    width: 58px !important;
    height: 58px !important;
    border-radius: 18px !important;
    font-size: 40px !important;
  }

  .h360hard-logo-text-022a252 strong {
    font-size: 22px !important;
  }

  .h360hard-logo-text-022a252 span {
    font-size: 11.5px !important;
  }

  .h360hard-nav-022a252 {
    height: 200px !important;
    grid-template-rows: repeat(4, 43px) !important;
    gap: 7px !important;
  }

  .h360hard-nav-022a252 button {
    height: 43px !important;
    min-height: 43px !important;
  }

  .h360hard-promo-022a252 {
    height: 158px !important;
    min-height: 158px !important;
    max-height: 158px !important;
    padding: 12px 16px !important;
    gap: 4px !important;
  }

  .h360hard-promo-tooth-022a252 {
    height: 42px !important;
    font-size: 40px !important;
  }

  .h360hard-promo-022a252 h3 {
    font-size: 15px !important;
  }

  .h360hard-promo-022a252 p {
    font-size: 11px !important;
  }

  .h360hard-promo-022a252 button {
    height: 32px !important;
  }

  .h360hard-actions-022a252 {
    height: 86px !important;
    grid-template-rows: 39px 39px !important;
  }

  .h360hard-night-022a252,
  .h360hard-logout-022a252 {
    height: 39px !important;
  }
}

@media (max-width: 900px) {
  .h360hard-sidebar-022a252 {
    width: 250px !important;
    min-width: 250px !important;
    max-width: 250px !important;
  }

  .h360hard-logo-022a252 {
    grid-template-columns: minmax(0,1fr) 58px !important;
    padding-inline: 10px !important;
  }

  .h360hard-tooth-022a252 {
    width: 58px !important;
    height: 58px !important;
    font-size: 40px !important;
  }

  .h360hard-logo-text-022a252 strong {
    font-size: 22px !important;
  }

  .h360hard-nav-022a252 button b {
    font-size: 14px !important;
  }
}
/* 0.22A.25.2_HEALTH360_GLOBAL_SIDEBAR_HARD_FINAL_CSS_END */

/* 0.22A.25.3_HEALTH360_SIDEBAR_FIXED_OVERLAY_ALL_PAGES_CSS_START */
body.h360fixed-sidebar-mounted-022a253{--h360fixed-sidebar-width:292px}
#h360fixed-sidebar-022a253{position:fixed!important;top:0!important;right:0!important;bottom:0!important;z-index:2147483000!important;width:292px!important;min-width:292px!important;max-width:292px!important;height:100vh!important;padding:18px 10px 8px!important;margin:0!important;border:0!important;border-radius:0!important;background:linear-gradient(180deg,#0f879b 0%,#0b7488 40%,#075f74 100%)!important;color:#fff!important;overflow:hidden!important;display:grid!important;grid-template-rows:92px 248px minmax(0,1fr) 212px 96px!important;gap:8px!important;direction:rtl!important;box-shadow:none!important;font-family:inherit!important}
#h360fixed-sidebar-022a253 *,#h360fixed-sidebar-022a253 *:before,#h360fixed-sidebar-022a253 *:after{box-sizing:border-box!important}
#h360fixed-sidebar-022a253::-webkit-scrollbar,#h360fixed-sidebar-022a253 *::-webkit-scrollbar{width:0!important;height:0!important}
.h360fixed-logo-022a253{height:92px!important;display:grid!important;grid-template-columns:minmax(0,1fr) 70px!important;gap:12px!important;align-items:center!important;padding:0 12px!important;direction:ltr!important;overflow:hidden!important}
.h360fixed-logo-text-022a253{min-width:0!important;display:grid!important;gap:4px!important;align-content:center!important;text-align:right!important;direction:rtl!important}
.h360fixed-logo-text-022a253 strong{display:block!important;color:#fff!important;font-size:26px!important;line-height:1!important;font-weight:950!important;letter-spacing:-.9px!important;white-space:nowrap!important}
.h360fixed-logo-text-022a253 strong b{color:#26dcca!important}
.h360fixed-logo-text-022a253 span{display:block!important;color:#fff!important;font-size:12.5px!important;line-height:1.2!important;font-weight:850!important;white-space:nowrap!important;overflow:hidden!important}
.h360fixed-tooth-022a253{width:66px!important;height:66px!important;border-radius:22px!important;background:rgba(255,255,255,.18)!important;display:grid!important;place-items:center!important;font-size:45px!important;line-height:1!important;overflow:hidden!important}
.h360fixed-nav-022a253{height:248px!important;display:grid!important;grid-template-rows:repeat(4,54px)!important;gap:10px!important;padding:0!important;margin:0!important;overflow:hidden!important}
.h360fixed-nav-022a253 button{height:54px!important;min-height:54px!important;width:100%!important;border:0!important;border-radius:12px!important;background:transparent!important;color:#fff!important;padding:0 16px!important;margin:0!important;display:grid!important;grid-template-columns:34px minmax(0,1fr)!important;gap:10px!important;align-items:center!important;text-align:right!important;cursor:pointer!important;box-shadow:none!important}
.h360fixed-nav-022a253 button.active,.h360fixed-nav-022a253 button:hover{background:linear-gradient(90deg,rgba(255,255,255,.22),rgba(255,255,255,.11))!important;box-shadow:inset 4px 0 0 #26dcca!important}
.h360fixed-nav-022a253 button span{width:32px!important;height:32px!important;display:grid!important;place-items:center!important;color:#fff!important;font-size:23px!important;line-height:1!important}
.h360fixed-nav-022a253 button b{color:#fff!important;font-size:16px!important;line-height:1.2!important;font-weight:950!important;white-space:nowrap!important;overflow:hidden!important}
.h360fixed-fill-022a253{min-height:0!important}
.h360fixed-promo-022a253{height:212px!important;min-height:212px!important;max-height:212px!important;padding:22px 18px 18px!important;margin:0!important;border-radius:18px!important;border:1px solid rgba(255,255,255,.14)!important;background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,.08))!important;box-shadow:0 18px 46px rgba(0,0,0,.13)!important;display:grid!important;justify-items:center!important;align-content:center!important;gap:8px!important;text-align:center!important;overflow:hidden!important}
.h360fixed-promo-022a253 div{width:72px!important;height:66px!important;display:grid!important;place-items:center!important;font-size:58px!important;line-height:1!important;filter:drop-shadow(0 10px 18px rgba(0,0,0,.16))!important}
.h360fixed-promo-022a253 h3{margin:0!important;color:#fff!important;font-size:17px!important;line-height:1.35!important;font-weight:950!important;white-space:nowrap!important}
.h360fixed-promo-022a253 p{margin:0!important;color:rgba(255,255,255,.88)!important;font-size:12px!important;line-height:1.45!important;font-weight:800!important}
.h360fixed-promo-022a253 button{width:100%!important;height:40px!important;border:1px solid rgba(255,255,255,.30)!important;border-radius:10px!important;background:rgba(255,255,255,.07)!important;color:#fff!important;font-size:13px!important;font-weight:950!important;cursor:pointer!important;margin:2px 0 0!important;padding:0!important}
.h360fixed-actions-022a253{height:96px!important;display:grid!important;grid-template-rows:44px 44px!important;gap:8px!important}
.h360fixed-night-022a253,.h360fixed-logout-022a253{height:44px!important;width:100%!important;border:0!important;border-radius:10px!important;background:rgba(255,255,255,.12)!important;color:#fff!important;padding:0 14px!important;margin:0!important;display:grid!important;align-items:center!important;gap:8px!important;cursor:pointer!important}
.h360fixed-night-022a253{grid-template-columns:54px minmax(0,1fr) 30px!important}.h360fixed-logout-022a253{grid-template-columns:minmax(0,1fr) 30px!important}
.h360fixed-night-022a253 b,.h360fixed-logout-022a253 b{color:#fff!important;font-size:15px!important;line-height:1.2!important;font-weight:950!important;text-align:center!important;white-space:nowrap!important}
.h360fixed-night-022a253 em,.h360fixed-logout-022a253 em{color:#fff!important;font-size:23px!important;font-style:normal!important;text-align:center!important}.h360fixed-logout-022a253 em{color:#ffbbc4!important}
.h360fixed-night-022a253 span{width:46px!important;height:24px!important;border-radius:999px!important;background:rgba(255,255,255,.25)!important;position:relative!important;display:block!important}.h360fixed-night-022a253 span i{position:absolute!important;width:16px!important;height:16px!important;border-radius:999px!important;background:#dfe8f8!important;top:4px!important;left:6px!important}
body.h360fixed-sidebar-mounted-022a253 #h360pixel-stage-022a242,body.h360fixed-sidebar-mounted-022a253 #h360rfinal-stage-022a241{grid-template-columns:minmax(0,1fr) 292px!important}
body.h360fixed-sidebar-mounted-022a253 #h360pixel-stage-022a242 .h360pixel-sidebar,body.h360fixed-sidebar-mounted-022a253 #h360rfinal-stage-022a241 .h360rfinal-sidebar{opacity:0!important;pointer-events:none!important}
@media(max-height:820px){#h360fixed-sidebar-022a253{grid-template-rows:78px 200px minmax(0,1fr) 158px 86px!important;gap:7px!important;padding-top:10px!important}.h360fixed-logo-022a253{height:78px!important;grid-template-columns:minmax(0,1fr) 58px!important}.h360fixed-tooth-022a253{width:58px!important;height:58px!important;border-radius:18px!important;font-size:40px!important}.h360fixed-logo-text-022a253 strong{font-size:22px!important}.h360fixed-logo-text-022a253 span{font-size:11.5px!important}.h360fixed-nav-022a253{height:200px!important;grid-template-rows:repeat(4,43px)!important;gap:7px!important}.h360fixed-nav-022a253 button{height:43px!important;min-height:43px!important}.h360fixed-promo-022a253{height:158px!important;min-height:158px!important;max-height:158px!important;padding:12px 16px!important;gap:4px!important}.h360fixed-promo-022a253 div{height:42px!important;font-size:40px!important}.h360fixed-promo-022a253 h3{font-size:15px!important}.h360fixed-promo-022a253 p{font-size:11px!important}.h360fixed-promo-022a253 button{height:32px!important}.h360fixed-actions-022a253{height:86px!important;grid-template-rows:39px 39px!important}.h360fixed-night-022a253,.h360fixed-logout-022a253{height:39px!important}}
/* 0.22A.25.3_HEALTH360_SIDEBAR_FIXED_OVERLAY_ALL_PAGES_CSS_END */

/* 0.22A.25.4_HEALTH360_SIDEBAR_PROPORTIONAL_LAYOUT_FINAL_CSS_START */
body.h360fit-sidebar-mounted-022a254 {
  --h360fit-sidebar-width: 272px;
}

#h360fixed-sidebar-022a253 {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

#h360fit-sidebar-022a254.h360fit-sidebar-022a254 {
  --h360fit-bg1: #0f879b;
  --h360fit-bg2: #0b7488;
  --h360fit-bg3: #075f74;
  --h360fit-cyan: #26dcca;
  position: fixed !important;
  inset-block: 0 !important;
  inset-inline-end: 0 !important;
  z-index: 2147483000 !important;
  width: var(--h360fit-sidebar-width) !important;
  min-width: var(--h360fit-sidebar-width) !important;
  max-width: var(--h360fit-sidebar-width) !important;
  height: 100vh !important;
  min-height: 100vh !important;
  max-height: 100vh !important;
  padding: 15px 10px 8px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, var(--h360fit-bg1) 0%, var(--h360fit-bg2) 42%, var(--h360fit-bg3) 100%) !important;
  color: #fff !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-rows: 82px 220px minmax(0, 1fr) 178px 88px !important;
  gap: 8px !important;
  direction: rtl !important;
  box-shadow: none !important;
  font-family: inherit !important;
  isolation: isolate !important;
}

#h360fit-sidebar-022a254 *,
#h360fit-sidebar-022a254 *::before,
#h360fit-sidebar-022a254 *::after {
  box-sizing: border-box !important;
}

#h360fit-sidebar-022a254::-webkit-scrollbar,
#h360fit-sidebar-022a254 *::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
}

.h360fit-logo-022a254 {
  width: 100% !important;
  height: 82px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 58px !important;
  gap: 10px !important;
  align-items: center !important;
  padding: 0 10px !important;
  overflow: hidden !important;
  direction: ltr !important;
}

.h360fit-logo-text-022a254 {
  min-width: 0 !important;
  display: grid !important;
  align-content: center !important;
  gap: 4px !important;
  text-align: right !important;
  direction: rtl !important;
  overflow: hidden !important;
}

.h360fit-logo-text-022a254 strong {
  display: block !important;
  color: #fff !important;
  font-size: 24px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: -.7px !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

.h360fit-logo-text-022a254 strong b {
  color: var(--h360fit-cyan) !important;
  font-weight: 950 !important;
}

.h360fit-logo-text-022a254 span {
  display: block !important;
  color: #fff !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 850 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}

.h360fit-tooth-022a254 {
  width: 56px !important;
  height: 56px !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.18) !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  font-size: 38px !important;
  line-height: 1 !important;
  overflow: hidden !important;
  flex: none !important;
}

.h360fit-nav-022a254 {
  width: 100% !important;
  height: 220px !important;
  display: grid !important;
  grid-template-rows: repeat(4, 47px) !important;
  gap: 8px !important;
  align-content: start !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

.h360fit-nav-022a254 button {
  width: 100% !important;
  height: 47px !important;
  min-height: 47px !important;
  border: 0 !important;
  border-radius: 11px !important;
  background: transparent !important;
  color: #fff !important;
  padding: 0 14px !important;
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: 30px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  text-align: right !important;
  cursor: pointer !important;
  box-shadow: none !important;
  text-decoration: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.h360fit-nav-022a254 button.active,
.h360fit-nav-022a254 button:hover {
  background: linear-gradient(90deg, rgba(255,255,255,.22), rgba(255,255,255,.11)) !important;
  box-shadow: inset 4px 0 0 var(--h360fit-cyan) !important;
}

.h360fit-nav-022a254 button span {
  width: 28px !important;
  height: 28px !important;
  color: #fff !important;
  display: grid !important;
  place-items: center !important;
  font-size: 20px !important;
  line-height: 1 !important;
  opacity: 1 !important;
}

.h360fit-nav-022a254 button b {
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.h360fit-fill-022a254 {
  min-height: 0 !important;
}

.h360fit-promo-022a254 {
  width: 100% !important;
  height: 178px !important;
  min-height: 178px !important;
  max-height: 178px !important;
  padding: 14px 16px 14px !important;
  margin: 0 !important;
  border-radius: 16px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.15), rgba(255,255,255,.08)) !important;
  box-shadow: 0 16px 36px rgba(0,0,0,.12) !important;
  display: grid !important;
  justify-items: center !important;
  align-content: center !important;
  gap: 6px !important;
  text-align: center !important;
  overflow: hidden !important;
}

.h360fit-promo-tooth-022a254 {
  width: 58px !important;
  height: 52px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  font-size: 42px !important;
  line-height: 1 !important;
  filter: drop-shadow(0 8px 14px rgba(0,0,0,.15)) !important;
}

.h360fit-promo-022a254 h3 {
  margin: 0 !important;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1.3 !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
}

.h360fit-promo-022a254 p {
  margin: 0 !important;
  color: rgba(255,255,255,.88) !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
  font-weight: 800 !important;
}

.h360fit-promo-022a254 button {
  width: 100% !important;
  height: 34px !important;
  border: 1px solid rgba(255,255,255,.30) !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.07) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.h360fit-actions-022a254 {
  width: 100% !important;
  height: 88px !important;
  display: grid !important;
  grid-template-rows: 40px 40px !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
}

.h360fit-night-022a254,
.h360fit-logout-022a254 {
  width: 100% !important;
  height: 40px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  box-shadow: none !important;
  padding: 0 12px !important;
  margin: 0 !important;
  cursor: pointer !important;
  display: grid !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important;
}

.h360fit-night-022a254 {
  grid-template-columns: 46px minmax(0, 1fr) 26px !important;
}

.h360fit-logout-022a254 {
  grid-template-columns: minmax(0, 1fr) 26px !important;
}

.h360fit-night-022a254 b,
.h360fit-logout-022a254 b {
  color: #fff !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 950 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.h360fit-night-022a254 em,
.h360fit-logout-022a254 em {
  color: #fff !important;
  font-size: 20px !important;
  font-style: normal !important;
  text-align: center !important;
}

.h360fit-logout-022a254 em {
  color: #ffbbc4 !important;
}

.h360fit-night-022a254 .toggle {
  width: 40px !important;
  height: 22px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.25) !important;
  position: relative !important;
  display: block !important;
}

.h360fit-night-022a254 .toggle i {
  position: absolute !important;
  width: 15px !important;
  height: 15px !important;
  border-radius: 999px !important;
  background: #dfe8f8 !important;
  top: 3.5px !important;
  left: 5px !important;
}

/* Prevent the fixed sidebar from covering normal app content. */
body.h360fit-sidebar-mounted-022a254 > .h360fit-root-offset-022a254:not(#h360fit-sidebar-022a254) {
  max-width: calc(100vw - var(--h360fit-sidebar-width)) !important;
}

/* Reserve right-side visual width for fullscreen treatment plan pages. */
body.h360fit-sidebar-mounted-022a254 #h360pixel-stage-022a242,
body.h360fit-sidebar-mounted-022a254 #h360rfinal-stage-022a241 {
  grid-template-columns: minmax(0, 1fr) var(--h360fit-sidebar-width) !important;
}

body.h360fit-sidebar-mounted-022a254 #h360pixel-stage-022a242 .h360pixel-sidebar,
body.h360fit-sidebar-mounted-022a254 #h360rfinal-stage-022a241 .h360rfinal-sidebar {
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-height: 820px) {
  body.h360fit-sidebar-mounted-022a254 {
    --h360fit-sidebar-width: 264px;
  }

  #h360fit-sidebar-022a254.h360fit-sidebar-022a254 {
    width: var(--h360fit-sidebar-width) !important;
    min-width: var(--h360fit-sidebar-width) !important;
    max-width: var(--h360fit-sidebar-width) !important;
    grid-template-rows: 72px 192px minmax(0, 1fr) 150px 84px !important;
    gap: 7px !important;
    padding-top: 10px !important;
  }

  .h360fit-logo-022a254 {
    height: 72px !important;
    grid-template-columns: minmax(0,1fr) 52px !important;
  }

  .h360fit-tooth-022a254 {
    width: 52px !important;
    height: 52px !important;
    border-radius: 16px !important;
    font-size: 35px !important;
  }

  .h360fit-logo-text-022a254 strong {
    font-size: 22px !important;
  }

  .h360fit-logo-text-022a254 span {
    font-size: 11.5px !important;
  }

  .h360fit-nav-022a254 {
    height: 192px !important;
    grid-template-rows: repeat(4, 42px) !important;
    gap: 7px !important;
  }

  .h360fit-nav-022a254 button {
    height: 42px !important;
    min-height: 42px !important;
  }

  .h360fit-promo-022a254 {
    height: 150px !important;
    min-height: 150px !important;
    max-height: 150px !important;
    padding: 10px 14px !important;
    gap: 4px !important;
  }

  .h360fit-promo-tooth-022a254 {
    height: 38px !important;
    font-size: 36px !important;
  }

  .h360fit-promo-022a254 h3 {
    font-size: 14px !important;
  }

  .h360fit-promo-022a254 p {
    font-size: 10.5px !important;
  }

  .h360fit-promo-022a254 button {
    height: 30px !important;
  }

  .h360fit-actions-022a254 {
    height: 84px !important;
    grid-template-rows: 38px 38px !important;
  }

  .h360fit-night-022a254,
  .h360fit-logout-022a254 {
    height: 38px !important;
  }
}

@media (max-width: 900px) {
  body.h360fit-sidebar-mounted-022a254 {
    --h360fit-sidebar-width: 248px;
  }

  #h360fit-sidebar-022a254.h360fit-sidebar-022a254 {
    width: var(--h360fit-sidebar-width) !important;
    min-width: var(--h360fit-sidebar-width) !important;
    max-width: var(--h360fit-sidebar-width) !important;
  }

  .h360fit-logo-text-022a254 strong {
    font-size: 21px !important;
  }

  .h360fit-nav-022a254 button b {
    font-size: 14px !important;
  }
}
/* 0.22A.25.4_HEALTH360_SIDEBAR_PROPORTIONAL_LAYOUT_FINAL_CSS_END */

/* 0.22A.25.5_HEALTH360_SIDEBAR_SINGLE_RIGHT_FINAL_CSS_START */
body.h360one-sidebar-mounted-022a255 {
  --h360one-sidebar-width: 286px;
}

#h360fixed-sidebar-022a253,
#h360fit-sidebar-022a254,
.h360one-hidden-sidebar-022a255 {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  flex: 0 0 0 !important;
  grid-column: auto !important;
}

.h360one-collapsed-layout-022a255 {
  grid-template-columns: minmax(0, 1fr) !important;
  padding-inline-start: 0 !important;
  padding-inline-end: 0 !important;
  margin-inline-start: 0 !important;
}

.h360one-collapsed-layout-022a255 > :not(.h360one-hidden-sidebar-022a255):not(#h360one-sidebar-022a255) {
  max-width: 100% !important;
  width: 100% !important;
  min-width: 0 !important;
  margin-inline-start: 0 !important;
}

#h360one-sidebar-022a255.h360one-sidebar-022a255 {
  --h360one-bg1: #0f879b;
  --h360one-bg2: #0b7488;
  --h360one-bg3: #075f74;
  --h360one-cyan: #26dcca;
  position: fixed !important;
  inset-block: 0 !important;
  inset-inline-end: 0 !important;
  z-index: 2147483000 !important;
  width: var(--h360one-sidebar-width) !important;
  min-width: var(--h360one-sidebar-width) !important;
  max-width: var(--h360one-sidebar-width) !important;
  height: 100vh !important;
  min-height: 100vh !important;
  max-height: 100vh !important;
  padding: 18px 10px 8px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, var(--h360one-bg1) 0%, var(--h360one-bg2) 42%, var(--h360one-bg3) 100%) !important;
  color: #fff !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-rows: 90px 240px minmax(0, 1fr) 204px 92px !important;
  gap: 8px !important;
  direction: rtl !important;
  box-shadow: none !important;
  font-family: inherit !important;
  isolation: isolate !important;
}

#h360one-sidebar-022a255 *,
#h360one-sidebar-022a255 *::before,
#h360one-sidebar-022a255 *::after {
  box-sizing: border-box !important;
}

#h360one-sidebar-022a255::-webkit-scrollbar,
#h360one-sidebar-022a255 *::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
}

.h360one-logo-022a255 {
  width: 100% !important;
  height: 90px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 66px !important;
  gap: 11px !important;
  align-items: center !important;
  padding: 0 10px !important;
  overflow: hidden !important;
  direction: ltr !important;
}

.h360one-logo-text-022a255 {
  min-width: 0 !important;
  display: grid !important;
  align-content: center !important;
  gap: 4px !important;
  text-align: right !important;
  direction: rtl !important;
  overflow: hidden !important;
}

.h360one-logo-text-022a255 strong {
  display: block !important;
  color: #fff !important;
  font-size: 25px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: -.8px !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

.h360one-logo-text-022a255 strong b {
  color: var(--h360one-cyan) !important;
  font-weight: 950 !important;
}

.h360one-logo-text-022a255 span {
  display: block !important;
  color: #fff !important;
  font-size: 12.5px !important;
  line-height: 1.2 !important;
  font-weight: 850 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}

.h360one-tooth-022a255 {
  width: 64px !important;
  height: 64px !important;
  border-radius: 21px !important;
  background: rgba(255,255,255,.18) !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  font-size: 43px !important;
  line-height: 1 !important;
  overflow: hidden !important;
  flex: none !important;
}

.h360one-nav-022a255 {
  width: 100% !important;
  height: 240px !important;
  display: grid !important;
  grid-template-rows: repeat(4, 52px) !important;
  gap: 10px !important;
  align-content: start !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

.h360one-nav-022a255 button {
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: #fff !important;
  padding: 0 16px !important;
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: center !important;
  text-align: right !important;
  cursor: pointer !important;
  box-shadow: none !important;
  text-decoration: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.h360one-nav-022a255 button.active,
.h360one-nav-022a255 button:hover {
  background: linear-gradient(90deg, rgba(255,255,255,.22), rgba(255,255,255,.11)) !important;
  box-shadow: inset 4px 0 0 var(--h360one-cyan) !important;
}

.h360one-nav-022a255 button span {
  width: 32px !important;
  height: 32px !important;
  color: #fff !important;
  display: grid !important;
  place-items: center !important;
  font-size: 22px !important;
  line-height: 1 !important;
  opacity: 1 !important;
}

.h360one-nav-022a255 button b {
  color: #fff !important;
  font-size: 15.5px !important;
  line-height: 1.2 !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.h360one-fill-022a255 {
  min-height: 0 !important;
}

.h360one-promo-022a255 {
  width: 100% !important;
  height: 204px !important;
  min-height: 204px !important;
  max-height: 204px !important;
  padding: 20px 18px 16px !important;
  margin: 0 !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.15), rgba(255,255,255,.08)) !important;
  box-shadow: 0 18px 46px rgba(0,0,0,.13) !important;
  display: grid !important;
  justify-items: center !important;
  align-content: center !important;
  gap: 7px !important;
  text-align: center !important;
  overflow: hidden !important;
}

.h360one-promo-tooth-022a255 {
  width: 66px !important;
  height: 58px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  font-size: 50px !important;
  line-height: 1 !important;
  filter: drop-shadow(0 8px 14px rgba(0,0,0,.15)) !important;
}

.h360one-promo-022a255 h3 {
  margin: 0 !important;
  color: #fff !important;
  font-size: 16px !important;
  line-height: 1.3 !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
}

.h360one-promo-022a255 p {
  margin: 0 !important;
  color: rgba(255,255,255,.88) !important;
  font-size: 11.5px !important;
  line-height: 1.4 !important;
  font-weight: 800 !important;
}

.h360one-promo-022a255 button {
  width: 100% !important;
  height: 36px !important;
  border: 1px solid rgba(255,255,255,.30) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.07) !important;
  color: #fff !important;
  font-size: 12.5px !important;
  font-weight: 950 !important;
  cursor: pointer !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.h360one-actions-022a255 {
  width: 100% !important;
  height: 92px !important;
  display: grid !important;
  grid-template-rows: 42px 42px !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
}

.h360one-night-022a255,
.h360one-logout-022a255 {
  width: 100% !important;
  height: 42px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  box-shadow: none !important;
  padding: 0 13px !important;
  margin: 0 !important;
  cursor: pointer !important;
  display: grid !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important;
}

.h360one-night-022a255 {
  grid-template-columns: 48px minmax(0, 1fr) 28px !important;
}

.h360one-logout-022a255 {
  grid-template-columns: minmax(0, 1fr) 28px !important;
}

.h360one-night-022a255 b,
.h360one-logout-022a255 b {
  color: #fff !important;
  font-size: 14.5px !important;
  line-height: 1.2 !important;
  font-weight: 950 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.h360one-night-022a255 em,
.h360one-logout-022a255 em {
  color: #fff !important;
  font-size: 21px !important;
  font-style: normal !important;
  text-align: center !important;
}

.h360one-logout-022a255 em {
  color: #ffbbc4 !important;
}

.h360one-night-022a255 .toggle {
  width: 42px !important;
  height: 23px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.25) !important;
  position: relative !important;
  display: block !important;
}

.h360one-night-022a255 .toggle i {
  position: absolute !important;
  width: 15px !important;
  height: 15px !important;
  border-radius: 999px !important;
  background: #dfe8f8 !important;
  top: 4px !important;
  left: 5px !important;
}

/* One sidebar only: reserve right-side space for normal app roots. */
body.h360one-sidebar-mounted-022a255 > .h360one-root-offset-022a255:not(#h360one-sidebar-022a255) {
  width: calc(100vw - var(--h360one-sidebar-width)) !important;
  max-width: calc(100vw - var(--h360one-sidebar-width)) !important;
  margin-inline-end: var(--h360one-sidebar-width) !important;
  margin-inline-start: 0 !important;
  min-width: 0 !important;
}

/* Fullscreen treatment pages: keep content left and reserve the right column for the canonical sidebar only. */
body.h360one-sidebar-mounted-022a255 #h360pixel-stage-022a242,
body.h360one-sidebar-mounted-022a255 #h360rfinal-stage-022a241 {
  inset-inline-end: var(--h360one-sidebar-width) !important;
  width: calc(100vw - var(--h360one-sidebar-width)) !important;
  grid-template-columns: minmax(0, 1fr) 0 !important;
}

body.h360one-sidebar-mounted-022a255 #h360pixel-stage-022a242 .h360pixel-sidebar,
body.h360one-sidebar-mounted-022a255 #h360rfinal-stage-022a241 .h360rfinal-sidebar {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (max-height: 820px) {
  body.h360one-sidebar-mounted-022a255 {
    --h360one-sidebar-width: 276px;
  }

  #h360one-sidebar-022a255.h360one-sidebar-022a255 {
    width: var(--h360one-sidebar-width) !important;
    min-width: var(--h360one-sidebar-width) !important;
    max-width: var(--h360one-sidebar-width) !important;
    grid-template-rows: 78px 198px minmax(0, 1fr) 154px 84px !important;
    gap: 7px !important;
    padding-top: 10px !important;
  }

  .h360one-logo-022a255 {
    height: 78px !important;
    grid-template-columns: minmax(0,1fr) 56px !important;
  }

  .h360one-tooth-022a255 {
    width: 56px !important;
    height: 56px !important;
    border-radius: 17px !important;
    font-size: 37px !important;
  }

  .h360one-logo-text-022a255 strong {
    font-size: 23px !important;
  }

  .h360one-logo-text-022a255 span {
    font-size: 11.8px !important;
  }

  .h360one-nav-022a255 {
    height: 198px !important;
    grid-template-rows: repeat(4, 43px) !important;
    gap: 7px !important;
  }

  .h360one-nav-022a255 button {
    height: 43px !important;
    min-height: 43px !important;
  }

  .h360one-nav-022a255 button b {
    font-size: 14.5px !important;
  }

  .h360one-promo-022a255 {
    height: 154px !important;
    min-height: 154px !important;
    max-height: 154px !important;
    padding: 10px 14px !important;
    gap: 4px !important;
  }

  .h360one-promo-tooth-022a255 {
    height: 38px !important;
    font-size: 37px !important;
  }

  .h360one-promo-022a255 h3 {
    font-size: 14px !important;
  }

  .h360one-promo-022a255 p {
    font-size: 10.5px !important;
  }

  .h360one-promo-022a255 button {
    height: 30px !important;
  }

  .h360one-actions-022a255 {
    height: 84px !important;
    grid-template-rows: 38px 38px !important;
  }

  .h360one-night-022a255,
  .h360one-logout-022a255 {
    height: 38px !important;
  }
}
/* 0.22A.25.5_HEALTH360_SIDEBAR_SINGLE_RIGHT_FINAL_CSS_END */