/* Accepted photo-led supervisor design. Print reports retain their existing layout. */
@media screen{
.supervisor-design{--design-navy:#092b50;--design-line:#dce8f2;--design-soft:#f1f7fc;grid-template-columns:240px minmax(0,1fr);background:var(--design-soft);color:#183b62;min-height:100svh}
.supervisor-design .supervisor-sidebar{background:#082644;background-image:linear-gradient(160deg,#123b6380,transparent 70%);padding:38px 16px 20px;border:0;box-shadow:none;height:100svh;z-index:45}
.supervisor-design .supervisor-sidebar-brand{padding:12px 14px 35px;gap:14px;flex-direction:column;text-align:center;color:#fff}.supervisor-design .supervisor-sidebar-brand>svg{width:36px;height:36px;stroke-width:1.5}.supervisor-design .supervisor-sidebar-brand strong{font-size:24px;line-height:1.5}.supervisor-design .supervisor-sidebar-brand span{color:#afc9df;font-size:15px;margin-top:6px}
.supervisor-design .supervisor-tabs{display:flex;flex-direction:column;gap:8px;margin:0}.supervisor-design .supervisor-tabs button{display:flex;align-items:center;gap:15px;width:100%;min-height:62px;border:0;border-inline-start:3px solid transparent;border-radius:10px;padding:14px 14px;background:transparent;color:#dce8f3;font-size:16px;font-weight:500;line-height:1.5;text-align:right}.supervisor-design .supervisor-tabs button svg{width:22px;height:22px;flex:none;stroke-width:1.6}.supervisor-design .supervisor-tabs button:hover{background:#ffffff0b;color:#fff}.supervisor-design .supervisor-tabs button.active{background:linear-gradient(90deg,#0b355b,#1c5270);color:#fff;border-inline-start-color:#5be5d1;box-shadow:none}.supervisor-design .supervisor-sidebar-account{margin-top:auto;padding:22px 12px 0;border-top:1px solid #7fabc630;color:#fff}.supervisor-design .supervisor-sidebar-account span{color:#a9c2d8}.supervisor-design .supervisor-sidebar-account .icon-button{color:#dce8f3}
.supervisor-design .supervisor-workspace{position:relative;min-width:0}.supervisor-design-hero{height:370px;position:relative;overflow:hidden;background:#072d55;color:#fff;isolation:isolate}.supervisor-design-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 68%;z-index:-2}.supervisor-design-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#021c3c80,transparent 65%);z-index:-1}.supervisor-design-hero-copy{position:absolute;left:6%;top:110px;width:48%;text-align:right;direction:rtl;color:#fff}.supervisor-design-hero-copy>p:first-child{font-size:17px;color:#5be5d1;margin:0 0 12px}.supervisor-design-hero-copy h1{color:#fff;font-size:clamp(30px,3.2vw,49px);line-height:1.5;margin:0;font-weight:700;white-space:nowrap}.supervisor-design-hero-copy>p:last-child{font-size:19px;line-height:1.7;margin:14px 0 0;color:#e0ebf5}.supervisor-design-date{position:absolute;right:30px;bottom:58px;padding:9px 15px;border:1px solid #c7e0f17a;border-radius:12px;background:#07244380;backdrop-filter:blur(8px);font-size:14px;line-height:1.5}.supervisor-design-wave{position:absolute;width:100%;height:53px;bottom:-1px;left:0;pointer-events:none}.supervisor-design-hero.compact{height:230px}.supervisor-design-hero.compact .supervisor-design-hero-copy{top:75px}.supervisor-design-hero.compact .supervisor-design-hero-copy>p:first-child,.supervisor-design-hero.compact .supervisor-design-hero-copy>p:last-child{display:none}.supervisor-design-hero.compact .supervisor-design-date{bottom:45px}
.supervisor-design .supervisor-header{position:absolute;top:16px;left:23px;right:auto;width:48px;height:48px;background:transparent;border:0;padding:0;z-index:35}.supervisor-design .supervisor-brand,.supervisor-design .supervisor-account>div:not(.supervisor-notifications),.supervisor-design .supervisor-account>button{display:none}.supervisor-design .supervisor-account{gap:0}.supervisor-design .supervisor-account .icon-button{background:#092c53b3;color:#fff;border:1px solid #d6e7f27a;border-radius:14px;width:46px;height:46px}.supervisor-design .notification-panel{color:#173b60;background:#fff;left:0;right:auto}
body:has(.supervisor-design) .pharmacy-portal-nav{position:absolute;top:16px;left:80px;right:auto;max-width:420px;z-index:40;padding:0;gap:8px;background:transparent;border:0}.pharmacy-portal-nav:has(+.supervisor-design){background:transparent}body:has(.supervisor-design) .pharmacy-portal-nav>strong,body:has(.supervisor-design) .pharmacy-portal-nav>span{display:none}body:has(.supervisor-design) .pharmacy-portal-nav>button{background:#092c53ba;border:1px solid #d6e7f27a;color:#fff;border-radius:12px;padding:10px 17px;min-height:46px;font-size:15px}body:has(.supervisor-design) .pharmacy-portal-nav:has(button[aria-expanded=true]){background:#0b3055f5;border:1px solid #87abc270;padding:8px;border-radius:14px;max-width:390px;box-shadow:0 12px 24px #00152d30}body:has(.supervisor-design) .pharmacy-portal-nav:has(button[aria-expanded=true])>button{flex-basis:100%;text-align:right}
body:has(.supervisor-design) .narcotic-access-nav[aria-label="حساب المشرف ومهامه"]{position:absolute;top:16px;left:196px;z-index:36;margin:0;padding:0;background:transparent;display:flex;width:auto;min-height:46px;border:0}body:has(.supervisor-design) .narcotic-access-nav[aria-label="حساب المشرف ومهامه"]>button:first-child{display:none}body:has(.supervisor-design) .narcotic-access-nav[aria-label="حساب المشرف ومهامه"]>button{background:#092c53ba;border:1px solid #d6e7f27a;color:#fff;border-radius:12px;padding:10px 17px;font-size:15px;min-height:46px}
.supervisor-design .supervisor-content{position:relative;max-width:none;padding:0 26px 36px;display:flex;flex-direction:column;gap:20px}.supervisor-design .supervisor-content>[role=tabpanel]{order:0;min-width:0}.supervisor-design .supervisor-content>.supervisor-shift-comments{order:10}.supervisor-design #panel-monitoring{display:flex;flex-direction:column;gap:0;margin-top:-24px;z-index:2}.supervisor-design #panel-monitoring[hidden]{display:none!important}.supervisor-design .supervisor-kpis{order:0;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:0 0 22px}.supervisor-design .supervisor-kpi{min-width:0;min-height:110px;padding:19px 14px;border:1px solid #dce8f2;border-radius:15px;box-shadow:0 6px 18px #1c4e7310;gap:12px;justify-content:space-between;flex-direction:row-reverse;background:#fff}.supervisor-design .supervisor-kpi>svg{width:40px;height:40px;padding:9px;border-radius:50%;background:#eaf4ff;color:#277fc3;flex:none;stroke-width:1.7}.supervisor-design .supervisor-kpi>div{min-width:0;text-align:right}.supervisor-design .supervisor-kpi span{font-size:12px;font-weight:600;line-height:1.7;color:#29456b;display:block}.supervisor-design .supervisor-kpi strong{font-size:31px;line-height:1.45;color:#143758;font-weight:700;display:block}.supervisor-design .supervisor-kpi.mint{border-top:3px solid #42d6aa}.supervisor-design .supervisor-kpi.mint>svg{background:#e3faf2;color:#24a77c}.supervisor-design .supervisor-kpi.gold{border-top:3px solid #e8b84b}.supervisor-design .supervisor-kpi.gold>svg{background:#fff5df;color:#c88a17}
.supervisor-design .supervisor-title-row{order:1;display:flex;align-items:center;flex-wrap:wrap;gap:10px;background:#fff;margin:0;padding:22px 22px 13px;border:1px solid var(--design-line);border-bottom:0;border-radius:16px 16px 0 0}.supervisor-design .supervisor-title-row>div:not(.supervisor-design-tools){order:0;margin-inline-end:auto}.supervisor-design .supervisor-title-row h2{font-size:23px;line-height:1.5;margin:0;color:#143758}.supervisor-design .supervisor-title-row p{display:none}.supervisor-design .supervisor-title-row>.secondary-button{order:1;font-size:13px}.supervisor-design-tools{order:2;display:flex;gap:7px}.supervisor-design-tools button{font-size:13px;min-height:40px;padding:8px 11px;border-radius:9px}
.supervisor-design #panel-monitoring>.sync-banner{order:1}.supervisor-design #panel-monitoring>.supervisor-panel{order:2;border:1px solid var(--design-line);border-top:0;border-radius:0 0 16px 16px;padding:0 20px 14px;overflow:visible;background:#fff}.supervisor-design .supervisor-rifd-note{margin:0 0 10px;border-radius:8px;font-size:12px;padding:9px 12px;background:#f0f7fc;color:#496380;line-height:1.6}.supervisor-design .supervisor-filters{display:flex;flex-wrap:wrap;align-items:center;gap:9px;padding:6px 0 20px;background:#fff;border:0}.supervisor-design .supervisor-filters .search-field{flex:2 1 200px;min-width:150px}.supervisor-design .supervisor-filters select{flex:1 1 125px;max-width:100%;font-size:13px;min-height:42px;border:1px solid #d9e5ef;border-radius:9px;background:#fff;color:#294b6b}.supervisor-design .supervisor-filters input{font-size:13px;min-height:42px;border:1px solid #d9e5ef;border-radius:9px;background:#fff}.supervisor-design .supervisor-table-wrap{max-height:none;overflow:auto;border-radius:10px;min-width:0}.supervisor-design .supervisor-table{width:100%;min-width:650px;border-collapse:collapse;table-layout:auto;font-size:14px}.supervisor-design .supervisor-table th{background:#edf5fb;color:#264567;font-size:13px;font-weight:600;padding:13px 12px;border:0;text-align:right;white-space:nowrap;position:static}.supervisor-design .supervisor-table td{padding:17px 12px;border:0;border-bottom:1px solid #e8eff5;vertical-align:middle;color:#244666;line-height:1.6;text-align:right}.supervisor-design .supervisor-table tbody tr:nth-child(even){background:#f9fcff}.supervisor-design .supervisor-table tbody tr:hover{background:#f0f7ff}.supervisor-design .supervisor-table small{display:block;color:#7890a7;font-size:10px}.supervisor-design .supervisor-table .status-label{border-radius:30px;padding:5px 14px;font-size:12px;white-space:nowrap}.supervisor-design .status-label.done{background:#ddf8ee;color:#198969}.supervisor-design .status-label.pending{background:#fff4db;color:#a06b09}.supervisor-design .supervisor-rifd-button{border:1px solid #ccdfed;border-radius:8px;background:#fff;color:#24619b;font-size:12px;box-shadow:none;min-height:36px;padding:7px 10px;white-space:nowrap}
.supervisor-design:not(.supervisor-details) #panel-monitoring .supervisor-table :is(th,td):nth-child(1),.supervisor-design:not(.supervisor-details) #panel-monitoring .supervisor-table :is(th,td):nth-child(2),.supervisor-design:not(.supervisor-details) #panel-monitoring .supervisor-table :is(th,td):nth-child(5),.supervisor-design:not(.supervisor-details) #panel-monitoring .supervisor-table :is(th,td):nth-child(9){display:none}.supervisor-design.supervisor-details #panel-monitoring .supervisor-table{min-width:1000px}
.supervisor-design :is(.employee-table-wrap,.narcotic-panel,.schedule-panel,.report-panel){border-radius:15px}.supervisor-design .supervisor-content>[role=tabpanel]:not(#panel-monitoring){margin-top:8px}.supervisor-design .supervisor-shift-comments{background:#fff;border:1px solid var(--design-line);border-radius:14px;margin:0}.supervisor-design .room-env-dual-actions{display:flex;flex-wrap:wrap;gap:5px}
@media(max-width:1200px) and (min-width:901px){.supervisor-design{grid-template-columns:205px minmax(0,1fr)}.supervisor-design .supervisor-sidebar{padding-inline:10px}.supervisor-design .supervisor-tabs button{font-size:14px;padding:12px 8px;gap:9px}.supervisor-design .supervisor-sidebar-brand strong{font-size:21px}.supervisor-design .supervisor-kpis{gap:7px}.supervisor-design .supervisor-kpi{padding:15px 10px;gap:5px;flex-direction:column-reverse;align-items:flex-start}.supervisor-design .supervisor-kpi>svg{width:30px;height:30px;padding:6px}.supervisor-design .supervisor-kpi span{font-size:11px}.supervisor-design .supervisor-kpi strong{font-size:27px}.supervisor-design .supervisor-content{padding-inline:17px}.supervisor-design-hero-copy{width:52%;left:4%}.supervisor-design-hero-copy h1{font-size:34px}.supervisor-design-hero-copy>p:last-child{font-size:16px}}
@media(max-width:900px){.supervisor-design{display:block;padding-bottom:82px}.supervisor-design .supervisor-sidebar{position:fixed;inset:auto 0 0;height:auto;min-height:76px;padding:5px 6px max(7px,env(safe-area-inset-bottom));width:100%;background:#082644;border-top:1px solid #5f839f50;z-index:60}.supervisor-design .supervisor-sidebar-brand,.supervisor-design .supervisor-sidebar-account{display:none}.supervisor-design .supervisor-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px}.supervisor-design .supervisor-tabs button{font-size:10px;line-height:1.5;padding:7px 3px;min-height:61px;border-inline-start:0;border-top:2px solid transparent;border-radius:9px;display:flex;flex-direction:column;gap:5px;text-align:center;justify-content:center}.supervisor-design .supervisor-tabs button svg{width:19px;height:19px}.supervisor-design .supervisor-tabs button.active{border-top-color:#5be5d1;background:#174465}.supervisor-design-hero{height:340px}.supervisor-design-hero>img{object-position:70% 65%}.supervisor-design-hero-copy{top:100px;left:6%;width:65%;text-align:right}.supervisor-design-hero-copy h1{font-size:36px}.supervisor-design-hero-copy>p:first-child{font-size:14px}.supervisor-design-hero-copy>p:last-child{font-size:16px}.supervisor-design-date{right:18px;bottom:51px;font-size:12px;padding:7px 10px}.supervisor-design .supervisor-content{padding:0 14px 28px;gap:16px}.supervisor-design .supervisor-kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-bottom:17px}.supervisor-design .supervisor-kpi{min-height:103px;padding:13px 11px;gap:7px}.supervisor-design .supervisor-kpi span{font-size:11px}.supervisor-design .supervisor-kpi strong{font-size:27px}.supervisor-design .supervisor-kpi>svg{width:31px;height:31px;padding:7px}.supervisor-design .supervisor-title-row{padding:16px 15px 12px;gap:10px}.supervisor-design .supervisor-title-row h2{font-size:20px}.supervisor-design .supervisor-title-row>.secondary-button{font-size:11px;padding:7px 9px}.supervisor-design-tools{width:100%;order:3}.supervisor-design-tools button{flex:1;font-size:12px}.supervisor-design #panel-monitoring>.supervisor-panel{padding:0 12px 12px}.supervisor-design .supervisor-table{min-width:620px;font-size:13px}.supervisor-design .supervisor-table th,.supervisor-design .supervisor-table td{padding:12px 9px}.supervisor-design .supervisor-filters{gap:7px;padding-bottom:14px}.supervisor-design .supervisor-filters .search-field{flex-basis:100%}.supervisor-design .supervisor-filters select{flex:1 1 40%;min-width:0;font-size:12px}.supervisor-design .supervisor-rifd-note{font-size:11px}.supervisor-design .supervisor-header{left:13px;top:14px}.supervisor-design .supervisor-account>button{display:flex;margin-left:7px}.supervisor-design .supervisor-account{gap:5px}.supervisor-design .supervisor-account>button{display:none}body:has(.supervisor-design) .pharmacy-portal-nav{left:72px;top:14px;max-width:160px}body:has(.supervisor-design) .pharmacy-portal-nav>button{font-size:12px;min-height:42px;padding:8px 13px}body:has(.supervisor-design) .narcotic-access-nav[aria-label="حساب المشرف ومهامه"]{left:auto;right:14px;top:14px;min-height:42px}body:has(.supervisor-design) .narcotic-access-nav[aria-label="حساب المشرف ومهامه"]>button{min-height:42px;font-size:12px;padding:8px 11px}body:has(.supervisor-design) .pharmacy-portal-nav:has(button[aria-expanded=true]){max-width:260px;max-height:70vh;overflow:auto}.supervisor-design-hero.compact{height:210px}.supervisor-design-hero.compact .supervisor-design-hero-copy{top:85px}.supervisor-design-hero.compact .supervisor-design-hero-copy h1{font-size:26px}}
@media(max-width:550px){.supervisor-design-hero{height:320px}.supervisor-design-hero-copy{width:86%;left:7%;top:100px}.supervisor-design-hero-copy h1{font-size:32px}.supervisor-design-hero-copy>p:last-child{font-size:14px;max-width:250px}.supervisor-design .supervisor-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.supervisor-design .supervisor-kpi:last-child{grid-column:1/-1;min-height:72px;justify-content:flex-start;gap:15px;flex-direction:row}.supervisor-design .supervisor-kpi{min-height:95px}.supervisor-design .supervisor-tabs button{font-size:9px}.supervisor-design .supervisor-rifd-note{padding:8px}.supervisor-design .supervisor-title-row>div:not(.supervisor-design-tools){width:100%}.supervisor-design .supervisor-title-row>.secondary-button{order:2}.supervisor-design-tools{width:auto;flex:1;order:1}.supervisor-design .supervisor-title-row>.secondary-button span{display:none}.supervisor-design-date{bottom:47px}.supervisor-design .supervisor-table{min-width:580px}.supervisor-design .supervisor-content{padding-inline:10px}}
@media(prefers-reduced-motion:reduce){.supervisor-design *{animation:none!important;scroll-behavior:auto!important;transition:none!important}}
}
@media print{.supervisor-design-hero,.supervisor-design-tools{display:none!important}}

@media screen{
.supervisor-design .supervisor-sidebar-brand>svg{color:#fff}
.supervisor-design-hero>.supervisor-design-photo-base{z-index:-3;opacity:.7}
.supervisor-design-hero>.supervisor-design-photo-building{left:auto;right:0;width:64%;max-width:660px;height:100%;object-fit:cover;object-position:right center;mask-image:linear-gradient(90deg,transparent,#000 16%);z-index:-2}
@media(max-width:900px){.supervisor-design{padding-bottom:100px}.supervisor-design .supervisor-tabs{grid-template-columns:repeat(6,minmax(0,1fr))}.supervisor-design .supervisor-tabs button{min-height:76px;font-size:9px;line-height:1.4;padding:7px 2px}.supervisor-design .supervisor-header{width:94px}.supervisor-design .supervisor-account>button{display:flex}.supervisor-design .supervisor-account{gap:5px}.supervisor-design .supervisor-account .icon-button{width:40px;height:42px}.supervisor-design .supervisor-account>div:not(.supervisor-notifications){display:none}body:has(.supervisor-design) .pharmacy-portal-nav{left:112px}body:has(.supervisor-design) .narcotic-access-nav[aria-label="حساب المشرف ومهامه"]>button{font-size:11px;padding-inline:10px}.supervisor-design-hero-copy{left:5%;width:55%}.supervisor-design-hero-copy h1{font-size:30px;white-space:normal}.supervisor-design-hero-copy>p:last-child{font-size:15px}.supervisor-design-hero>.supervisor-design-photo-building{width:60%;object-position:right center}}
@media(max-width:550px){.supervisor-design-hero-copy{width:58%;left:5%;top:103px}.supervisor-design-hero-copy h1{font-size:25px;line-height:1.5}.supervisor-design-hero-copy>p:last-child{font-size:13px;margin-top:9px}.supervisor-design-hero-copy>p:first-child{font-size:12px;margin-bottom:7px}.supervisor-design-hero>.supervisor-design-photo-building{width:42%;object-position:88% center}.supervisor-design-hero-copy h1{max-width:220px}}
}

@media screen{.supervisor-design #panel-monitoring .supervisor-table td.empty-table{display:table-cell!important}.supervisor-design .supervisor-account>.supervisor-notifications{display:block}.supervisor-design .notification-trigger{width:46px;height:46px;border:1px solid #d6e7f27a;border-radius:14px;background:#092c53ba;color:#fff}.supervisor-design .notification-popover{right:auto;left:0;max-width:min(360px,calc(100vw - 28px));color:#173b60;background:#fff}.supervisor-design .notification-popover strong,.supervisor-design .notification-popover h2{color:#173b60}@media(max-width:900px){.supervisor-design .notification-trigger{width:40px;height:42px}}}
