@import url("/viewer/_shared/light-ui-foundation.css");
body.cif-light-ui{--primary:#176b5e;--primary-hover:#105548;--primary-soft:#e8f3ef;--gold:#176b5e;--gold-text:#176b5e;--gold-b:#cbded6;--gold-soft:#e8f3ef;background:#f5f7f7;color:#233a32}
body.cif-light-ui .brand-mark{background:#176b5e;color:#fff;box-shadow:none;border:0}
body.cif-light-ui .brand-sub{letter-spacing:0;text-transform:none;font-size:11px;color:#63746a}
body.cif-light-ui .osc-hero{background:#fff;border:1px solid #dce5df;box-shadow:none}
body.cif-light-ui .osc-hero h1{font-weight:700;color:#233a32}
body.cif-light-ui .page-title{font-size:26px;font-weight:700;line-height:1.5}
body.cif-light-ui .page-sub{font-size:13px;color:#63746a}
body.cif-light-ui .page-head>div:last-child{flex-wrap:wrap}
body.cif-light-ui .wrap{max-width:1328px}
body.cif-light-ui .bottom-nav{overflow-x:auto;justify-content:flex-start;padding-bottom:env(safe-area-inset-bottom,0);background:#fff;border-color:#dce5df}
body.cif-light-ui .bottom-nav a{min-width:66px;max-width:none;flex:1 0 66px}
body.cif-light-ui .bn-icon svg{width:20px;height:20px}
body.cif-light-ui .nav{flex-wrap:wrap}
body.cif-light-ui .card-icon,body.cif-light-ui .qa-ic,body.cif-light-ui .kc-step-ic{display:none}
body.cif-light-ui .kc-step-num{color:#63746a;letter-spacing:0}
body.cif-light-ui .table-wrap{border-radius:12px}
@media(max-width:720px){body.cif-light-ui .page-head{align-items:flex-start;gap:12px}body.cif-light-ui .wrap{padding-inline:16px}body.cif-light-ui .page-title{font-size:23px}body.cif-light-ui .page-head>div:last-child{max-width:100%;gap:6px!important}body.cif-light-ui .topbar-right{flex-wrap:wrap}body.cif-light-ui .user-pill{max-width:100%}}
body.cif-light-ui .btn-primary,body.cif-light-ui .sig-tab.active{background:#176b5e;border-color:#176b5e;color:#fff}
body.cif-light-ui .topbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}
body.cif-light-ui .topbar>.brand{grid-row:1;grid-column:1}
body.cif-light-ui .topbar>.topbar-right{grid-row:1;grid-column:2;white-space:nowrap}
body.cif-light-ui .topbar>.nav{grid-row:2;grid-column:1/-1}
body.cif-light-ui .topbar-right .btn{white-space:nowrap}
body.cif-light-ui .osc-secondary-actions{position:relative;font-size:12px}
body.cif-light-ui .osc-secondary-actions>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;border:1px solid #dce5df;border-radius:8px;padding:0 12px;background:#fff;color:#5d7065}
body.cif-light-ui .osc-secondary-actions>div{position:absolute;right:0;top:100%;z-index:20;display:grid;gap:8px;min-width:220px;background:#fff;border:1px solid #dce5df;padding:12px;border-radius:10px;box-shadow:0 5px 20px #173f3214}
@media(max-width:720px){body.cif-light-ui .topbar{grid-template-columns:1fr;gap:8px}body.cif-light-ui .topbar>.topbar-right{grid-column:1;grid-row:2}body.cif-light-ui #mytasks-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}body.cif-light-ui #mytasks-grid .kpi-card{padding:12px}body.cif-light-ui #mytasks-grid .kpi-n{font-size:23px}body.cif-light-ui .kc-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}body.cif-light-ui .kc-actions .btn{white-space:normal;font-size:12px}}

/* Keep OSC mobile labels readable within their own screen sections. */
@media (max-width: 720px) {
  body.cif-light-ui[data-nav="ai_tasks"] .ch-head { display:flex; flex-wrap:wrap; align-items:flex-start; gap:8px; }
  body.cif-light-ui[data-nav="ai_tasks"] .ch-head > h3 { flex-basis:100%; }
  body.cif-light-ui[data-nav="ai_tasks"] .ch-head > div { flex-wrap:wrap; min-width:0; max-width:100%; }
  body.cif-light-ui[data-nav="ai_tasks"] .ch-head > div > .btn { flex:0 0 auto; white-space:nowrap; }
  body.cif-light-ui .osc-import-history-scroll { min-width:0; max-width:100%; overflow-x:auto; }
  body.cif-light-ui .osc-import-history-scroll > #history-table { min-width:760px; }
  body.cif-light-ui .osc-import-history-scroll > #history-table th { white-space:nowrap; }
  body.cif-light-ui[data-nav="home"] .osc-grid > .osc-card[href="/viewer/osc/knowledge_center.html"] { grid-column:1 / -1 !important; }
  body.cif-light-ui[data-nav="schedule"] .sch-period { width:100%; flex-wrap:wrap; }
  body.cif-light-ui[data-nav="schedule"] .sch-period > #p-label { order:-1; flex:0 0 100%; min-width:0; white-space:nowrap; }
  body.cif-light-ui[data-nav="schedule"] .sch-period > button { flex:0 0 auto; white-space:nowrap; }
}