:root{
 --sh-blue:#1765a6;
 --sh-navy:#183f6a;
 --sh-teal:#148f95;
 --sh-bg:#f4f8fb;
 --sh-border:#e0e9ef;
 --sh-text:#263e52;
 --sh-muted:#7c8e9c;
 --sh-sidebar:245px;
 --sh-header:74px;
 --sh-shadow:0 7px 25px rgba(42,76,101,.07);
}

*{
 box-sizing:border-box;
}

body{
 margin:0;
 background:var(--sh-bg);
 color:var(--sh-text);
 font-family:
  -apple-system,
  BlinkMacSystemFont,
  "Segoe UI",
  "Noto Sans TC",
  "Microsoft JhengHei",
  sans-serif;
}


/* HEADER */

.sh-topbar{
 position:fixed;
 z-index:1500;
 top:0;
 left:0;
 right:0;
 height:var(--sh-header);
 display:flex;
 align-items:center;
 gap:15px;
 padding:0 20px;
 background:#fff;
 border-bottom:1px solid var(--sh-border);
 box-shadow:0 2px 10px rgba(44,76,99,.035);
}

.sh-brand{
 display:flex;
 align-items:center;
 gap:11px;
 text-decoration:none;
 color:inherit;
}

/*
 原始 JPG 有大量留白。
 這裡把中央吉祥物區裁成 Header Logo。
*/
.sh-logo-mark{
 width:47px;
 height:52px;
 flex:0 0 47px;
 overflow:hidden;
 border-radius:8px;
 background-image:
  url("/static/star_health_logo.jpg?v=20260912");
 background-repeat:no-repeat;
 background-size:132px auto;
 background-position:center -4px;
}

.sh-company-name strong{
 display:block;
 color:#293f52;
 font-size:13px;
 white-space:nowrap;
}

.sh-company-name span{
 display:block;
 margin-top:2px;
 color:#82909b;
 font-size:8px;
 white-space:nowrap;
}

.sh-brand-line{
 width:1px;
 height:38px;
 margin:0 5px;
 background:#d8e3e9;
}

.sh-system-name strong{
 display:block;
 color:#18568e;
 font-size:20px;
 letter-spacing:1px;
 white-space:nowrap;
}

.sh-system-name span{
 display:block;
 margin-top:3px;
 color:#6f8ca3;
 font-size:9px;
 letter-spacing:1.5px;
}

.sh-grow{
 flex:1;
}

.sh-company-pill{
 display:flex;
 align-items:center;
 gap:7px;
 padding:7px 10px;
 border:1px solid #dce9ef;
 border-radius:10px;
 background:#f0f8fb;
}

.sh-company-pill span{
 color:#8495a1;
 font-size:8px;
}

.sh-company-pill strong{
 max-width:180px;
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
 font-size:11px;
}

.sh-company-pill a{
 color:#176aa0;
 font-size:9px;
 font-weight:800;
}

.sh-user{
 display:flex;
 align-items:center;
 gap:9px;
}

.sh-user-avatar{
 width:34px;
 height:34px;
 display:flex;
 align-items:center;
 justify-content:center;
 border-radius:50%;
 background:linear-gradient(135deg,#dceefe,#b5d4ef);
 color:#17527e;
 font-weight:900;
}

.sh-user-text span{
 display:block;
 color:#8796a1;
 font-size:8px;
}

.sh-user-text strong{
 display:block;
 font-size:11px;
}

.sh-logout{
 margin-left:5px;
 padding:8px 14px !important;
 border:1px solid #79b3df !important;
 border-radius:10px !important;
 background:#fff !important;
 color:#1765a6 !important;
 box-shadow:none !important;
}

.sh-menu-btn{
 display:none;
}


/* LAYOUT */

.sh-layout{
 min-height:100vh;
 padding-top:var(--sh-header);
}

.sh-sidebar{
 position:fixed;
 z-index:1200;
 top:var(--sh-header);
 bottom:0;
 left:0;
 width:var(--sh-sidebar);
 display:flex;
 flex-direction:column;
 overflow-y:auto;
 background:linear-gradient(180deg,#fff,#f7fbfd);
 border-right:1px solid var(--sh-border);
}

.sh-main{
 min-width:0;
 margin-left:var(--sh-sidebar);
 padding:17px 21px 40px;
}


/* NAV */

.sh-nav{
 flex:1;
 padding:14px 12px;
}

.sh-nav a{
 display:flex;
 align-items:center;
 gap:9px;
 min-height:37px;
 margin:2px 0;
 padding:7px 10px;
 border-radius:8px;
 color:#425b6f;
 text-decoration:none;
 font-size:11px;
 font-weight:600;
}

.sh-nav a:hover{
 background:#eff7f9;
 color:#116f83;
}

.sh-nav a.active{
 background:linear-gradient(90deg,#d9f4f3,#e7f7fb);
 color:#087782;
 font-weight:900;
}

.sh-nav a > span{
 width:22px;
 flex:0 0 22px;
 text-align:center;
 color:#2d5b7a;
 font-size:13px;
}

.sh-nav-section{
 margin-top:7px;
 padding-top:7px;
 border-top:1px solid #edf2f4;
}

.sh-nav-title{
 padding:7px 10px 4px;
 color:#243e53;
 font-size:11px;
 font-weight:900;
}

.sh-nav-single{
 padding-top:4px;
}

.sh-sidebar-bottom{
 padding:13px;
}

.sh-sidebar-message{
 padding:15px;
 border-radius:13px;
 background:linear-gradient(135deg,#edf8fb,#f2faf4);
 color:#55758b;
 text-align:center;
 font-size:10px;
 line-height:1.7;
}

.sh-sidebar-star{
 color:#eebd20;
 font-size:22px;
}


/* CONTEXT */

.sh-context{
 display:flex;
 align-items:center;
 gap:15px;
 margin-bottom:14px;
 padding:9px 12px;
 background:#fff;
 border:1px solid var(--sh-border);
 border-radius:11px;
}

.sh-context > div:first-child span{
 display:block;
 color:#8998a4;
 font-size:8px;
}

.sh-context > div:first-child strong{
 display:block;
 margin-top:1px;
 font-size:11px;
}

.sh-context-links{
 display:flex;
 gap:4px;
 margin-left:auto;
 overflow-x:auto;
}

.sh-context-links a{
 padding:6px 9px;
 border-radius:7px;
 color:#536c7d;
 text-decoration:none;
 white-space:nowrap;
 font-size:9px;
 font-weight:700;
}

.sh-context-links a:hover{
 background:#edf7f9;
}


/* HERO */

.sh-hero{
 position:relative;
 min-height:178px;
 display:grid;
 grid-template-columns:210px minmax(280px,1fr) 260px;
 align-items:center;
 gap:15px;
 overflow:hidden;
 padding:18px 32px;
 border:1px solid #d9eaf1;
 border-radius:17px;
 background:
  radial-gradient(circle at 77% 40%,rgba(190,231,234,.68),transparent 27%),
  linear-gradient(110deg,#eefaff,#f8fcff 46%,#eef9f6);
}

.sh-hero-brand{
 height:135px;
 display:flex;
 align-items:center;
 justify-content:center;
 overflow:hidden;
}

.sh-hero-brand img{
 width:215px;
 height:auto;
 mix-blend-mode:multiply;
}

.sh-hero-small{
 color:#4f98b8;
 font-size:9px;
 font-weight:900;
 letter-spacing:2px;
}

.sh-hero-copy h1{
 margin:4px 0 0;
 color:#124f85;
 font-size:29px;
}

.sh-hero-copy h2{
 margin:9px 0 4px;
 color:#316b97;
 font-size:14px;
}

.sh-hero-copy p{
 margin:0;
 color:#637f95;
 font-size:12px;
}

.sh-hero-slogan{
 text-align:center;
 color:#477ba3;
 transform:rotate(-3deg);
}

.sh-hero-slogan div{
 font-size:13px;
 letter-spacing:3px;
}

.sh-hero-slogan strong{
 display:block;
 margin-top:5px;
 font-size:15px;
 letter-spacing:3px;
}

.sh-hero-slogan span{
 display:block;
 margin-top:13px;
 color:#7d98ad;
 font-family:serif;
 font-size:10px;
 line-height:1.45;
}


/* KPI */

.sh-kpis{
 display:grid;
 grid-template-columns:repeat(4,minmax(0,1fr));
 gap:11px;
 margin:14px 0;
}

.sh-kpi{
 min-height:82px;
 display:flex;
 align-items:center;
 gap:12px;
 padding:13px 15px;
 border:1px solid transparent;
 border-radius:13px;
 color:inherit;
 text-decoration:none;
}

.sh-kpi.green{
 background:#ebfaf4;
 border-color:#d6eee4;
}

.sh-kpi.blue{
 background:#edf6ff;
 border-color:#dceaf7;
}

.sh-kpi.orange{
 background:#fff4ea;
 border-color:#f3e3d3;
}

.sh-kpi.purple{
 background:#f4f0ff;
 border-color:#e6def5;
}

.sh-kpi-icon{
 width:43px;
 height:43px;
 flex:0 0 43px;
 display:flex;
 align-items:center;
 justify-content:center;
 border-radius:50%;
 background:rgba(255,255,255,.82);
 color:#267b9f;
 font-size:18px;
}

.sh-kpi span{
 display:block;
 color:#536b7c;
 font-size:10px;
 font-weight:700;
}

.sh-kpi strong{
 display:block;
 margin-top:3px;
 color:#193b56;
 font-size:27px;
 line-height:1;
}

.sh-kpi small{
 font-size:10px;
}

.sh-kpi > b{
 margin-left:auto;
 color:#527a96;
 font-size:20px;
}

.sh-kpi-text{
 padding-top:5px;
 font-size:17px !important;
}


/* PANELS */

.sh-panel{
 padding:16px;
 border:1px solid var(--sh-border);
 border-radius:14px;
 background:#fff;
 box-shadow:var(--sh-shadow);
}

.sh-panel-header{
 display:flex;
 justify-content:space-between;
 gap:15px;
 margin-bottom:12px;
}

.sh-panel-header h2{
 margin:0;
 color:#214d72;
 font-size:16px;
}

.sh-panel-header h2 span{
 color:#16859b;
}

.sh-panel-header p{
 margin:3px 0 0;
 color:var(--sh-muted);
 font-size:9px;
}

.sh-panel-header > a{
 color:#247eae;
 text-decoration:none;
 font-size:9px;
 font-weight:800;
}


/* QUICK */

.sh-quick-grid{
 display:grid;
 grid-template-columns:repeat(5,minmax(0,1fr));
 gap:8px;
}

.sh-quick{
 min-height:70px;
 display:flex;
 align-items:center;
 gap:10px;
 padding:10px 11px;
 border:1px solid #e4ecf1;
 border-radius:10px;
 background:#fff;
 color:inherit;
 text-decoration:none;
 transition:.15s ease;
}

.sh-quick:hover{
 transform:translateY(-1px);
 border-color:#c4dbe7;
 box-shadow:0 5px 15px rgba(45,78,103,.07);
}

.sh-qicon{
 width:36px;
 height:36px;
 flex:0 0 36px;
 display:flex;
 align-items:center;
 justify-content:center;
 border-radius:50%;
 font-size:15px;
 font-weight:900;
}

.sh-qicon.blue{
 background:#e7f3ff;
 color:#2679bc;
}

.sh-qicon.green{
 background:#e5faf0;
 color:#15966c;
}

.sh-qicon.purple{
 background:#eeebff;
 color:#6457d3;
}

.sh-qicon.orange{
 background:#fff0e4;
 color:#df7626;
}

.sh-qicon.teal{
 background:#e2f8f8;
 color:#149398;
}

.sh-qicon.violet{
 background:#f0ebff;
 color:#765bcd;
}

.sh-qicon.pink{
 background:#fde9f1;
 color:#cf4e82;
}

.sh-quick strong{
 display:block;
 color:#29475e;
 font-size:11px;
}

.sh-quick span{
 display:block;
 margin-top:2px;
 color:#84929e;
 font-size:8px;
}


/* LOWER */

.sh-home-bottom{
 display:grid;
 grid-template-columns:1.05fr 1fr;
 gap:12px;
 margin-top:13px;
}

.sh-task-list,
.sh-reminders{
 display:grid;
 gap:6px;
}

.sh-task{
 display:grid;
 grid-template-columns:27px 68px 1fr 12px;
 align-items:center;
 gap:8px;
 padding:8px 9px;
 border:1px solid #e4ebf0;
 border-radius:9px;
 color:inherit;
 text-decoration:none;
}

.sh-task-no{
 width:25px;
 height:25px;
 display:flex;
 align-items:center;
 justify-content:center;
 border-radius:50%;
 background:#e3f1ff;
 color:#297abd;
 font-size:10px;
 font-weight:900;
}

.sh-task-time{
 color:#416f94;
 font-size:9px;
 font-weight:800;
}

.sh-task-content strong{
 display:block;
 font-size:10px;
}

.sh-task-content span{
 display:block;
 margin-top:2px;
 color:#82919d;
 font-size:8px;
}

.sh-task > b{
 color:#69889e;
}

.sh-reminder{
 display:grid;
 grid-template-columns:8px 1fr auto;
 align-items:center;
 gap:8px;
 padding:7px 3px;
 border-bottom:1px solid #edf1f4;
 color:inherit;
 text-decoration:none;
}

.sh-reminder i{
 width:6px;
 height:6px;
 border-radius:50%;
 background:#42a0d6;
}

.sh-reminder strong{
 display:block;
 font-size:9px;
}

.sh-reminder span{
 display:block;
 margin-top:2px;
 color:#8795a0;
 font-size:8px;
}

.sh-reminder time{
 color:#748ea4;
 font-size:8px;
}

.sh-empty{
 padding:23px 10px;
 text-align:center;
}

.sh-empty.compact{
 padding:17px 8px;
}

.sh-empty > div{
 color:#4b9db6;
 font-size:22px;
}

.sh-empty strong{
 display:block;
 margin-top:4px;
 font-size:10px;
}

.sh-empty span{
 display:block;
 margin:3px 0 8px;
 color:#89979f;
 font-size:8px;
}

.sh-empty a{
 color:#237cab;
 font-size:9px;
 font-weight:800;
}


/* INTERNAL */

.sh-internal{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:20px;
 margin-top:13px;
 padding:16px 19px;
 border:1px solid #dce9ef;
 border-radius:13px;
 background:linear-gradient(110deg,#f1f9ff,#effaf8);
}

.sh-internal span{
 color:#6da1ba;
 font-size:7px;
 font-weight:900;
 letter-spacing:1.4px;
}

.sh-internal h2{
 margin:2px 0 3px;
 font-size:14px;
}

.sh-internal p{
 margin:0;
 color:#7c909e;
 font-size:9px;
}

.sh-internal > a{
 padding:8px 12px;
 border-radius:8px;
 background:#177d92;
 color:#fff;
 text-decoration:none;
 font-size:9px;
 font-weight:900;
}


/* Existing pages */

.sh-main .card{
 border:1px solid var(--sh-border);
 border-radius:13px;
 background:#fff;
 box-shadow:0 4px 15px rgba(45,78,103,.045);
}

.sh-main table{
 width:100%;
}

.sh-main th{
 background:#edf5f6;
 color:#3e586a;
}

.sh-main input,
.sh-main select,
.sh-main textarea{
 border:1px solid #cedbe3;
 border-radius:8px;
}


/* MOBILE */

.sh-nav-backdrop{
 display:none;
}

@media(max-width:1200px){

 .sh-company-name{
  display:none;
 }

 .sh-quick-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
 }

 .sh-hero{
  grid-template-columns:150px 1fr 200px;
 }

 .sh-hero-brand img{
  width:180px;
 }

}

@media(max-width:950px){

 :root{
  --sh-sidebar:220px;
 }

 .sh-system-name span{
  display:none;
 }

 .sh-kpis{
  grid-template-columns:repeat(2,minmax(0,1fr));
 }

 .sh-home-bottom{
  grid-template-columns:1fr;
 }

 .sh-hero{
  grid-template-columns:125px 1fr;
 }

 .sh-hero-slogan{
  display:none;
 }

}

@media(max-width:760px){

 :root{
  --sh-header:62px;
 }

 .sh-menu-btn{
  display:block;
  width:35px;
  height:35px;
  padding:0 !important;
  background:#fff !important;
  border:1px solid #d8e5ec !important;
  color:#167087 !important;
 }

 .sh-logo-mark{
  width:40px;
  height:43px;
  flex-basis:40px;
  background-size:112px auto;
 }

 .sh-brand-line,
 .sh-company-pill,
 .sh-user-text{
  display:none;
 }

 .sh-system-name strong{
  font-size:13px;
 }

 .sh-sidebar{
  left:-270px;
  width:255px;
  transition:left .18s ease;
 }

 body.sh-nav-open .sh-sidebar{
  left:0;
 }

 body.sh-nav-open .sh-nav-backdrop{
  display:block;
  position:fixed;
  z-index:1100;
  inset:var(--sh-header) 0 0;
  background:rgba(21,43,58,.28);
 }

 .sh-main{
  margin-left:0;
  padding:12px;
 }

 .sh-hero{
  display:block;
  min-height:0;
  padding:18px;
 }

 .sh-hero-brand{
  display:none;
 }

 .sh-hero-copy h1{
  font-size:23px;
 }

 .sh-quick-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
 }

 .sh-context{
  display:block;
 }

 .sh-context-links{
  margin-top:7px;
 }

}

@media(max-width:480px){

 .sh-topbar{
  padding:0 8px;
  gap:6px;
 }

 .sh-user-avatar{
  display:none;
 }

 .sh-system-name strong{
  font-size:11px;
 }

 .sh-logout{
  padding:6px 8px !important;
 }

 .sh-kpis{
  gap:6px;
 }

 .sh-kpi{
  padding:10px;
 }

 .sh-kpi-icon{
  width:34px;
  height:34px;
  flex-basis:34px;
 }

 .sh-kpi strong{
  font-size:21px;
 }

 .sh-quick-grid{
  grid-template-columns:1fr;
 }

}


/* ==========================================================
   STAR HEALTH READABILITY V3.1
   字級與品牌識別修正版
   ========================================================== */

:root{
    --sh-sidebar:265px;
    --sh-header:88px;
}


/* ---------- Header Logo ---------- */

.sh-logo-mark{
    display:none !important;
}

.sh-logo-image{
    display:block;
    width:92px;
    height:72px;
    flex:0 0 92px;
    object-fit:contain;
    object-position:center;
}


/* ---------- Header ---------- */

.sh-topbar{
    padding:0 24px;
    gap:16px;
}

.sh-company-name strong{
    font-size:15px;
    line-height:1.35;
}

.sh-company-name span{
    margin-top:3px;
    font-size:10px;
}

.sh-system-name strong{
    font-size:24px;
    line-height:1.25;
}

.sh-system-name span{
    margin-top:4px;
    font-size:11px;
    letter-spacing:1.7px;
}

.sh-user-avatar{
    width:40px;
    height:40px;
    font-size:15px;
}

.sh-user-text span{
    font-size:10px;
}

.sh-user-text strong{
    font-size:14px;
}

.sh-logout{
    padding:9px 17px !important;
    font-size:13px !important;
}


/* ---------- Sidebar ---------- */

.sh-nav{
    padding:18px 14px;
}

.sh-nav a{
    min-height:43px;
    padding:9px 12px;
    font-size:13px;
    line-height:1.35;
}

.sh-nav a > span{
    width:25px;
    flex-basis:25px;
    font-size:15px;
}

.sh-nav-title{
    padding:10px 11px 6px;
    font-size:13px;
}

.sh-sidebar-message{
    font-size:12px;
}

.sh-sidebar-star{
    font-size:26px;
}


/* ---------- Main ---------- */

.sh-main{
    padding:20px 24px 48px;
    font-size:14px;
}


/* ---------- Hero ---------- */

.sh-hero{
    min-height:215px;
    grid-template-columns:
        245px
        minmax(340px,1fr)
        310px;
    padding:22px 38px;
}

.sh-hero-brand{
    height:170px;
}

.sh-hero-brand img{
    width:250px;
    max-height:170px;
    object-fit:contain;
}

.sh-hero-small{
    font-size:11px;
}

.sh-hero-copy h1{
    font-size:36px;
    line-height:1.2;
}

.sh-hero-copy h2{
    margin-top:12px;
    font-size:18px;
}

.sh-hero-copy p{
    margin-top:5px;
    font-size:14px;
}

.sh-hero-slogan div{
    font-size:16px;
}

.sh-hero-slogan strong{
    font-size:18px;
}

.sh-hero-slogan span{
    font-size:12px;
}


/* ---------- KPI ---------- */

.sh-kpi{
    min-height:98px;
    padding:16px 19px;
}

.sh-kpi-icon{
    width:49px;
    height:49px;
    flex-basis:49px;
    font-size:20px;
}

.sh-kpi span{
    font-size:13px;
}

.sh-kpi strong{
    margin-top:5px;
    font-size:32px;
}

.sh-kpi small{
    font-size:12px;
}

.sh-kpi-text{
    font-size:20px !important;
}


/* ---------- Panels ---------- */

.sh-panel{
    padding:20px;
}

.sh-panel-header h2{
    font-size:20px;
}

.sh-panel-header p{
    margin-top:5px;
    font-size:12px;
}

.sh-panel-header > a{
    font-size:12px;
}


/* ---------- Quick Functions ---------- */

.sh-quick{
    min-height:84px;
    padding:13px 14px;
}

.sh-qicon{
    width:43px;
    height:43px;
    flex-basis:43px;
    font-size:18px;
}

.sh-quick strong{
    font-size:14px;
}

.sh-quick span{
    margin-top:4px;
    font-size:11px;
    line-height:1.4;
}


/* ---------- Today Tasks ---------- */

.sh-task{
    min-height:55px;
    grid-template-columns:
        31px
        86px
        1fr
        15px;
    padding:10px 11px;
}

.sh-task-no{
    width:29px;
    height:29px;
    font-size:12px;
}

.sh-task-time{
    font-size:11px;
}

.sh-task-content strong{
    font-size:13px;
}

.sh-task-content span{
    margin-top:3px;
    font-size:11px;
}


/* ---------- Reminders ---------- */

.sh-reminder{
    min-height:49px;
    padding:10px 5px;
}

.sh-reminder strong{
    font-size:12px;
}

.sh-reminder span{
    font-size:10px;
}

.sh-reminder time{
    font-size:10px;
}


/* ---------- Empty Areas ---------- */

.sh-empty strong{
    font-size:13px;
}

.sh-empty span{
    margin:5px 0 10px;
    font-size:11px;
}

.sh-empty a{
    font-size:11px;
}


/* ---------- Context navigation ---------- */

.sh-context{
    padding:11px 14px;
}

.sh-context > div:first-child span{
    font-size:10px;
}

.sh-context > div:first-child strong{
    font-size:13px;
}

.sh-context-links a{
    padding:7px 11px;
    font-size:11px;
}


/* ---------- General existing pages ---------- */

.sh-main h1{
    font-size:28px;
}

.sh-main h2{
    font-size:20px;
}

.sh-main table th{
    font-size:13px;
}

.sh-main table td{
    font-size:13px;
}

.sh-main input,
.sh-main select,
.sh-main textarea,
.sh-main button,
.sh-main .btn{
    font-size:13px;
}


/* ---------- 1440px 以下 ---------- */

@media(max-width:1450px){

    :root{
        --sh-sidebar:245px;
        --sh-header:82px;
    }

    .sh-logo-image{
        width:82px;
        height:65px;
        flex-basis:82px;
    }

    .sh-system-name strong{
        font-size:21px;
    }

    .sh-nav a{
        font-size:12px;
    }

    .sh-hero{
        grid-template-columns:
            205px
            minmax(300px,1fr)
            240px;
    }

    .sh-hero-copy h1{
        font-size:31px;
    }

}


/* ---------- Tablet ---------- */

@media(max-width:950px){

    .sh-logo-image{
        width:66px;
        height:57px;
        flex-basis:66px;
    }

    .sh-hero-copy h1{
        font-size:27px;
    }

}


/* ---------- Mobile ---------- */

@media(max-width:760px){

    :root{
        --sh-header:66px;
    }

    .sh-logo-image{
        width:48px;
        height:48px;
        flex-basis:48px;
    }

    .sh-main{
        font-size:14px;
    }

    .sh-system-name strong{
        font-size:14px;
    }

    .sh-nav a{
        font-size:14px;
    }

    .sh-hero-copy h1{
        font-size:27px;
    }

}



/* ==========================================================
   STAR HEALTH WORKSPACE UI V4
   Vendor workspace + Health files
   ========================================================== */

.v4-page-hero{
    position:relative;
    display:flex;
    align-items:center;
    gap:20px;
    min-height:145px;
    padding:25px 28px;
    margin-bottom:14px;
    overflow:hidden;
    border:1px solid #dbeaf1;
    border-radius:18px;
    background:
        radial-gradient(
            circle at 80% 40%,
            rgba(177,228,231,.45),
            transparent 29%
        ),
        linear-gradient(
            110deg,
            #ffffff,
            #f3fbfd 58%,
            #edf9f7
        );
}

.v4-page-hero::after{
    content:"";
    position:absolute;
    right:-30px;
    bottom:-90px;
    width:310px;
    height:170px;
    border-radius:50%;
    background:
        linear-gradient(
            135deg,
            rgba(122,207,214,.18),
            rgba(75,179,184,.08)
        );
}

.v4-page-icon{
    width:72px;
    height:72px;
    flex:0 0 72px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#dff5f5;
    color:#11858c;
    font-size:31px;
    font-weight:900;
}

.v4-page-copy{
    position:relative;
    z-index:2;
    flex:1;
}

.v4-eyebrow{
    margin-bottom:4px;
    color:#158285;
    font-size:11px;
    font-weight:900;
    letter-spacing:1.8px;
}

.v4-page-copy h1{
    margin:0;
    color:#123b62;
    font-size:31px !important;
}

.v4-page-copy p{
    margin:8px 0 0;
    color:#708393;
    font-size:14px;
    line-height:1.6;
}

.v4-hero-slogan{
    position:relative;
    z-index:2;
    margin-right:20px;
    color:#5797bd;
    text-align:center;
    transform:rotate(-4deg);
}

.v4-hero-slogan span{
    display:block;
    font-size:14px;
    letter-spacing:2px;
}

.v4-hero-slogan strong{
    display:block;
    margin-top:5px;
    font-size:16px;
    letter-spacing:2px;
}

.v4-hero-actions{
    position:relative;
    z-index:2;
    display:flex;
    gap:9px;
}

.v4-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    padding:0 16px;
    border-radius:10px;
    text-decoration:none;
    font-size:13px;
    font-weight:900;
}

.v4-btn.primary{
    background:#13898b;
    color:#fff;
}

.v4-btn.secondary{
    background:#fff;
    border:1px solid #9acfd0;
    color:#17777b;
}


/* KPI */

.v4-kpi-grid{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:11px;
    margin-bottom:16px;
}

.v4-kpi-grid.five{
    grid-template-columns:
        repeat(5,minmax(0,1fr));
}

.v4-kpi{
    display:flex;
    align-items:center;
    gap:13px;
    min-height:95px;
    padding:15px 17px;
    border:1px solid #dfeaf0;
    border-radius:14px;
    color:inherit;
    text-decoration:none;
    background:#fff;
    transition:.16s ease;
}

.v4-kpi:hover{
    transform:translateY(-2px);
    box-shadow:0 7px 22px rgba(43,78,103,.08);
}

.v4-kpi.blue{
    background:linear-gradient(135deg,#fff,#f0f7ff);
}

.v4-kpi.green{
    background:linear-gradient(135deg,#fff,#eefaf6);
}

.v4-kpi.purple{
    background:linear-gradient(135deg,#fff,#f5f1ff);
}

.v4-kpi.orange{
    background:linear-gradient(135deg,#fff,#fff5ec);
}

.v4-kpi.cyan{
    background:linear-gradient(135deg,#fff,#edf9fb);
}

.v4-kpi-icon{
    width:48px;
    height:48px;
    flex:0 0 48px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(255,255,255,.9);
    color:#17879a;
    font-size:21px;
}

.v4-kpi span{
    display:block;
    color:#617485;
    font-size:13px;
    font-weight:800;
}

.v4-kpi strong{
    display:block;
    margin-top:4px;
    color:#163953;
    font-size:31px;
    line-height:1;
}

.v4-kpi > b{
    margin-left:auto;
    color:#2c84a3;
    font-size:23px;
}


/* Sections */

.v4-section{
    margin-bottom:16px;
    padding:18px;
    border:1px solid #dce8ee;
    border-radius:15px;
    background:#fff;
    box-shadow:0 4px 16px rgba(47,79,102,.04);
}

.v4-section-header{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:15px;
}

.v4-section-letter{
    width:43px;
    height:43px;
    flex:0 0 43px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    background:linear-gradient(135deg,#18a3a5,#08767f);
    color:#fff;
    font-size:18px;
    font-weight:900;
}

.v4-section-header h2{
    margin:0;
    color:#173d5f;
    font-size:22px !important;
}

.v4-section-header p{
    margin:4px 0 0;
    color:#7a8c99;
    font-size:13px;
}

.v4-section-note{
    margin-left:auto;
    color:#6c8795;
    font-size:12px;
}


/* A Cards */

.v4-module-grid{
    display:grid;
    gap:10px;
}

.v4-module-grid.four{
    grid-template-columns:
        repeat(4,minmax(0,1fr));
}

.v4-module-card{
    position:relative;
    display:flex;
    align-items:flex-start;
    gap:11px;
    min-height:160px;
    padding:15px;
    border:1px solid #dfe8ed;
    border-radius:13px;
    background:#fff;
    color:inherit;
    text-decoration:none;
}

.v4-module-card:hover{
    border-color:#a9d7d8;
    box-shadow:0 5px 18px rgba(44,78,101,.06);
}

.v4-module-badge{
    position:absolute;
    top:12px;
    left:12px;
    min-width:34px;
    padding:6px 7px;
    border-radius:8px;
    background:#e1f5f5;
    color:#137b80;
    text-align:center;
    font-size:11px;
    font-weight:900;
}

.v4-module-icon{
    width:46px;
    height:46px;
    margin-top:38px;
    flex:0 0 46px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#e6f7f7;
    color:#14898d;
    font-size:21px;
}

.v4-module-body{
    padding-top:37px;
    min-width:0;
}

.v4-module-body h3{
    margin:0;
    color:#1f425d;
    font-size:16px;
}

.v4-module-body p{
    margin:6px 0 0;
    color:#758895;
    font-size:12px;
    line-height:1.6;
}

.v4-card-action{
    position:absolute;
    right:14px;
    bottom:13px;
    color:#147d82;
    font-size:12px;
    font-weight:900;
}

.v4-mini-actions{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:11px;
}

.v4-mini-actions a{
    padding:6px 9px;
    border:1px solid #cce5e6;
    border-radius:7px;
    background:#f2f9f9;
    color:#126e73;
    text-decoration:none;
    font-size:10px;
    font-weight:800;
}


/* B Section */

.v4-b-workspace{
    display:grid;
    grid-template-columns:
        1.7fr repeat(4,1fr);
    gap:9px;
}

.v4-b-main,
.v4-b-tool{
    display:flex;
    align-items:center;
    gap:11px;
    min-height:96px;
    padding:13px;
    border:1px solid #dfe9ee;
    border-radius:11px;
    color:inherit;
    text-decoration:none;
}

.v4-b-main{
    background:linear-gradient(135deg,#fff,#effafa);
}

.v4-large-icon{
    width:50px;
    height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#e0f5f5;
    color:#11848a;
    font-size:22px;
}

.v4-b-main h3{
    margin:0;
    font-size:16px;
}

.v4-b-main p{
    margin:5px 0 0;
    color:#7d8e9a;
    font-size:11px;
}

.v4-b-main > span{
    margin-left:auto;
    color:#fff;
    padding:8px 11px;
    border-radius:8px;
    background:#148b8c;
    font-size:11px;
    font-weight:900;
}

.v4-b-tool{
    position:relative;
    display:block;
}

.v4-b-tool strong{
    display:block;
    color:#274862;
    font-size:13px;
}

.v4-b-tool span{
    display:block;
    margin-top:7px;
    color:#85939d;
    font-size:10px;
}

.v4-b-tool b{
    position:absolute;
    right:11px;
    bottom:10px;
    color:#2786a2;
}


/* C / D */

.v4-bottom-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:11px;
}

.v4-bottom-card{
    display:flex;
    align-items:center;
    gap:13px;
    min-height:115px;
    padding:16px;
    border:1px solid #dfe8ed;
    border-radius:14px;
    background:#fff;
    color:inherit;
    text-decoration:none;
}

.v4-bottom-card:hover{
    box-shadow:0 6px 18px rgba(44,78,101,.06);
}

.v4-bottom-icon{
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#e5f7f4;
    color:#138b73;
    font-size:20px;
}

.v4-bottom-card h2{
    margin:0;
    color:#213f5a;
    font-size:19px !important;
}

.v4-bottom-card p{
    margin:5px 0 0;
    color:#7a8b97;
    font-size:12px;
}

.v4-bottom-card > span{
    margin-left:auto;
    color:#157d82;
    font-size:12px;
    font-weight:900;
}


/* health file workflow */

.v4-process-grid{
    display:grid;
    grid-template-columns:
        1fr auto 1fr auto 1fr auto 1fr;
    gap:8px;
    align-items:stretch;
}

.v4-process-card{
    position:relative;
    min-height:170px;
    padding:15px;
    border:1px solid #dee9ee;
    border-radius:12px;
    background:#fff;
    color:inherit;
    text-decoration:none;
}

.v4-process-card .v4-module-icon{
    margin-top:37px;
}

.v4-process-card h3{
    margin:10px 0 0;
    color:#23445e;
    font-size:15px;
}

.v4-process-card p{
    margin:6px 0 0;
    color:#798b98;
    font-size:11px;
    line-height:1.55;
}

.v4-process-card > span{
    position:absolute;
    right:12px;
    bottom:11px;
    color:#147c81;
    font-size:11px;
    font-weight:900;
}

.v4-process-arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#8ed1d4;
    font-size:29px;
}


/* health file search */

.v4-search-shell{
    display:flex;
    align-items:center;
    gap:18px;
    padding:16px 18px;
    margin-bottom:13px;
    border:1px solid #dde8ed;
    border-radius:13px;
    background:#fff;
}

.v4-search-title{
    display:flex;
    align-items:center;
    gap:10px;
}

.v4-search-title > span{
    width:38px;
    height:38px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#e4f7f7;
    color:#148589;
    font-size:19px;
}

.v4-search-title h2{
    margin:0;
    font-size:17px !important;
}

.v4-search-title p{
    margin:2px 0 0;
    color:#84939d;
    font-size:10px;
}

.v4-search-actions{
    display:flex;
    gap:7px;
    flex-wrap:wrap;
    margin-left:auto;
}

.v4-search-entry{
    padding:8px 11px;
    border:1px solid #cfe5e6;
    border-radius:8px;
    background:#f4fafa;
    color:#14747a;
    text-decoration:none;
    font-size:11px;
    font-weight:800;
}

.v4-info-note{
    padding:12px 15px;
    border:1px solid #d9e7e9;
    border-radius:10px;
    background:#f1f8f7;
    color:#60747d;
    font-size:11px;
}

.v4-info-note span{
    margin-left:15px;
    color:#89969e;
}


/* Responsive */

@media(max-width:1200px){

    .v4-kpi-grid.five{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

    .v4-module-grid.four{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .v4-b-workspace{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .v4-b-main{
        grid-column:1 / -1;
    }

    .v4-process-grid{
        grid-template-columns:
            1fr 1fr;
    }

    .v4-process-arrow{
        display:none;
    }

}

@media(max-width:760px){

    .v4-page-hero{
        align-items:flex-start;
        flex-wrap:wrap;
        padding:18px;
    }

    .v4-page-icon{
        width:55px;
        height:55px;
        flex-basis:55px;
        font-size:23px;
    }

    .v4-page-copy h1{
        font-size:25px !important;
    }

    .v4-hero-slogan{
        display:none;
    }

    .v4-hero-actions{
        width:100%;
    }

    .v4-kpi-grid,
    .v4-kpi-grid.five{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .v4-module-grid.four,
    .v4-b-workspace,
    .v4-bottom-grid,
    .v4-process-grid{
        grid-template-columns:1fr;
    }

    .v4-section-note{
        display:none;
    }

    .v4-search-shell{
        align-items:flex-start;
        flex-direction:column;
    }

    .v4-search-actions{
        margin-left:0;
    }

}



/* ==========================================================
   EXAM CENTER UI V4
   ========================================================== */

.exam-v4-global-nav{
    display:flex;
    align-items:center;
    gap:7px;
    margin-bottom:14px;
    padding:8px;
    overflow-x:auto;
    border:1px solid #dce8ee;
    border-radius:12px;
    background:#fff;
}

.exam-v4-global-nav a{
    min-height:38px;
    display:flex;
    align-items:center;
    gap:7px;
    padding:8px 13px;
    border-radius:8px;
    color:#586f80;
    text-decoration:none;
    white-space:nowrap;
    font-size:12px;
    font-weight:800;
}

.exam-v4-global-nav a:hover{
    background:#eef8f8;
    color:#14777c;
}

.exam-v4-global-nav a.active{
    background:
        linear-gradient(
            135deg,
            #dff6f5,
            #edf9fb
        );
    color:#08767b;
}

.exam-v4-global-nav span{
    font-size:15px;
}


/* hero */

.exam-v4-hero{
    display:flex;
    align-items:center;
    gap:20px;
    min-height:135px;
    padding:23px 27px;
    margin-bottom:13px;
    overflow:hidden;
    border:1px solid #dbe9ef;
    border-radius:17px;
    background:
        radial-gradient(
            circle at 80% 40%,
            rgba(184,229,233,.50),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3fbfd 60%,
            #edf9f7
        );
}

.exam-v4-hero-icon{
    width:70px;
    height:70px;
    flex:0 0 70px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#ddf4f4;
    color:#138489;
    font-size:29px;
}

.exam-v4-hero-copy{
    flex:1;
}

.exam-v4-hero-copy h1{
    margin:0;
    color:#173d62;
    font-size:31px !important;
}

.exam-v4-hero-copy p{
    max-width:760px;
    margin:7px 0 0;
    color:#718592;
    font-size:13px;
    line-height:1.65;
}

.exam-v4-hero-slogan{
    color:#5795ba;
    text-align:center;
    transform:rotate(-4deg);
}

.exam-v4-hero-slogan span{
    display:block;
    font-size:13px;
    letter-spacing:2px;
}

.exam-v4-hero-slogan strong{
    display:block;
    margin-top:5px;
    font-size:16px;
    letter-spacing:2px;
}


/* category tabs */

.exam-v4-tabs{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:10px;
    margin-bottom:13px;
}

.exam-v4-tab{
    display:flex;
    align-items:center;
    gap:13px;
    min-height:82px;
    padding:14px 16px;
    border:1px solid #dce8ee;
    border-radius:13px;
    color:inherit;
    text-decoration:none;
    background:#fff;
    transition:.16s ease;
}

.exam-v4-tab:hover{
    transform:translateY(-2px);
    box-shadow:0 6px 18px rgba(44,78,101,.07);
}

.exam-v4-tab.general{
    background:linear-gradient(135deg,#fff,#eaf9f7);
}

.exam-v4-tab.other{
    background:linear-gradient(135deg,#fff,#eef6fc);
}

.exam-v4-tab.special{
    background:linear-gradient(135deg,#fff,#f3efff);
}

.exam-v4-tab-icon{
    width:43px;
    height:43px;
    flex:0 0 43px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#fff;
    color:#16858c;
    font-size:20px;
}

.exam-v4-tab strong{
    display:block;
    color:#28485f;
    font-size:15px;
}

.exam-v4-tab span{
    display:block;
    margin-top:3px;
    color:#7c8d98;
    font-size:10px;
}

.exam-v4-tab > b{
    margin-left:auto;
    color:#173c5c;
    font-size:25px;
}


/* main center */

.exam-v4-section{
    padding:18px;
    margin-bottom:13px;
    border:1px solid #dce8ed;
    border-radius:14px;
    background:#fff;
}

.exam-v4-section-title{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:14px;
}

.exam-v4-title-icon{
    width:39px;
    height:39px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    background:#e4f6f6;
    color:#13858a;
    font-size:18px;
}

.exam-v4-section-title h2{
    margin:0;
    font-size:19px !important;
}

.exam-v4-section-title p{
    margin:3px 0 0;
    color:#82919b;
    font-size:11px;
}

.exam-v4-main-grid{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:11px;
}

.exam-v4-card{
    display:block;
    min-height:175px;
    padding:16px;
    border:1px solid #dfe9ee;
    border-radius:13px;
    color:inherit;
    text-decoration:none;
    background:#fff;
}

.exam-v4-card.general{
    background:linear-gradient(135deg,#fff,#f0fbf8);
}

.exam-v4-card.other{
    background:linear-gradient(135deg,#fff,#f3f8fc);
}

.exam-v4-card.special{
    background:linear-gradient(135deg,#fff,#f7f4ff);
}

.exam-v4-card:hover{
    border-color:#add6d8;
    box-shadow:0 6px 19px rgba(44,78,101,.07);
}

.exam-v4-card-top{
    display:flex;
    align-items:center;
    gap:11px;
}

.exam-v4-round-icon{
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#fff;
    color:#16848a;
    font-size:21px;
}

.exam-v4-code{
    color:#77909c;
    font-size:9px;
    font-weight:900;
    letter-spacing:1px;
}

.exam-v4-card h3{
    margin:2px 0 0;
    color:#21445f;
    font-size:17px;
}

.exam-v4-card > p{
    min-height:48px;
    margin:14px 0;
    color:#748793;
    font-size:11px;
    line-height:1.6;
}

.exam-v4-card-bottom{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.exam-v4-card-bottom strong{
    color:#527083;
    font-size:11px;
}

.exam-v4-card-bottom span{
    color:#137a7f;
    font-size:11px;
    font-weight:900;
}


/* guidance */

.exam-v4-guidance{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:14px 16px;
    margin-bottom:13px;
    border:1px solid #dbe8e8;
    border-radius:11px;
    background:#f1f8f7;
}

.exam-v4-guidance-icon{
    width:30px;
    height:30px;
    flex:0 0 30px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#15888a;
    color:#fff;
    font-weight:900;
}

.exam-v4-guidance strong{
    color:#355765;
    font-size:12px;
}

.exam-v4-guidance p{
    margin:4px 0 0;
    color:#6f8189;
    font-size:11px;
    line-height:1.65;
}


/* quick */

.exam-v4-quick{
    display:flex;
    align-items:center;
    gap:18px;
    padding:15px 17px;
    border:1px solid #dce7ed;
    border-radius:12px;
    background:#fff;
}

.exam-v4-quick h2{
    margin:0;
    font-size:16px !important;
}

.exam-v4-quick p{
    margin:3px 0 0;
    color:#87959e;
    font-size:9px;
}

.exam-v4-quick-actions{
    display:flex;
    gap:7px;
    flex-wrap:wrap;
    margin-left:auto;
}

.exam-v4-quick-actions a{
    padding:8px 10px;
    border:1px solid #cae2e3;
    border-radius:8px;
    background:#f3fafa;
    color:#14757a;
    text-decoration:none;
    font-size:10px;
    font-weight:800;
}


/* ==========================================================
   Existing exam page polish
   Applies to existing pages without changing their logic.
   ========================================================== */

.sh-main form{
    max-width:100%;
}

.sh-main form.row,
.sh-main .row{
    gap:9px;
}

.sh-main table{
    border:1px solid #dce7ed;
    border-radius:11px;
    overflow:hidden;
}

.sh-main table th{
    padding:11px 10px;
    background:
        linear-gradient(
            180deg,
            #edf6f8,
            #e8f2f5
        );
    color:#36566c;
    font-size:12px;
    font-weight:800;
}

.sh-main table td{
    padding:10px;
    border-bottom:1px solid #e7eef1;
    color:#445c6d;
    font-size:12px;
}

.sh-main table tbody tr:hover td{
    background:#f8fbfc;
}

.sh-main input,
.sh-main select,
.sh-main textarea{
    min-height:40px;
    border:1px solid #cadbe4;
    border-radius:9px;
    background:#fff;
}

.sh-main button,
.sh-main .btn{
    min-height:39px;
    padding-left:13px;
    padding-right:13px;
    border-radius:9px;
}


/* mobile */

@media(max-width:900px){

    .exam-v4-tabs,
    .exam-v4-main-grid{
        grid-template-columns:1fr;
    }

    .exam-v4-hero-slogan{
        display:none;
    }

}

@media(max-width:700px){

    .exam-v4-hero{
        align-items:flex-start;
        padding:18px;
    }

    .exam-v4-hero-icon{
        width:54px;
        height:54px;
        flex-basis:54px;
        font-size:22px;
    }

    .exam-v4-hero-copy h1{
        font-size:25px !important;
    }

    .exam-v4-global-nav{
        padding:6px;
    }

    .exam-v4-quick{
        flex-direction:column;
        align-items:flex-start;
    }

    .exam-v4-quick-actions{
        margin-left:0;
    }

}



/* ==========================================================
   OCCUPATIONAL HEALTH UI V4
   ========================================================== */

.occ-v4-global-nav{
    display:flex;
    gap:6px;
    margin-bottom:14px;
    padding:7px;
    overflow-x:auto;
    border:1px solid #dce8ee;
    border-radius:12px;
    background:#fff;
}

.occ-v4-global-nav a{
    min-height:38px;
    display:flex;
    align-items:center;
    padding:8px 12px;
    border-radius:8px;
    color:#5c7282;
    text-decoration:none;
    white-space:nowrap;
    font-size:12px;
    font-weight:800;
}

.occ-v4-global-nav a:hover{
    background:#edf8f8;
    color:#13767b;
}

.occ-v4-global-nav a.active{
    background:
        linear-gradient(
            135deg,
            #daf5f4,
            #edf8fb
        );
    color:#08767d;
}


/* Hero */

.occ-v4-hero{
    display:flex;
    align-items:center;
    gap:20px;
    min-height:145px;
    margin-bottom:14px;
    padding:24px 28px;
    overflow:hidden;
    border:1px solid #dbe9ef;
    border-radius:17px;
    background:
        radial-gradient(
            circle at 80% 40%,
            rgba(181,229,231,.48),
            transparent 29%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3fbfd 58%,
            #edf9f7
        );
}

.occ-v4-hero-icon{
    width:72px;
    height:72px;
    flex:0 0 72px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#ddf4f4;
    color:#12848a;
    font-size:30px;
}

.occ-v4-hero-copy{
    flex:1;
}

.occ-v4-hero-copy h1{
    margin:0;
    color:#173d61;
    font-size:31px !important;
}

.occ-v4-hero-copy p{
    max-width:790px;
    margin:7px 0 0;
    color:#728592;
    font-size:13px;
    line-height:1.65;
}

.occ-v4-slogan{
    margin-right:25px;
    color:#5798bb;
    text-align:center;
    transform:rotate(-4deg);
}

.occ-v4-slogan span{
    display:block;
    font-size:13px;
    letter-spacing:2px;
}

.occ-v4-slogan strong{
    display:block;
    margin-top:5px;
    font-size:16px;
    letter-spacing:2px;
}


/* Intro */

.occ-v4-intro{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    margin-bottom:11px;
}

.occ-v4-intro h2{
    margin:0;
    color:#254761;
    font-size:21px !important;
}

.occ-v4-intro p{
    margin:4px 0 0;
    color:#82919c;
    font-size:11px;
}


/* Cards */

.occ-v4-grid{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:11px;
    margin-bottom:15px;
}

.occ-v4-card{
    position:relative;
    min-height:155px;
    display:flex;
    align-items:flex-start;
    gap:13px;
    padding:17px;
    border:1px solid #dee8ed;
    border-radius:14px;
    color:inherit;
    text-decoration:none;
    background:#fff;
    transition:.16s ease;
}

.occ-v4-card:hover{
    transform:translateY(-2px);
    border-color:#add5d7;
    box-shadow:0 7px 20px rgba(44,78,101,.07);
}

.occ-v4-card.orange{
    background:linear-gradient(135deg,#fff,#fff8ef);
}

.occ-v4-card.purple{
    background:linear-gradient(135deg,#fff,#f7f3ff);
}

.occ-v4-card.pink{
    background:linear-gradient(135deg,#fff,#fff4f8);
}

.occ-v4-card.blue{
    background:linear-gradient(135deg,#fff,#f0f7ff);
}

.occ-v4-card.rose{
    background:linear-gradient(135deg,#fff,#fcf3fa);
}

.occ-v4-card.green{
    background:linear-gradient(135deg,#fff,#effaf6);
}

.occ-v4-card-icon{
    width:50px;
    height:50px;
    flex:0 0 50px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(255,255,255,.85);
    color:#16858b;
    font-size:22px;
}

.occ-v4-number{
    color:#8a99a3;
    font-size:9px;
    font-weight:900;
    letter-spacing:1px;
}

.occ-v4-card h3{
    margin:3px 0 0;
    color:#23445e;
    font-size:17px;
}

.occ-v4-card p{
    margin:7px 0 0;
    color:#788a96;
    font-size:11px;
    line-height:1.6;
}

.occ-v4-card > b{
    position:absolute;
    right:14px;
    bottom:13px;
    color:#137c81;
    font-size:11px;
}


/* management */

.occ-v4-management{
    padding:17px;
    margin-bottom:13px;
    border:1px solid #dce8ed;
    border-radius:14px;
    background:#fff;
}

.occ-v4-management-title{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:13px;
}

.occ-v4-small-icon{
    width:39px;
    height:39px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    background:#e2f5f5;
    color:#14858a;
    font-weight:900;
}

.occ-v4-management-title h2{
    margin:0;
    font-size:18px !important;
}

.occ-v4-management-title p{
    margin:3px 0 0;
    color:#83919b;
    font-size:10px;
}

.occ-v4-management-grid{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:8px;
}

.occ-v4-management-grid a{
    position:relative;
    display:block;
    min-height:85px;
    padding:13px;
    border:1px solid #e0e9ee;
    border-radius:10px;
    color:inherit;
    text-decoration:none;
    background:#f9fbfc;
}

.occ-v4-management-grid a:hover{
    background:#f0f9f9;
}

.occ-v4-management-grid strong{
    display:block;
    color:#315066;
    font-size:13px;
}

.occ-v4-management-grid span{
    display:block;
    margin-top:5px;
    color:#84929c;
    font-size:10px;
}

.occ-v4-management-grid b{
    position:absolute;
    right:11px;
    bottom:9px;
    color:#178188;
}


/* note */

.occ-v4-note{
    display:flex;
    align-items:flex-start;
    gap:10px;
    padding:13px 15px;
    border:1px solid #d8e7e8;
    border-radius:10px;
    background:#f1f8f7;
}

.occ-v4-note > div{
    width:26px;
    height:26px;
    flex:0 0 26px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#16888b;
    color:#fff;
    font-size:11px;
    font-weight:900;
}

.occ-v4-note p{
    margin:2px 0 0;
    color:#667982;
    font-size:11px;
    line-height:1.6;
}


/* ==========================================================
   Existing occupational assessment page polish
   ========================================================== */

.occ-v4-page h1{
    color:#173e60;
}

.occ-v4-page h2{
    color:#294b63;
}

.occ-v4-page .card{
    border:1px solid #dce7ed !important;
    border-radius:13px !important;
    background:#fff !important;
    box-shadow:
        0 4px 15px rgba(44,78,101,.04) !important;
}

.occ-v4-page form{
    max-width:100%;
}

.occ-v4-page input,
.occ-v4-page select,
.occ-v4-page textarea{
    min-height:41px;
    border:1px solid #cadbe4 !important;
    border-radius:9px !important;
    background:#fff;
}

.occ-v4-page textarea{
    padding:10px;
}

.occ-v4-page button,
.occ-v4-page .btn{
    min-height:40px;
    padding-left:14px;
    padding-right:14px;
    border-radius:9px !important;
}

.occ-v4-page table{
    width:100%;
    overflow:hidden;
    border:1px solid #dce7ed;
    border-radius:11px;
    border-collapse:separate;
    border-spacing:0;
}

.occ-v4-page table th{
    padding:11px 10px;
    background:
        linear-gradient(
            180deg,
            #edf6f8,
            #e8f2f5
        ) !important;
    color:#36566b;
    font-size:12px;
    font-weight:800;
}

.occ-v4-page table td{
    padding:10px;
    border-bottom:1px solid #e7eef1;
    color:#455e6e;
    font-size:12px;
    line-height:1.5;
}

.occ-v4-page table tbody tr:hover td{
    background:#f8fbfc;
}

.occ-v4-page .notice{
    border-radius:10px;
}

.occ-v4-page .grid{
    gap:11px;
}

.occ-v4-page .kpi{
    border-radius:12px;
}


/* Give legacy assessment links/card-like areas a cleaner feel */

.occ-v4-page a{
    text-underline-offset:2px;
}

.occ-v4-page td a{
    font-weight:800;
    color:#137b80;
}


/* responsive */

@media(max-width:1050px){

    .occ-v4-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}

@media(max-width:760px){

    .occ-v4-hero{
        padding:18px;
    }

    .occ-v4-hero-icon{
        width:55px;
        height:55px;
        flex-basis:55px;
        font-size:23px;
    }

    .occ-v4-hero-copy h1{
        font-size:25px !important;
    }

    .occ-v4-slogan{
        display:none;
    }

    .occ-v4-grid,
    .occ-v4-management-grid{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   CONSULTATION TRACKING UI V4
   ========================================================== */

.consult-v4-global-nav{
    display:flex;
    align-items:center;
    gap:7px;
    margin-bottom:14px;
    padding:8px;
    overflow-x:auto;
    border:1px solid #dce8ee;
    border-radius:12px;
    background:#fff;
}

.consult-v4-global-nav a{
    min-height:40px;
    display:flex;
    align-items:center;
    gap:8px;
    padding:8px 14px;
    border-radius:8px;
    color:#587181;
    text-decoration:none;
    white-space:nowrap;
    font-size:13px;
    font-weight:800;
}

.consult-v4-global-nav a:hover{
    background:#eef8f8;
    color:#13777c;
}

.consult-v4-global-nav a.active{
    background:linear-gradient(
        135deg,
        #dff5f4,
        #edf9fb
    );
    color:#08777c;
}

.consult-v4-global-nav a span{
    font-size:16px;
}


/* Hero */

.consult-v4-hero{
    display:flex;
    align-items:center;
    gap:20px;
    min-height:150px;
    padding:25px 29px;
    margin-bottom:14px;
    overflow:hidden;
    border:1px solid #dbe9ef;
    border-radius:17px;
    background:
        radial-gradient(
            circle at 82% 38%,
            rgba(184,229,231,.50),
            transparent 29%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f4fbfd 58%,
            #eff9f6
        );
}

.consult-v4-hero-icon{
    width:72px;
    height:72px;
    flex:0 0 72px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#ddf5f2;
    color:#148b83;
    font-size:28px;
}

.consult-v4-hero-copy{
    flex:1;
}

.consult-v4-hero-copy h1{
    margin:0;
    color:#173e61;
    font-size:31px !important;
}

.consult-v4-hero-copy p{
    max-width:800px;
    margin:8px 0 0;
    color:#718592;
    font-size:14px;
    line-height:1.65;
}

.consult-v4-slogan{
    margin-right:25px;
    color:#5597b6;
    text-align:center;
    transform:rotate(-4deg);
}

.consult-v4-slogan span{
    display:block;
    font-size:14px;
    letter-spacing:2px;
}

.consult-v4-slogan strong{
    display:block;
    margin-top:5px;
    font-size:16px;
    letter-spacing:2px;
}


/* KPI */

.consult-v4-kpis{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:11px;
    margin-bottom:14px;
}

.consult-v4-kpi{
    display:flex;
    align-items:center;
    gap:13px;
    min-height:96px;
    padding:15px 17px;
    border:1px solid #dfe9ee;
    border-radius:14px;
    color:inherit;
    text-decoration:none;
    transition:.16s ease;
}

.consult-v4-kpi:hover{
    transform:translateY(-2px);
    box-shadow:
        0 7px 20px
        rgba(44,78,101,.07);
}

.consult-v4-kpi.blue{
    background:
        linear-gradient(
            135deg,
            #fff,
            #eef7ff
        );
}

.consult-v4-kpi.green{
    background:
        linear-gradient(
            135deg,
            #fff,
            #eefaf6
        );
}

.consult-v4-kpi.orange{
    background:
        linear-gradient(
            135deg,
            #fff,
            #fff5ed
        );
}

.consult-v4-kpi.purple{
    background:
        linear-gradient(
            135deg,
            #fff,
            #f5f1ff
        );
}

.consult-v4-kpi-icon{
    width:48px;
    height:48px;
    flex:0 0 48px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(255,255,255,.9);
    color:#17858d;
    font-size:20px;
}

.consult-v4-kpi span{
    display:block;
    color:#627786;
    font-size:13px;
    font-weight:800;
}

.consult-v4-kpi strong{
    display:block;
    margin-top:4px;
    color:#183b56;
    font-size:30px;
    line-height:1;
}

.consult-v4-kpi > b{
    margin-left:auto;
    color:#377f9b;
    font-size:22px;
}


/* Flow */

.consult-v4-section{
    padding:19px;
    margin-bottom:14px;
    border:1px solid #dce8ed;
    border-radius:14px;
    background:#fff;
    box-shadow:
        0 4px 15px
        rgba(44,78,101,.035);
}

.consult-v4-section-head{
    margin-bottom:14px;
}

.consult-v4-section-head h2{
    margin:0;
    color:#254861;
    font-size:20px !important;
}

.consult-v4-section-head p{
    margin:5px 0 0;
    color:#81909b;
    font-size:12px;
}

.consult-v4-flow{
    display:grid;
    grid-template-columns:
        1fr auto 1fr auto 1fr;
    align-items:stretch;
    gap:9px;
}

.consult-v4-flow-card{
    position:relative;
    min-height:155px;
    padding:16px;
    border:1px solid #dee8ed;
    border-radius:12px;
    background:#fbfdfd;
    color:inherit;
    text-decoration:none;
    transition:.15s ease;
}

.consult-v4-flow-card:hover{
    transform:translateY(-1px);
    border-color:#afd7d7;
    background:#f5fbfb;
}

.consult-v4-step{
    position:absolute;
    top:12px;
    right:12px;
    color:#8c9ba4;
    font-size:10px;
    font-weight:900;
    letter-spacing:1px;
}

.consult-v4-flow-icon{
    width:45px;
    height:45px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#e1f5f3;
    color:#148b83;
    font-size:19px;
}

.consult-v4-flow-card h3{
    margin:11px 0 0;
    color:#284961;
    font-size:16px;
}

.consult-v4-flow-card p{
    margin:6px 0 0;
    padding-right:15px;
    color:#798a95;
    font-size:12px;
    line-height:1.6;
}

.consult-v4-flow-card > span{
    position:absolute;
    right:13px;
    bottom:11px;
    color:#147c81;
    font-size:12px;
    font-weight:900;
}

.consult-v4-arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#8bd0d1;
    font-size:28px;
}


/* Tools */

.consult-v4-tools{
    padding:18px;
    margin-bottom:13px;
    border:1px solid #dce8ed;
    border-radius:14px;
    background:#fff;
}

.consult-v4-tools-title{
    display:flex;
    align-items:center;
    gap:11px;
    margin-bottom:14px;
}

.consult-v4-tools-title > div{
    width:41px;
    height:41px;
    flex:0 0 41px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    background:#e2f6f4;
    color:#148785;
    font-size:18px;
}

.consult-v4-tools-title h2{
    margin:0;
    font-size:18px !important;
}

.consult-v4-tools-title p{
    margin:4px 0 0;
    color:#83919b;
    font-size:11px;
}

.consult-v4-tool-grid{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:9px;
}

.consult-v4-tool-grid a{
    position:relative;
    min-height:92px;
    display:block;
    padding:14px;
    border:1px solid #e0e9ee;
    border-radius:11px;
    color:inherit;
    text-decoration:none;
    background:#f9fbfc;
}

.consult-v4-tool-grid a:hover{
    background:#f0f9f8;
}

.consult-v4-tool-grid strong{
    display:block;
    color:#315066;
    font-size:14px;
}

.consult-v4-tool-grid span{
    display:block;
    margin-top:6px;
    padding-right:14px;
    color:#84929c;
    font-size:11px;
    line-height:1.5;
}

.consult-v4-tool-grid b{
    position:absolute;
    right:11px;
    bottom:9px;
    color:#178087;
}


/* Note */

.consult-v4-note{
    display:flex;
    align-items:flex-start;
    gap:10px;
    padding:13px 15px;
    border:1px solid #d9e7e8;
    border-radius:10px;
    background:#f1f8f7;
}

.consult-v4-note > div{
    width:27px;
    height:27px;
    flex:0 0 27px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#16888a;
    color:#fff;
    font-size:11px;
    font-weight:900;
}

.consult-v4-note p{
    margin:2px 0 0;
    color:#667982;
    font-size:11px;
    line-height:1.6;
}


/* ==========================================================
   Existing consultation pages
   ========================================================== */

.consult-v4-page h1{
    color:#173e60;
}

.consult-v4-page h2{
    color:#294c63;
}

.consult-v4-page .card{
    border:1px solid #dce7ed !important;
    border-radius:13px !important;
    background:#fff !important;
    box-shadow:
        0 4px 15px
        rgba(44,78,101,.04) !important;
}

.consult-v4-page input,
.consult-v4-page select,
.consult-v4-page textarea{
    min-height:42px;
    border:1px solid #cadbe4 !important;
    border-radius:9px !important;
    background:#fff;
    font-size:13px;
}

.consult-v4-page textarea{
    padding:10px;
    line-height:1.55;
}

.consult-v4-page button,
.consult-v4-page .btn{
    min-height:40px;
    padding-left:14px;
    padding-right:14px;
    border-radius:9px !important;
    font-size:13px;
}

.consult-v4-page table{
    width:100%;
    overflow:hidden;
    border:1px solid #dce7ed;
    border-radius:11px;
    border-collapse:separate;
    border-spacing:0;
}

.consult-v4-page table th{
    padding:12px 10px;
    background:
        linear-gradient(
            180deg,
            #edf6f8,
            #e8f2f5
        ) !important;
    color:#36566b;
    font-size:12px;
    font-weight:800;
}

.consult-v4-page table td{
    padding:11px 10px;
    border-bottom:
        1px solid #e7eef1;
    color:#455e6e;
    font-size:12px;
    line-height:1.5;
}

.consult-v4-page table tbody tr:hover td{
    background:#f8fbfc;
}

.consult-v4-page td a{
    color:#137b80;
    font-weight:800;
}

.consult-v4-page .notice{
    border-radius:10px;
}

.consult-v4-page .row{
    gap:9px;
}


/* Responsive */

@media(max-width:1000px){

    .consult-v4-kpis{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .consult-v4-tool-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}

@media(max-width:760px){

    .consult-v4-hero{
        padding:18px;
    }

    .consult-v4-hero-icon{
        width:55px;
        height:55px;
        flex-basis:55px;
        font-size:22px;
    }

    .consult-v4-hero-copy h1{
        font-size:25px !important;
    }

    .consult-v4-slogan{
        display:none;
    }

    .consult-v4-kpis{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .consult-v4-flow{
        grid-template-columns:1fr;
    }

    .consult-v4-arrow{
        display:none;
    }

    .consult-v4-tool-grid{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   STAR HEALTH DESKTOP FONT BOOST V3.2
   Large-screen readability
   ========================================================== */

@media(min-width:1200px){

    /* Header */

    .sh-company-name strong{
        font-size:17px;
    }

    .sh-company-name span{
        font-size:11px;
    }

    .sh-system-name strong{
        font-size:27px;
    }

    .sh-system-name span{
        font-size:12px;
    }

    .sh-user-text span{
        font-size:11px;
    }

    .sh-user-text strong{
        font-size:15px;
    }

    .sh-logout{
        font-size:14px !important;
    }


    /* 左側選單 */

    .sh-nav-title{
        font-size:15px;
    }

    .sh-nav a{
        min-height:47px;
        font-size:15px;
        line-height:1.4;
    }

    .sh-nav a > span{
        font-size:17px;
    }

    .sh-sidebar-message{
        font-size:13px;
    }


    /* 廠商 Context */

    .sh-context > div:first-child span{
        font-size:11px;
    }

    .sh-context > div:first-child strong{
        font-size:15px;
    }

    .sh-context-links a{
        font-size:13px;
    }


    /* B 區上方導覽 */

    .occ-v4-global-nav a{
        min-height:44px;
        padding:9px 15px;
        font-size:14px;
    }


    /* B 首頁 Hero */

    .occ-v4-hero-copy h1{
        font-size:36px !important;
    }

    .occ-v4-hero-copy p{
        font-size:15px;
        line-height:1.7;
    }

    .occ-v4-slogan span{
        font-size:15px;
    }

    .occ-v4-slogan strong{
        font-size:18px;
    }


    /* 評估工具標題 */

    .occ-v4-intro h2{
        font-size:24px !important;
    }

    .occ-v4-intro p{
        font-size:13px;
    }


    /* 評估工具卡 */

    .occ-v4-card{
        min-height:175px;
        padding:20px;
    }

    .occ-v4-card-icon{
        width:55px;
        height:55px;
        flex-basis:55px;
        font-size:25px;
    }

    .occ-v4-number{
        font-size:11px;
    }

    .occ-v4-card h3{
        font-size:19px;
    }

    .occ-v4-card p{
        margin-top:9px;
        font-size:13px;
        line-height:1.65;
    }

    .occ-v4-card > b{
        font-size:13px;
    }


    /* 評估管理工具 */

    .occ-v4-management-title h2{
        font-size:21px !important;
    }

    .occ-v4-management-title p{
        font-size:12px;
    }

    .occ-v4-management-grid strong{
        font-size:15px;
    }

    .occ-v4-management-grid span{
        font-size:12px;
        line-height:1.55;
    }

    .occ-v4-management-grid a{
        min-height:100px;
        padding:16px;
    }


    /* 底部說明 */

    .occ-v4-note p{
        font-size:13px;
        line-height:1.65;
    }


    /* A / C / D 首頁也同步 */

    .v4-page-copy h1,
    .consult-v4-hero-copy h1{
        font-size:35px !important;
    }

    .v4-page-copy p,
    .consult-v4-hero-copy p{
        font-size:15px;
    }

    .v4-section-header h2,
    .consult-v4-section-head h2{
        font-size:23px !important;
    }

    .v4-section-header p,
    .consult-v4-section-head p{
        font-size:13px;
    }


    /* 一般舊頁 */

    .sh-main{
        font-size:15px;
    }

    .sh-main h1{
        font-size:32px;
    }

    .sh-main h2{
        font-size:23px;
    }

    .sh-main h3{
        font-size:18px;
    }

    .sh-main table th{
        font-size:14px;
    }

    .sh-main table td{
        font-size:14px;
    }

    .sh-main input,
    .sh-main select,
    .sh-main textarea,
    .sh-main button,
    .sh-main .btn{
        font-size:14px;
    }


    /* B/C 區舊資料頁 */

    .occ-v4-page table th,
    .consult-v4-page table th{
        font-size:14px;
    }

    .occ-v4-page table td,
    .consult-v4-page table td{
        font-size:14px;
    }

    .occ-v4-page input,
    .occ-v4-page select,
    .occ-v4-page textarea,
    .consult-v4-page input,
    .consult-v4-page select,
    .consult-v4-page textarea{
        font-size:14px;
    }

}



/* ==========================================================
   RETURN WORK TRACKING UI V4
   ========================================================== */

.return-v4-hero{
    display:flex;
    align-items:center;
    gap:22px;
    min-height:155px;
    margin-bottom:14px;
    padding:25px 29px;
    overflow:hidden;
    border:1px solid #dbe9ef;
    border-radius:17px;
    background:
        radial-gradient(
            circle at 82% 38%,
            rgba(180,230,227,.50),
            transparent 29%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3fbfd 58%,
            #eef9f5
        );
}

.return-v4-hero-icon{
    width:74px;
    height:74px;
    flex:0 0 74px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#dcf5ef;
    color:#168a79;
    font-size:31px;
    font-weight:900;
}

.return-v4-hero-copy{
    flex:1;
}

.return-v4-hero-copy h1{
    margin:0;
    color:#173e61;
    font-size:35px !important;
}

.return-v4-hero-copy p{
    max-width:820px;
    margin:8px 0 0;
    color:#718592;
    font-size:15px;
    line-height:1.7;
}

.return-v4-slogan{
    margin-right:24px;
    color:#5897b5;
    text-align:center;
    transform:rotate(-4deg);
}

.return-v4-slogan span{
    display:block;
    font-size:15px;
    letter-spacing:2px;
}

.return-v4-slogan strong{
    display:block;
    margin-top:5px;
    font-size:18px;
    letter-spacing:2px;
}


/* Top actions */

.return-v4-action-grid{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:11px;
    margin-bottom:14px;
}

.return-v4-action{
    min-height:112px;
    display:flex;
    align-items:center;
    gap:13px;
    padding:16px 17px;
    border:1px solid #dfe9ee;
    border-radius:14px;
    color:inherit;
    text-decoration:none;
    transition:.16s ease;
}

.return-v4-action:hover{
    transform:translateY(-2px);
    box-shadow:
        0 7px 20px
        rgba(44,78,101,.07);
}

.return-v4-action.blue{
    background:
        linear-gradient(
            135deg,
            #fff,
            #eef7ff
        );
}

.return-v4-action.green{
    background:
        linear-gradient(
            135deg,
            #fff,
            #eefaf6
        );
}

.return-v4-action.orange{
    background:
        linear-gradient(
            135deg,
            #fff,
            #fff5ed
        );
}

.return-v4-action.purple{
    background:
        linear-gradient(
            135deg,
            #fff,
            #f5f1ff
        );
}

.return-v4-action-icon{
    width:50px;
    height:50px;
    flex:0 0 50px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(255,255,255,.9);
    color:#17858d;
    font-size:21px;
}

.return-v4-action span{
    display:block;
    color:#6a7e8c;
    font-size:12px;
    font-weight:800;
}

.return-v4-action strong{
    display:block;
    margin-top:3px;
    color:#25475f;
    font-size:16px;
}

.return-v4-action small{
    display:block;
    margin-top:5px;
    color:#81919c;
    font-size:11px;
    line-height:1.45;
}

.return-v4-action > b{
    margin-left:auto;
    color:#31829d;
    font-size:22px;
}


/* Workflow */

.return-v4-section{
    padding:19px;
    margin-bottom:14px;
    border:1px solid #dce8ed;
    border-radius:14px;
    background:#fff;
    box-shadow:
        0 4px 15px
        rgba(44,78,101,.035);
}

.return-v4-section-head{
    display:flex;
    align-items:center;
    gap:11px;
    margin-bottom:15px;
}

.return-v4-title-icon{
    width:42px;
    height:42px;
    flex:0 0 42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    background:#e1f6f1;
    color:#168879;
    font-size:20px;
}

.return-v4-section-head h2{
    margin:0;
    color:#254861;
    font-size:22px !important;
}

.return-v4-section-head p{
    margin:4px 0 0;
    color:#81909b;
    font-size:12px;
}

.return-v4-flow{
    display:grid;
    grid-template-columns:
        1fr auto 1fr auto 1fr auto 1fr;
    gap:8px;
    align-items:stretch;
}

.return-v4-flow-card{
    position:relative;
    min-height:175px;
    padding:16px;
    border:1px solid #dee8ed;
    border-radius:12px;
    background:#fbfdfd;
    color:inherit;
    text-decoration:none;
    transition:.15s ease;
}

.return-v4-flow-card:hover{
    transform:translateY(-1px);
    border-color:#abd7cf;
    background:#f4fbf9;
}

.return-v4-step{
    position:absolute;
    top:12px;
    right:12px;
    color:#8b9aa3;
    font-size:10px;
    font-weight:900;
    letter-spacing:1px;
}

.return-v4-flow-icon{
    width:46px;
    height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#e1f5ef;
    color:#16887b;
    font-size:19px;
}

.return-v4-flow-card h3{
    margin:12px 0 0;
    color:#284961;
    font-size:16px;
}

.return-v4-flow-card p{
    margin:7px 0 0;
    padding-right:10px;
    color:#798a95;
    font-size:12px;
    line-height:1.6;
}

.return-v4-flow-card > span{
    position:absolute;
    right:13px;
    bottom:11px;
    color:#147c76;
    font-size:12px;
    font-weight:900;
}

.return-v4-arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#8bd0c5;
    font-size:28px;
}


/* Quick workspace */

.return-v4-workspace{
    padding:18px;
    margin-bottom:13px;
    border:1px solid #dce8ed;
    border-radius:14px;
    background:#fff;
}

.return-v4-workspace-head{
    margin-bottom:13px;
}

.return-v4-workspace-head h2{
    margin:0;
    color:#294a62;
    font-size:20px !important;
}

.return-v4-workspace-head p{
    margin:4px 0 0;
    color:#82919b;
    font-size:11px;
}

.return-v4-tools{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:9px;
}

.return-v4-tools a{
    position:relative;
    min-height:100px;
    display:flex;
    align-items:center;
    gap:11px;
    padding:14px;
    border:1px solid #e0e9ee;
    border-radius:11px;
    color:inherit;
    text-decoration:none;
    background:#f9fbfc;
}

.return-v4-tools a:hover{
    background:#f0f9f7;
}

.return-v4-tool-icon{
    width:40px;
    height:40px;
    flex:0 0 40px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#e1f5ef;
    color:#16877a;
    font-size:17px;
}

.return-v4-tools strong{
    display:block;
    color:#315066;
    font-size:14px;
}

.return-v4-tools span{
    display:block;
    margin-top:5px;
    padding-right:10px;
    color:#84929c;
    font-size:11px;
    line-height:1.5;
}

.return-v4-tools b{
    position:absolute;
    right:11px;
    bottom:9px;
    color:#178078;
}


/* Principle */

.return-v4-principle{
    display:flex;
    align-items:flex-start;
    gap:11px;
    padding:14px 16px;
    border:1px solid #d8e7e3;
    border-radius:11px;
    background:#f0f8f5;
}

.return-v4-principle-icon{
    width:28px;
    height:28px;
    flex:0 0 28px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#16877b;
    color:#fff;
    font-size:12px;
    font-weight:900;
}

.return-v4-principle strong{
    color:#365a60;
    font-size:13px;
}

.return-v4-principle p{
    margin:4px 0 0;
    color:#687d82;
    font-size:12px;
    line-height:1.65;
}


/* Responsive */

@media(max-width:1100px){

    .return-v4-action-grid,
    .return-v4-tools{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .return-v4-flow{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .return-v4-arrow{
        display:none;
    }

}

@media(max-width:760px){

    .return-v4-hero{
        padding:18px;
    }

    .return-v4-hero-icon{
        width:55px;
        height:55px;
        flex-basis:55px;
        font-size:23px;
    }

    .return-v4-hero-copy h1{
        font-size:26px !important;
    }

    .return-v4-hero-copy p{
        font-size:13px;
    }

    .return-v4-slogan{
        display:none;
    }

    .return-v4-action-grid,
    .return-v4-tools,
    .return-v4-flow{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   VENDOR MANAGEMENT LIST UI V4
   ========================================================== */

.vendor-v4-hero{
    display:flex;
    align-items:center;
    gap:21px;
    min-height:150px;
    margin-bottom:14px;
    padding:25px 29px;
    overflow:hidden;
    border:1px solid #dbe9ef;
    border-radius:17px;
    background:
        radial-gradient(
            circle at 78% 40%,
            rgba(181,230,231,.48),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3fbfd 58%,
            #edf9f7
        );
}

.vendor-v4-hero-icon{
    width:74px;
    height:74px;
    flex:0 0 74px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#dff5f5;
    color:#12858b;
    font-size:31px;
}

.vendor-v4-hero-copy{
    flex:1;
}

.vendor-v4-hero-copy h1{
    margin:0;
    color:#173e61;
    font-size:35px !important;
}

.vendor-v4-hero-copy p{
    max-width:760px;
    margin:8px 0 0;
    color:#718592;
    font-size:15px;
    line-height:1.65;
}

.vendor-v4-hero-actions{
    display:flex;
    gap:9px;
    flex-wrap:wrap;
    justify-content:flex-end;
}

.vendor-v4-btn{
    min-height:43px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 17px;
    border-radius:9px;
    text-decoration:none;
    font-size:13px;
    font-weight:900;
}

.vendor-v4-btn.primary{
    background:#14888a;
    color:#fff;
    box-shadow:
        0 5px 14px
        rgba(20,136,138,.15);
}

.vendor-v4-btn.secondary{
    border:1px solid #a8d1d4;
    background:#fff;
    color:#14777c;
}


/* Permission notice */

.vendor-v4-permission-notice{
    display:flex;
    align-items:center;
    gap:9px;
    margin-bottom:13px;
    padding:11px 14px;
    border:1px solid #cfe6e6;
    border-radius:10px;
    background:#eef8f7;
    color:#5a747d;
    font-size:13px;
}

.vendor-v4-permission-notice > div{
    width:25px;
    height:25px;
    flex:0 0 25px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#178b8b;
    color:#fff;
    font-size:11px;
    font-weight:900;
}


/* KPI */

.vendor-v4-kpis{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:11px;
    margin-bottom:14px;
}

.vendor-v4-kpi{
    min-height:98px;
    display:flex;
    align-items:center;
    gap:13px;
    padding:15px 17px;
    border:1px solid #dee9ee;
    border-radius:14px;
}

.vendor-v4-kpi.blue{
    background:
        linear-gradient(
            135deg,
            #fff,
            #eff7ff
        );
}

.vendor-v4-kpi.green{
    background:
        linear-gradient(
            135deg,
            #fff,
            #eefaf6
        );
}

.vendor-v4-kpi.purple{
    background:
        linear-gradient(
            135deg,
            #fff,
            #f5f1ff
        );
}

.vendor-v4-kpi.orange{
    background:
        linear-gradient(
            135deg,
            #fff,
            #fff5ed
        );
}

.vendor-v4-kpi-icon{
    width:49px;
    height:49px;
    flex:0 0 49px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(255,255,255,.9);
    color:#17858d;
    font-size:20px;
}

.vendor-v4-kpi span{
    display:block;
    color:#627786;
    font-size:13px;
    font-weight:800;
}

.vendor-v4-kpi strong{
    display:inline-block;
    margin-top:4px;
    color:#173b57;
    font-size:31px;
    line-height:1;
}

.vendor-v4-kpi small{
    margin-left:4px;
    color:#7a8d99;
    font-size:12px;
}


/* Main panel */

.vendor-v4-panel{
    padding:19px;
    border:1px solid #dce8ed;
    border-radius:15px;
    background:#fff;
    box-shadow:
        0 4px 16px
        rgba(44,78,101,.04);
}

.vendor-v4-panel-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    margin-bottom:14px;
}

.vendor-v4-panel-head h2{
    margin:0;
    color:#254861;
    font-size:21px !important;
}

.vendor-v4-panel-head p{
    margin:4px 0 0;
    color:#81919c;
    font-size:12px;
}

.vendor-v4-count{
    display:flex;
    align-items:baseline;
    gap:5px;
    color:#7a8c98;
    font-size:11px;
}

.vendor-v4-count strong{
    color:#178285;
    font-size:20px;
}


/* Toolbar */

.vendor-v4-toolbar{
    display:grid;
    grid-template-columns:
        minmax(280px,1fr)
        190px
        190px
        auto;
    gap:8px;
    margin-bottom:13px;
}

.vendor-v4-search{
    min-height:43px;
    display:flex;
    align-items:center;
    gap:8px;
    padding:0 12px;
    border:1px solid #cadde5;
    border-radius:9px;
    background:#fff;
}

.vendor-v4-search span{
    color:#2883a0;
    font-size:19px;
}

.vendor-v4-search input{
    width:100%;
    min-height:0 !important;
    padding:0 !important;
    border:0 !important;
    outline:0;
    background:transparent !important;
    box-shadow:none !important;
}

.vendor-v4-filter,
.vendor-v4-reset{
    min-height:43px !important;
    border-radius:9px !important;
}

.vendor-v4-reset{
    padding:0 15px !important;
    border:1px solid #bdd9dc !important;
    background:#f5fbfb !important;
    color:#14777b !important;
    box-shadow:none !important;
}


/* Table */

.vendor-v4-table-wrap{
    overflow-x:auto;
    border:1px solid #dce7ed;
    border-radius:11px;
}

.vendor-v4-table{
    width:100%;
    min-width:1080px;
    margin:0 !important;
    border:0 !important;
    border-radius:0 !important;
}

.vendor-v4-table thead th{
    padding:12px 11px !important;
    background:
        linear-gradient(
            180deg,
            #edf7f8,
            #e8f2f5
        ) !important;
    color:#36586e !important;
    font-size:13px !important;
    white-space:nowrap;
}

.vendor-v4-table td{
    padding:12px 11px !important;
    vertical-align:middle;
    border-bottom:
        1px solid #e7eef1 !important;
    font-size:13px !important;
}

.vendor-v4-table tbody tr:last-child td{
    border-bottom:0 !important;
}

.vendor-v4-table tbody tr:hover td{
    background:#f8fbfc;
}


/* Company */

.vendor-v4-company{
    min-width:220px;
    display:flex;
    align-items:center;
    gap:10px;
}

.vendor-v4-avatar{
    width:38px;
    height:38px;
    flex:0 0 38px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    background:
        linear-gradient(
            135deg,
            #dff4f4,
            #edf9fb
        );
    color:#168087;
    font-size:15px;
    font-weight:900;
}

.vendor-v4-company strong{
    display:block;
    color:#29495f;
    font-size:14px;
}

.vendor-v4-company span{
    display:block;
    max-width:270px;
    margin-top:3px;
    overflow:hidden;
    color:#82919b;
    font-size:10px;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.vendor-v4-tax{
    color:#486477;
    font-weight:700;
}

.vendor-v4-empty{
    color:#9aa7af;
    font-size:12px;
}


/* Status */

.vendor-v4-status{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:6px 9px;
    border-radius:999px;
    white-space:nowrap;
    font-size:11px;
    font-weight:800;
}

.vendor-v4-status i{
    width:6px;
    height:6px;
    border-radius:50%;
}

.vendor-v4-status.active{
    background:#e5f8ef;
    color:#14785d;
}

.vendor-v4-status.active i{
    background:#20a777;
}

.vendor-v4-status.paused{
    background:#fff3dc;
    color:#9a6a12;
}

.vendor-v4-status.paused i{
    background:#e7a420;
}

.vendor-v4-status.unset{
    background:#eef2f4;
    color:#75838c;
}

.vendor-v4-status.unset i{
    background:#9aa6ad;
}


/* Contract */

.vendor-v4-contract{
    display:flex;
    align-items:center;
    gap:4px;
    min-width:175px;
}

.vendor-v4-contract strong{
    color:#506a7a;
    font-size:11px;
    font-weight:700;
}

.vendor-v4-contract span{
    color:#98a5ad;
}


/* Location */

.vendor-v4-location{
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:5px 8px;
    border-radius:7px;
    background:#edf8f8;
    color:#16777c;
    white-space:nowrap;
    font-size:11px;
    font-weight:800;
}


/* Contact */

.vendor-v4-contact strong{
    display:block;
    color:#445f71;
    font-size:12px;
}

.vendor-v4-contact span{
    display:block;
    margin-top:3px;
    color:#85939c;
    font-size:10px;
}


/* Action */

.vendor-v4-action-col{
    width:120px;
}

.vendor-v4-maintain{
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:7px 10px;
    border:1px solid #cce3e4;
    border-radius:8px;
    background:#f2fafa;
    color:#14777c !important;
    text-decoration:none;
    white-space:nowrap;
    font-size:11px;
    font-weight:900;
}

.vendor-v4-maintain:hover{
    border-color:#91c8cb;
    background:#e9f7f7;
}


/* Empty */

.vendor-v4-no-data{
    padding:45px 20px !important;
    text-align:center;
}

.vendor-v4-no-data div,
.vendor-v4-no-result div{
    color:#55a1ac;
    font-size:25px;
}

.vendor-v4-no-data strong,
.vendor-v4-no-result strong{
    display:block;
    margin-top:6px;
    color:#456273;
    font-size:13px;
}

.vendor-v4-no-data span,
.vendor-v4-no-result span{
    display:block;
    margin-top:4px;
    color:#8a979f;
    font-size:11px;
}

.vendor-v4-no-result{
    padding:35px 20px;
    text-align:center;
}


/* Responsive */

@media(max-width:1100px){

    .vendor-v4-kpis{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .vendor-v4-toolbar{
        grid-template-columns:
            1fr 1fr;
    }

    .vendor-v4-search{
        grid-column:1 / -1;
    }

}

@media(max-width:760px){

    .vendor-v4-hero{
        align-items:flex-start;
        flex-wrap:wrap;
        padding:18px;
    }

    .vendor-v4-hero-icon{
        width:55px;
        height:55px;
        flex-basis:55px;
        font-size:23px;
    }

    .vendor-v4-hero-copy h1{
        font-size:26px !important;
    }

    .vendor-v4-hero-copy p{
        font-size:13px;
    }

    .vendor-v4-hero-actions{
        width:100%;
        justify-content:flex-start;
    }

    .vendor-v4-kpis{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .vendor-v4-toolbar{
        grid-template-columns:1fr;
    }

    .vendor-v4-search{
        grid-column:auto;
    }

}



/* ==========================================================
   VENDOR CREATE UI V4
   ========================================================== */

.vendor-create-v4-hero{
    min-height:130px;
    display:flex;
    align-items:center;
    gap:18px;
    margin-bottom:14px;
    padding:23px 27px;
    border:1px solid #dbe9ef;
    border-radius:17px;
    background:
        radial-gradient(
            circle at 82% 38%,
            rgba(181,230,231,.42),
            transparent 29%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3fbfd 58%,
            #edf9f7
        );
}

.vendor-create-v4-icon{
    width:67px;
    height:67px;
    flex:0 0 67px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#dff5f5;
    color:#12858b;
    font-size:28px;
    font-weight:900;
}

.vendor-create-v4-hero h1{
    margin:0;
    color:#173e61;
    font-size:34px !important;
}

.vendor-create-v4-hero p{
    margin:7px 0 0;
    color:#718592;
    font-size:14px;
}

.vendor-create-v4-back{
    margin-left:auto;
    padding:9px 13px;
    border:1px solid #bcdadd;
    border-radius:9px;
    background:#fff;
    color:#14777c;
    text-decoration:none;
    white-space:nowrap;
    font-size:13px;
    font-weight:900;
}


/* Success */

.vendor-create-v4-success{
    display:flex;
    align-items:center;
    gap:11px;
    margin-bottom:13px;
    padding:12px 15px;
    border:1px solid #cde8dd;
    border-radius:11px;
    background:#edf9f4;
}

.vendor-create-v4-success > div:first-child{
    width:30px;
    height:30px;
    flex:0 0 30px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#1b9b74;
    color:#fff;
    font-weight:900;
}

.vendor-create-v4-success strong{
    display:block;
    color:#28705a;
    font-size:13px;
}

.vendor-create-v4-success span{
    display:block;
    margin-top:2px;
    color:#718b80;
    font-size:11px;
}


/* Cards */

.vendor-create-v4-form{
    display:grid;
    gap:12px;
}

.vendor-create-v4-card{
    padding:19px;
    border:1px solid #dce8ed;
    border-radius:14px;
    background:#fff;
    box-shadow:
        0 4px 15px
        rgba(44,78,101,.035);
}

.vendor-create-v4-section-head{
    display:flex;
    align-items:center;
    gap:11px;
    margin-bottom:17px;
    padding-bottom:13px;
    border-bottom:1px solid #edf2f4;
}

.vendor-create-v4-section-icon{
    width:41px;
    height:41px;
    flex:0 0 41px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    background:#e2f5f5;
    color:#14848a;
    font-size:18px;
}

.vendor-create-v4-section-head h2{
    margin:0;
    color:#284960;
    font-size:20px !important;
}

.vendor-create-v4-section-head p{
    margin:4px 0 0;
    color:#81909b;
    font-size:12px;
}


/* Fields */

.vendor-create-v4-grid{
    display:grid;
    gap:14px;
}

.vendor-create-v4-grid.three{
    grid-template-columns:
        repeat(3,minmax(0,1fr));
}

.vendor-create-v4-grid.two{
    grid-template-columns:
        repeat(2,minmax(0,1fr));
}

.vendor-create-v4-grid.contract{
    grid-template-columns:
        minmax(300px,2fr)
        minmax(180px,1fr)
        minmax(180px,1fr);
}

.vendor-create-v4-field{
    display:block;
}

.vendor-create-v4-field.span2{
    grid-column:span 2;
}

.vendor-create-v4-field > span{
    display:block;
    margin-bottom:7px;
    color:#405d70;
    font-size:13px;
    font-weight:800;
}

.vendor-create-v4-field > span b{
    color:#d15b5b;
}

.vendor-create-v4-field input,
.vendor-create-v4-field select{
    width:100%;
    min-height:44px !important;
    padding:8px 11px !important;
    border:1px solid #cbdce4 !important;
    border-radius:9px !important;
    background:#fff !important;
    color:#3c5668;
    font-size:14px !important;
}

.vendor-create-v4-field input:focus,
.vendor-create-v4-field select:focus{
    outline:none;
    border-color:#63b3b7 !important;
    box-shadow:
        0 0 0 3px
        rgba(76,169,174,.10);
}

.vendor-create-v4-field input::placeholder{
    color:#a0adb5;
}


/* Bottom actions */

.vendor-create-v4-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    padding:17px 19px;
    border:1px solid #dce8ed;
    border-radius:13px;
    background:#fff;
}

.vendor-create-v4-required{
    color:#87959e;
    font-size:11px;
}

.vendor-create-v4-required span{
    color:#d15b5b;
    font-weight:900;
}

.vendor-create-v4-actions > div:last-child{
    display:flex;
    gap:8px;
}

.vendor-create-v4-cancel,
.vendor-create-v4-save,
.vendor-create-v4-save-next{
    min-height:43px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 16px !important;
    border-radius:9px !important;
    text-decoration:none;
    font-size:13px !important;
    font-weight:900;
}

.vendor-create-v4-cancel{
    border:1px solid #cddce3;
    background:#fff;
    color:#607889;
}

.vendor-create-v4-save{
    border:1px solid #75babc !important;
    background:#eef9f8 !important;
    color:#14777b !important;
    box-shadow:none !important;
}

.vendor-create-v4-save-next{
    border:1px solid #14888a !important;
    background:#14888a !important;
    color:#fff !important;
}


/* Responsive */

@media(max-width:1000px){

    .vendor-create-v4-grid.three{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .vendor-create-v4-grid.contract{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .vendor-create-v4-grid.contract .address{
        grid-column:1 / -1;
    }

}

@media(max-width:760px){

    .vendor-create-v4-hero{
        align-items:flex-start;
        flex-wrap:wrap;
        padding:18px;
    }

    .vendor-create-v4-icon{
        width:55px;
        height:55px;
        flex-basis:55px;
        font-size:23px;
    }

    .vendor-create-v4-hero h1{
        font-size:26px !important;
    }

    .vendor-create-v4-back{
        width:100%;
        margin-left:0;
        text-align:center;
    }

    .vendor-create-v4-grid.three,
    .vendor-create-v4-grid.two,
    .vendor-create-v4-grid.contract{
        grid-template-columns:1fr;
    }

    .vendor-create-v4-field.span2,
    .vendor-create-v4-grid.contract .address{
        grid-column:auto;
    }

    .vendor-create-v4-actions{
        align-items:stretch;
        flex-direction:column;
    }

    .vendor-create-v4-actions > div:last-child{
        display:grid;
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   VENDOR DETAIL UI V4
   ========================================================== */

.vendor-detail-v4-hero{
    display:flex;
    align-items:center;
    gap:20px;
    min-height:145px;
    margin-bottom:12px;
    padding:23px 27px;
    border:1px solid #dbe9ef;
    border-radius:17px;
    background:
        radial-gradient(
            circle at 80% 40%,
            rgba(183,230,231,.46),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3fbfd 58%,
            #edf9f7
        );
}

.vendor-detail-v4-logo{
    width:86px;
    height:86px;
    flex:0 0 86px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    border:1px solid #d7e6eb;
    border-radius:16px;
    background:#fff;
}

.vendor-detail-v4-logo img{
    width:100%;
    height:100%;
    padding:8px;
    object-fit:contain;
}

.vendor-detail-v4-logo span{
    color:#16858b;
    font-size:34px;
    font-weight:900;
}

.vendor-detail-v4-title{
    flex:1;
    min-width:0;
}

.vendor-detail-v4-title h1{
    margin:0;
    color:#173e61;
    font-size:34px !important;
}

.vendor-detail-v4-meta{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    margin-top:9px;
}

.vendor-detail-v4-meta .status,
.vendor-detail-v4-meta .meta{
    display:inline-flex;
    align-items:center;
    gap:6px;
    min-height:30px;
    padding:5px 10px;
    border-radius:999px;
    font-size:12px;
}

.vendor-detail-v4-meta .status{
    font-weight:900;
}

.vendor-detail-v4-meta .status i{
    width:7px;
    height:7px;
    border-radius:50%;
}

.vendor-detail-v4-meta .active{
    background:#e3f8ef;
    color:#14785e;
}

.vendor-detail-v4-meta .active i{
    background:#1fa375;
}

.vendor-detail-v4-meta .paused{
    background:#fff3dc;
    color:#976910;
}

.vendor-detail-v4-meta .paused i{
    background:#e1a21d;
}

.vendor-detail-v4-meta .unset{
    background:#edf1f3;
    color:#6f7f88;
}

.vendor-detail-v4-meta .unset i{
    background:#9aa6ad;
}

.vendor-detail-v4-meta .meta{
    background:#fff;
    border:1px solid #dae6eb;
    color:#5a7282;
}

.vendor-detail-v4-hero-actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    justify-content:flex-end;
}

.vendor-detail-v4-back,
.vendor-detail-v4-primary{
    min-height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 14px;
    border-radius:9px;
    text-decoration:none;
    white-space:nowrap;
    font-size:13px;
    font-weight:900;
}

.vendor-detail-v4-back{
    border:1px solid #bad8dc;
    background:#fff;
    color:#14777c;
}

.vendor-detail-v4-primary{
    border:1px solid #14888a;
    background:#14888a;
    color:#fff;
}


/* Navigation */

.vendor-detail-v4-nav{
    position:sticky;
    z-index:50;
    top:calc(var(--sh-header) + 7px);
    display:flex;
    gap:6px;
    margin-bottom:13px;
    padding:7px;
    overflow-x:auto;
    border:1px solid #dce8ed;
    border-radius:11px;
    background:rgba(255,255,255,.96);
    box-shadow:
        0 4px 14px
        rgba(44,78,101,.045);
    backdrop-filter:blur(8px);
}

.vendor-detail-v4-nav a{
    min-height:38px;
    display:flex;
    align-items:center;
    padding:7px 12px;
    border-radius:8px;
    color:#536e7f;
    text-decoration:none;
    white-space:nowrap;
    font-size:13px;
    font-weight:800;
}

.vendor-detail-v4-nav a:hover{
    background:#edf8f8;
    color:#14777c;
}

.vendor-detail-v4-nav a.danger{
    color:#a64c4c;
}


/* Main detail area */

.vendor-detail-v4-page{
    display:block;
}

.vendor-detail-v4-page > h2{
    margin:25px 0 10px;
    padding-top:4px;
    color:#244861;
    font-size:24px !important;
}

.vendor-detail-v4-page > h2:first-of-type{
    margin-top:0;
}

#vendor-logo,
#vendor-basic,
#vendor-service,
#vendor-history,
#vendor-disable{
    scroll-margin-top:
        calc(var(--sh-header) + 75px);
}


/* Existing cards */

.vendor-detail-v4-page .card{
    margin-bottom:14px;
    padding:20px !important;
    border:1px solid #dce8ed !important;
    border-radius:14px !important;
    background:#fff !important;
    box-shadow:
        0 4px 16px
        rgba(44,78,101,.04) !important;
}

.vendor-detail-v4-page .card h2{
    margin-top:0;
    color:#254861;
    font-size:21px !important;
}

.vendor-detail-v4-page .card h3{
    margin-top:0;
    color:#315168;
    font-size:18px !important;
}

.vendor-detail-v4-page .card h4{
    margin:20px 0 10px;
    padding-bottom:8px;
    border-bottom:1px solid #e7eef1;
    color:#36586e;
    font-size:16px !important;
}


/* Forms */

.vendor-detail-v4-page form{
    max-width:100%;
}

.vendor-detail-v4-page .row{
    gap:12px;
}

.vendor-detail-v4-page label{
    color:#405d70;
    font-size:13px;
}

.vendor-detail-v4-page label > b{
    display:inline-block;
    margin-bottom:6px;
}

.vendor-detail-v4-page input:not([type="checkbox"]):not([type="file"]),
.vendor-detail-v4-page select,
.vendor-detail-v4-page textarea{
    min-height:43px !important;
    padding:8px 10px !important;
    border:1px solid #cadbe4 !important;
    border-radius:9px !important;
    background:#fff !important;
    color:#3d5668;
    font-size:14px !important;
}

.vendor-detail-v4-page input[type="file"]{
    padding:9px;
    border:1px dashed #b8d4da;
    border-radius:9px;
    background:#f8fbfc;
}

.vendor-detail-v4-page input:focus,
.vendor-detail-v4-page select:focus,
.vendor-detail-v4-page textarea:focus{
    outline:none;
    border-color:#64b5b8 !important;
    box-shadow:
        0 0 0 3px
        rgba(70,170,175,.09);
}


/* Buttons */

.vendor-detail-v4-page button,
.vendor-detail-v4-page .btn{
    min-height:40px;
    padding:8px 14px;
    border-radius:8px !important;
    font-size:13px !important;
    font-weight:800;
}

.vendor-detail-v4-page button:not([style*="#9b2c2c"]){
    background:#14888a;
    border-color:#14888a;
}

.vendor-detail-v4-page button[style*="#9b2c2c"]{
    background:#a44e4e !important;
    border-color:#a44e4e !important;
}


/* Tables */

.vendor-detail-v4-page table{
    width:100%;
    margin:9px 0 14px;
    overflow:hidden;
    border:1px solid #dce7ed !important;
    border-radius:10px;
    border-collapse:separate;
    border-spacing:0;
}

.vendor-detail-v4-page table th{
    padding:11px 10px !important;
    background:
        linear-gradient(
            180deg,
            #edf6f8,
            #e8f2f5
        ) !important;
    color:#36566b;
    font-size:13px !important;
    font-weight:800;
}

.vendor-detail-v4-page table td{
    padding:11px 10px !important;
    border-bottom:1px solid #e7eef1;
    color:#455e6e;
    font-size:13px !important;
    vertical-align:middle;
}

.vendor-detail-v4-page table tr:last-child td{
    border-bottom:0;
}

.vendor-detail-v4-page table tbody tr:hover td{
    background:#f8fbfc;
}


/* Staff edit details */

.vendor-detail-v4-page details{
    min-width:110px;
}

.vendor-detail-v4-page details summary{
    display:inline-flex;
    align-items:center;
    min-height:34px;
    padding:6px 10px;
    border:1px solid #cde2e4;
    border-radius:7px;
    background:#f1f9f9;
    color:#14777c;
    cursor:pointer;
    font-size:12px;
    font-weight:900;
}

.vendor-detail-v4-page details[open]{
    min-width:280px;
    padding:10px;
    border:1px solid #dce7ed;
    border-radius:9px;
    background:#fafcfd;
}

.vendor-detail-v4-page details[open] summary{
    margin-bottom:10px;
}

.vendor-detail-v4-page details form{
    margin:7px 0;
}


/* Logo card */

.vendor-detail-v4-page img[
    src^="/internal/vendors/"
]{
    border-radius:8px;
}


/* Notices */

.vendor-detail-v4-page .notice{
    margin-bottom:12px;
    padding:11px 14px;
    border:1px solid #cce5df;
    border-radius:9px;
    background:#eef9f5;
    color:#42715f;
    font-size:13px;
}


/* Archive / danger area */

#vendor-disable{
    color:#8d4747 !important;
}

#vendor-disable + form,
#vendor-disable ~ form{
    border-radius:10px;
}


/* Mobile */

@media(max-width:900px){

    .vendor-detail-v4-hero{
        flex-wrap:wrap;
    }

    .vendor-detail-v4-hero-actions{
        width:100%;
        justify-content:flex-start;
    }

}

@media(max-width:760px){

    .vendor-detail-v4-hero{
        align-items:flex-start;
        padding:18px;
    }

    .vendor-detail-v4-logo{
        width:60px;
        height:60px;
        flex-basis:60px;
    }

    .vendor-detail-v4-title h1{
        font-size:26px !important;
    }

    .vendor-detail-v4-page .row{
        align-items:stretch;
        flex-direction:column;
    }

    .vendor-detail-v4-page .row > *{
        width:100%;
    }

    .vendor-detail-v4-page input,
    .vendor-detail-v4-page select{
        width:100%;
    }

}



/* ==========================================================
   SERVICE COMPANY SELECT UI V4
   ========================================================== */

.select-v4-hero{
    display:flex;
    align-items:center;
    gap:20px;
    min-height:145px;
    margin-bottom:13px;
    padding:24px 28px;
    border:1px solid #dbe9ef;
    border-radius:17px;
    background:
        radial-gradient(
            circle at 82% 40%,
            rgba(181,230,231,.47),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3fbfd 58%,
            #edf9f7
        );
}

.select-v4-hero-icon{
    width:72px;
    height:72px;
    flex:0 0 72px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#dff5f5;
    color:#13868b;
    font-size:30px;
}

.select-v4-hero-copy{
    flex:1;
}

.select-v4-hero-copy h1{
    margin:0;
    color:#173e61;
    font-size:35px !important;
}

.select-v4-hero-copy p{
    max-width:780px;
    margin:8px 0 0;
    color:#718592;
    font-size:15px;
    line-height:1.65;
}

.select-v4-back{
    min-height:42px;
    display:inline-flex;
    align-items:center;
    padding:0 14px;
    border:1px solid #bad8dc;
    border-radius:9px;
    background:#fff;
    color:#14777c;
    text-decoration:none;
    white-space:nowrap;
    font-size:13px;
    font-weight:900;
}


/* notice */

.select-v4-notice{
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin-bottom:13px;
    padding:12px 15px;
    border:1px solid #d5e7e8;
    border-radius:10px;
    background:#f0f8f7;
}

.select-v4-notice > div:first-child{
    width:27px;
    height:27px;
    flex:0 0 27px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#16888a;
    color:#fff;
    font-size:11px;
    font-weight:900;
}

.select-v4-notice strong{
    display:block;
    color:#46646b;
    font-size:13px;
}

.select-v4-notice span{
    display:block;
    margin-top:3px;
    color:#72878d;
    font-size:11px;
    line-height:1.55;
}


/* toolbar */

.select-v4-toolbar{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:13px;
}

.select-v4-search{
    flex:1;
    min-height:45px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:0 13px;
    border:1px solid #cbdde5;
    border-radius:10px;
    background:#fff;
}

.select-v4-search > span{
    color:#25859c;
    font-size:20px;
}

.select-v4-search input{
    width:100%;
    min-height:0 !important;
    padding:0 !important;
    border:0 !important;
    outline:0;
    background:transparent !important;
    box-shadow:none !important;
    font-size:14px !important;
}

.select-v4-total{
    padding:9px 13px;
    border:1px solid #dce7ed;
    border-radius:9px;
    background:#fff;
    color:#71838f;
    white-space:nowrap;
    font-size:12px;
}

.select-v4-total strong{
    margin:0 4px;
    color:#158287;
    font-size:18px;
}


/* grid */

.select-v4-grid{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:12px;
}

.select-v4-card{
    display:flex;
    flex-direction:column;
    min-height:235px;
    padding:17px;
    border:1px solid #dce8ed;
    border-radius:15px;
    background:#fff;
    box-shadow:
        0 4px 15px
        rgba(44,78,101,.04);
    transition:.16s ease;
}

.select-v4-card:hover{
    transform:translateY(-2px);
    border-color:#abd4d7;
    box-shadow:
        0 8px 24px
        rgba(44,78,101,.075);
}

.select-v4-card-head{
    display:flex;
    align-items:flex-start;
    gap:12px;
}

.select-v4-avatar{
    width:49px;
    height:49px;
    flex:0 0 49px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    background:
        linear-gradient(
            135deg,
            #dff4f4,
            #edf8fb
        );
    color:#147e85;
    font-size:19px;
    font-weight:900;
}

.select-v4-company{
    min-width:0;
}

.select-v4-company h2{
    margin:1px 0 0;
    color:#28485f;
    font-size:17px !important;
    line-height:1.4;
}

.select-v4-tags{
    display:flex;
    flex-wrap:wrap;
    gap:5px;
    margin-top:7px;
}


/* status / role */

.select-v4-status,
.select-v4-role{
    display:inline-flex;
    align-items:center;
    min-height:25px;
    padding:4px 8px;
    border-radius:999px;
    font-size:10px;
    font-weight:800;
}

.select-v4-status{
    gap:5px;
}

.select-v4-status i{
    width:6px;
    height:6px;
    border-radius:50%;
}

.select-v4-status.active{
    background:#e4f8ef;
    color:#14785d;
}

.select-v4-status.active i{
    background:#20a477;
}

.select-v4-status.paused{
    background:#fff3dd;
    color:#976b17;
}

.select-v4-status.paused i{
    background:#dfa522;
}

.select-v4-role.nurse{
    background:#edf4ff;
    color:#3b68a1;
}

.select-v4-role.physician{
    background:#f2eeff;
    color:#6755a8;
}

.select-v4-role.admin{
    background:#eef3f5;
    color:#596f7d;
}

.select-v4-role.other{
    background:#eef9f5;
    color:#357663;
}


/* body */

.select-v4-card-body{
    display:grid;
    gap:9px;
    margin-top:17px;
    padding-top:14px;
    border-top:1px solid #edf1f4;
}

.select-v4-info span{
    display:block;
    color:#8a98a1;
    font-size:10px;
}

.select-v4-info strong{
    display:block;
    margin-top:3px;
    color:#4b6576;
    font-size:12px;
    line-height:1.5;
    font-weight:700;
}


/* enter */

.select-v4-form{
    margin-top:auto;
    padding-top:16px;
}

.select-v4-enter{
    width:100%;
    min-height:43px !important;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 14px !important;
    border:1px solid #b8dadc !important;
    border-radius:9px !important;
    background:#eff9f8 !important;
    color:#14777c !important;
    box-shadow:none !important;
    font-size:13px !important;
    font-weight:900;
}

.select-v4-enter:hover{
    border-color:#14888a !important;
    background:#14888a !important;
    color:#fff !important;
}


/* Empty */

.select-v4-empty{
    grid-column:1 / -1;
    padding:50px 20px;
    border:1px dashed #cfdde3;
    border-radius:14px;
    background:#fbfcfd;
    text-align:center;
}

.select-v4-empty > div{
    color:#52a0ab;
    font-size:29px;
}

.select-v4-empty h2{
    margin:8px 0 0;
    color:#466273;
    font-size:17px !important;
}

.select-v4-empty p{
    margin:5px 0 12px;
    color:#87959e;
    font-size:12px;
}

.select-v4-empty a{
    color:#147a7f;
    font-size:12px;
    font-weight:900;
}


/* responsive */

@media(max-width:1150px){

    .select-v4-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}

@media(max-width:760px){

    .select-v4-hero{
        align-items:flex-start;
        flex-wrap:wrap;
        padding:18px;
    }

    .select-v4-hero-icon{
        width:55px;
        height:55px;
        flex-basis:55px;
        font-size:23px;
    }

    .select-v4-hero-copy h1{
        font-size:26px !important;
    }

    .select-v4-hero-copy p{
        font-size:13px;
    }

    .select-v4-back{
        width:100%;
        justify-content:center;
    }

    .select-v4-toolbar{
        align-items:stretch;
        flex-direction:column;
    }

    .select-v4-grid{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   MY SERVICE VENDORS UI V4
   ========================================================== */

.myvendor-v4-hero{
    display:flex;
    align-items:center;
    gap:20px;
    min-height:145px;
    margin-bottom:13px;
    padding:24px 28px;
    border:1px solid #dbe9ef;
    border-radius:17px;
    background:
        radial-gradient(
            circle at 82% 40%,
            rgba(181,230,231,.46),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3fbfd 58%,
            #edf9f7
        );
}

.myvendor-v4-hero-icon{
    width:72px;
    height:72px;
    flex:0 0 72px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#dff5f5;
    color:#13868b;
    font-size:29px;
}

.myvendor-v4-hero-copy{
    flex:1;
}

.myvendor-v4-hero-copy h1{
    margin:0;
    color:#173e61;
    font-size:35px !important;
}

.myvendor-v4-hero-copy p{
    margin:8px 0 0;
    color:#718592;
    font-size:15px;
    line-height:1.65;
}

.myvendor-v4-count{
    min-width:130px;
    padding:13px 17px;
    border:1px solid #d3e5e7;
    border-radius:12px;
    background:rgba(255,255,255,.82);
    text-align:center;
}

.myvendor-v4-count span{
    display:block;
    color:#71858f;
    font-size:11px;
}

.myvendor-v4-count strong{
    display:block;
    margin:3px 0;
    color:#148589;
    font-size:30px;
}


/* notice */

.myvendor-v4-notice{
    display:flex;
    align-items:flex-start;
    gap:11px;
    margin-bottom:12px;
    padding:13px 15px;
    border:1px solid #d5e7e8;
    border-radius:11px;
    background:#f1f8f7;
}

.myvendor-v4-notice-icon{
    width:28px;
    height:28px;
    flex:0 0 28px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#16888a;
    color:#fff;
    font-size:11px;
    font-weight:900;
}

.myvendor-v4-notice strong{
    color:#426269;
    font-size:13px;
}

.myvendor-v4-notice p{
    margin:3px 0 0;
    color:#70858c;
    font-size:12px;
    line-height:1.6;
}

.myvendor-v4-success{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:12px;
    padding:11px 14px;
    border:1px solid #cce8dd;
    border-radius:10px;
    background:#edf9f4;
}

.myvendor-v4-success > div:first-child{
    width:28px;
    height:28px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#1d9c74;
    color:#fff;
    font-weight:900;
}

.myvendor-v4-success strong{
    display:block;
    color:#2a705a;
    font-size:13px;
}

.myvendor-v4-success span{
    color:#718b80;
    font-size:11px;
}


/* toolbar */

.myvendor-v4-toolbar{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:13px;
}

.myvendor-v4-search{
    flex:1;
    min-height:45px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:0 13px;
    border:1px solid #cadde5;
    border-radius:10px;
    background:#fff;
}

.myvendor-v4-search span{
    color:#23849a;
    font-size:20px;
}

.myvendor-v4-search input{
    width:100%;
    min-height:0 !important;
    padding:0 !important;
    border:0 !important;
    outline:0;
    background:transparent !important;
    box-shadow:none !important;
}

.myvendor-v4-visible{
    padding:10px 13px;
    border:1px solid #dce7ed;
    border-radius:9px;
    background:#fff;
    color:#71848f;
    font-size:12px;
}

.myvendor-v4-visible strong{
    margin:0 4px;
    color:#148287;
    font-size:18px;
}


/* vendor card */

.myvendor-v4-grid{
    display:grid;
    gap:14px;
}

.myvendor-v4-card{
    overflow:hidden;
    border:1px solid #dce8ed;
    border-radius:15px;
    background:#fff;
    box-shadow:
        0 4px 16px
        rgba(44,78,101,.04);
}

.myvendor-v4-card-head{
    display:flex;
    align-items:center;
    gap:13px;
    padding:17px 19px;
    background:
        linear-gradient(
            110deg,
            #fff,
            #f7fbfc
        );
}

.myvendor-v4-avatar{
    width:50px;
    height:50px;
    flex:0 0 50px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    background:#e1f4f4;
    color:#147f85;
    font-size:20px;
    font-weight:900;
}

.myvendor-v4-company{
    flex:1;
    min-width:0;
}

.myvendor-v4-company h2{
    margin:0;
    color:#274960;
    font-size:19px !important;
}

.myvendor-v4-tags{
    display:flex;
    gap:6px;
    flex-wrap:wrap;
    margin-top:6px;
}

.myvendor-v4-role,
.myvendor-v4-tax{
    display:inline-flex;
    align-items:center;
    min-height:25px;
    padding:4px 8px;
    border-radius:999px;
    font-size:10px;
    font-weight:800;
}

.myvendor-v4-role.nurse{
    background:#edf4ff;
    color:#3d68a0;
}

.myvendor-v4-role.physician{
    background:#f2eeff;
    color:#6755a8;
}

.myvendor-v4-role.other{
    background:#edf8f4;
    color:#367763;
}

.myvendor-v4-tax{
    background:#f0f3f5;
    color:#697c87;
}

.myvendor-v4-enter-form{
    margin:0;
}

.myvendor-v4-enter{
    min-height:41px !important;
    display:flex;
    align-items:center;
    gap:12px;
    padding:0 14px !important;
    border:1px solid #14888a !important;
    border-radius:9px !important;
    background:#14888a !important;
    color:#fff !important;
    font-size:13px !important;
    font-weight:900;
}


/* stats */

.myvendor-v4-summary{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    border-top:1px solid #e8eef1;
    border-bottom:1px solid #e8eef1;
    background:#fbfcfd;
}

.myvendor-v4-stat{
    min-height:88px;
    padding:15px 18px;
    border-right:1px solid #e8eef1;
}

.myvendor-v4-stat:last-child{
    border-right:0;
}

.myvendor-v4-stat span{
    display:block;
    color:#87959e;
    font-size:11px;
}

.myvendor-v4-stat strong{
    display:block;
    margin-top:7px;
    color:#405d70;
    font-size:15px;
}

.myvendor-v4-stat.highlight{
    background:#f0faf7;
}

.myvendor-v4-stat.highlight strong{
    color:#157a68;
    font-size:22px;
}

.myvendor-v4-stat small{
    margin-left:3px;
    font-size:11px;
}


/* edit */

.myvendor-v4-edit{
    border:0 !important;
}

.myvendor-v4-edit > summary{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between;
    width:100%;
    min-height:65px !important;
    padding:12px 19px !important;
    border:0 !important;
    border-radius:0 !important;
    background:#fff !important;
    cursor:pointer;
}

.myvendor-v4-edit > summary strong{
    display:block;
    color:#36576d;
    font-size:14px;
}

.myvendor-v4-edit > summary span{
    display:block;
    margin-top:3px;
    color:#87959e;
    font-size:11px;
}

.myvendor-v4-edit > summary > b{
    color:#147d81;
    font-size:12px;
}

.myvendor-v4-edit[open]{
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:#fff !important;
}

.myvendor-v4-edit[open] > summary{
    border-bottom:
        1px solid #e7eef1 !important;
}


/* form */

.myvendor-v4-form{
    padding:18px;
}

.myvendor-v4-form-section{
    margin-bottom:17px;
    padding-bottom:17px;
    border-bottom:1px solid #edf1f3;
}

.myvendor-v4-form-title{
    display:flex;
    align-items:center;
    gap:9px;
    margin-bottom:13px;
}

.myvendor-v4-form-title > span{
    width:34px;
    height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    background:#e4f5f4;
    color:#148287;
}

.myvendor-v4-form-title h3{
    margin:0;
    color:#36576d;
    font-size:15px !important;
}

.myvendor-v4-form-title p{
    margin:2px 0 0;
    color:#89969e;
    font-size:10px;
}

.myvendor-v4-fields{
    display:grid;
    gap:11px;
}

.myvendor-v4-fields.basic{
    grid-template-columns:
        1.3fr .7fr 2fr;
}

.myvendor-v4-fields.three{
    grid-template-columns:
        repeat(3,minmax(0,1fr));
}

.myvendor-v4-fields.four{
    grid-template-columns:
        repeat(4,minmax(0,1fr));
}

.myvendor-v4-fields label > span{
    display:block;
    margin-bottom:6px;
    color:#455f70;
    font-size:12px;
    font-weight:800;
}

.myvendor-v4-fields label > span b{
    color:#d05c5c;
}

.myvendor-v4-fields input{
    width:100%;
    min-height:42px !important;
    padding:8px 10px !important;
    border:1px solid #cbdce4 !important;
    border-radius:8px !important;
    background:#fff !important;
    font-size:13px !important;
}

.myvendor-v4-fields input:focus{
    outline:none;
    border-color:#62b4b7 !important;
    box-shadow:
        0 0 0 3px
        rgba(70,170,175,.09);
}

.myvendor-v4-fields .annual{
    grid-column:span 2;
}

.myvendor-v4-number{
    display:flex;
    align-items:center;
    gap:8px;
}

.myvendor-v4-number input{
    max-width:180px;
}

.myvendor-v4-number em{
    color:#758993;
    font-size:12px;
    font-style:normal;
}


/* actions */

.myvendor-v4-form-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
}

.myvendor-v4-form-actions > div{
    color:#7a8d96;
    font-size:11px;
}

.myvendor-v4-form-actions > div span{
    display:inline-flex;
    width:20px;
    height:20px;
    align-items:center;
    justify-content:center;
    margin-right:4px;
    border-radius:50%;
    background:#e6f5f3;
    color:#147d7e;
}

.myvendor-v4-form-actions button{
    min-height:42px !important;
    padding:0 17px !important;
    border:1px solid #14888a !important;
    border-radius:9px !important;
    background:#14888a !important;
    color:#fff !important;
    font-size:13px !important;
    font-weight:900;
}


/* empty */

.myvendor-v4-empty{
    padding:48px 20px;
    border:1px dashed #cfdee4;
    border-radius:14px;
    background:#fbfcfd;
    text-align:center;
}

.myvendor-v4-empty > div{
    color:#52a0aa;
    font-size:28px;
}

.myvendor-v4-empty h2{
    margin:8px 0 0;
    color:#466273;
    font-size:17px !important;
}

.myvendor-v4-empty p{
    margin:5px 0 0;
    color:#87959e;
    font-size:12px;
}


/* responsive */

@media(max-width:1050px){

    .myvendor-v4-summary{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .myvendor-v4-fields.four{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}

@media(max-width:760px){

    .myvendor-v4-hero{
        flex-wrap:wrap;
        padding:18px;
    }

    .myvendor-v4-hero-icon{
        width:55px;
        height:55px;
        flex-basis:55px;
    }

    .myvendor-v4-hero-copy h1{
        font-size:26px !important;
    }

    .myvendor-v4-count{
        width:100%;
    }

    .myvendor-v4-toolbar{
        align-items:stretch;
        flex-direction:column;
    }

    .myvendor-v4-card-head{
        align-items:flex-start;
        flex-wrap:wrap;
    }

    .myvendor-v4-enter-form{
        width:100%;
    }

    .myvendor-v4-enter{
        width:100%;
        justify-content:center;
    }

    .myvendor-v4-summary,
    .myvendor-v4-fields.basic,
    .myvendor-v4-fields.three,
    .myvendor-v4-fields.four{
        grid-template-columns:1fr;
    }

    .myvendor-v4-stat{
        border-right:0;
        border-bottom:1px solid #e8eef1;
    }

    .myvendor-v4-fields .annual{
        grid-column:auto;
    }

    .myvendor-v4-form-actions{
        align-items:stretch;
        flex-direction:column;
    }

    .myvendor-v4-form-actions button{
        width:100%;
    }

}



/* ==========================================================
   EXAM INTEGRATED REVIEW UI V1
   ========================================================== */

.examreview-v1-entry{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:12px;
    padding:11px 14px;
    border:1px solid #cfe3e5;
    border-radius:10px;
    background:#f2f9f9;
}

.examreview-v1-entry a{
    color:#147b80;
    font-size:14px;
    font-weight:900;
    text-decoration:none;
}

.examreview-v1-entry span{
    color:#819199;
    font-size:12px;
}


.examreview-v1-hero,
.examreview-v1-employee-hero{
    display:flex;
    align-items:center;
    gap:20px;
    min-height:145px;
    margin-bottom:13px;
    padding:24px 28px;
    border:1px solid #dbe9ef;
    border-radius:17px;
    background:
        radial-gradient(
            circle at 82% 40%,
            rgba(181,230,231,.45),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3fbfd 58%,
            #edf9f7
        );
}

.examreview-v1-icon{
    width:72px;
    height:72px;
    flex:0 0 72px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#dff5f5;
    color:#13868b;
    font-size:29px;
}

.examreview-v1-copy{
    flex:1;
}

.examreview-v1-copy h1,
.examreview-v1-employee-hero h1{
    margin:0;
    color:#173e61;
    font-size:35px !important;
}

.examreview-v1-copy p,
.examreview-v1-employee-hero p{
    margin:8px 0 0;
    color:#718592;
    font-size:15px;
    line-height:1.65;
}

.examreview-v1-actions{
    display:flex;
    gap:8px;
}

.examreview-v1-actions a,
.examreview-v1-employee-hero > a{
    min-height:41px;
    display:inline-flex;
    align-items:center;
    padding:0 13px;
    border:1px solid #bddadd;
    border-radius:8px;
    background:#fff;
    color:#14777c;
    text-decoration:none;
    font-size:13px;
    font-weight:900;
}

.examreview-v1-employee-hero{
    justify-content:space-between;
}


/* KPI */

.examreview-v1-kpis{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:13px;
}

.examreview-v1-kpis > div{
    min-height:93px;
    padding:15px 17px;
    border:1px solid #dce8ed;
    border-radius:13px;
    background:#fff;
}

.examreview-v1-kpis > div.review{
    background:#fff8ed;
}

.examreview-v1-kpis > div.grade{
    background:#fff1f1;
}

.examreview-v1-kpis span{
    display:block;
    color:#748792;
    font-size:12px;
    font-weight:800;
}

.examreview-v1-kpis strong{
    display:inline-block;
    margin-top:6px;
    color:#234a62;
    font-size:29px;
}

.examreview-v1-kpis small{
    margin-left:4px;
    color:#83929b;
    font-size:11px;
}


/* Panel */

.examreview-v1-panel{
    margin-bottom:14px;
    padding:18px;
    border:1px solid #dce8ed;
    border-radius:14px;
    background:#fff;
    box-shadow:
        0 4px 15px
        rgba(44,78,101,.035);
}

.examreview-v1-panel-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-bottom:14px;
}

.examreview-v1-panel-head h2{
    margin:0;
    color:#284960;
    font-size:21px !important;
}

.examreview-v1-panel-head p{
    margin:4px 0 0;
    color:#81909a;
    font-size:12px;
    line-height:1.55;
}

.examreview-v1-panel-head > div:last-child{
    color:#798b96;
    font-size:12px;
}

.examreview-v1-panel-head > div:last-child strong{
    color:#148287;
    font-size:19px;
}


/* filters */

.examreview-v1-filters{
    display:grid;
    grid-template-columns:
        minmax(280px,1fr)
        180px
        160px
        auto
        auto;
    gap:8px;
    margin-bottom:11px;
}

.examreview-v1-search{
    min-height:43px;
    display:flex;
    align-items:center;
    gap:8px;
    padding:0 12px;
    border:1px solid #cadde5;
    border-radius:9px;
}

.examreview-v1-search span{
    color:#25839a;
    font-size:19px;
}

.examreview-v1-search input{
    width:100%;
    min-height:0 !important;
    padding:0 !important;
    border:0 !important;
    outline:none;
    background:transparent !important;
    box-shadow:none !important;
}

.examreview-v1-filters select,
.examreview-v1-filters button{
    min-height:43px !important;
    border-radius:9px !important;
}

.examreview-v1-filters button{
    padding:0 16px !important;
    background:#14888a !important;
}

.examreview-v1-filters > a{
    min-height:43px;
    display:flex;
    align-items:center;
    padding:0 13px;
    border:1px solid #d1dfe4;
    border-radius:9px;
    color:#657d8a;
    text-decoration:none;
    font-size:12px;
}


/* quick grade filter */

.examreview-v1-gradebar{
    display:flex;
    gap:6px;
    flex-wrap:wrap;
    margin-bottom:12px;
}

.examreview-v1-gradebar a{
    min-height:32px;
    display:flex;
    align-items:center;
    padding:4px 10px;
    border:1px solid #d5e2e7;
    border-radius:999px;
    background:#fff;
    color:#647b88;
    text-decoration:none;
    font-size:11px;
    font-weight:800;
}

.examreview-v1-gradebar a.active{
    border-color:#78bfc1;
    background:#eaf8f7;
    color:#14787c;
}

.examreview-v1-gradebar a.active.review{
    border-color:#e6bb72;
    background:#fff6e7;
    color:#976816;
}


/* table */

.examreview-v1-table-wrap{
    overflow-x:auto;
    border:1px solid #dce7ed;
    border-radius:10px;
}

.examreview-v1-table{
    width:100%;
    min-width:1000px;
    margin:0 !important;
    border:0 !important;
}

.examreview-v1-table th{
    padding:11px 10px !important;
    background:#ebf5f7 !important;
    color:#35586d !important;
    font-size:13px !important;
}

.examreview-v1-table td{
    padding:11px 10px !important;
    border-bottom:1px solid #e7eef1 !important;
    color:#455f70;
    font-size:13px !important;
    vertical-align:middle;
}

.examreview-v1-table tr:last-child td{
    border-bottom:0 !important;
}

.examreview-v1-source,
.examreview-v1-status{
    display:inline-flex;
    align-items:center;
    min-height:27px;
    padding:4px 8px;
    border-radius:999px;
    white-space:nowrap;
    font-size:10px;
    font-weight:900;
}

.examreview-v1-source.general{
    background:#eaf7f8;
    color:#147a80;
}

.examreview-v1-source.other{
    background:#f3efff;
    color:#6754a3;
}

.examreview-v1-status.review{
    background:#fff3dc;
    color:#996a15;
}

.examreview-v1-status.grade1{
    background:#e9f8f0;
    color:#25755d;
}

.examreview-v1-status.grade2{
    background:#eef5ff;
    color:#436da1;
}

.examreview-v1-status.grade3{
    background:#fff0dc;
    color:#a06516;
}

.examreview-v1-status.grade4{
    background:#fde8e8;
    color:#a74747;
}

.examreview-v1-status.abnormal{
    background:#fff0e8;
    color:#a85a31;
}

.examreview-v1-status.neutral{
    background:#eff3f5;
    color:#71818b;
}

.examreview-v1-person{
    color:#31576e;
    text-decoration:none;
}

.examreview-v1-person strong{
    display:block;
}

.examreview-v1-person span{
    display:block;
    margin-top:2px;
    color:#89979f;
    font-size:10px;
}

.examreview-v1-title{
    color:#425e70;
}

.examreview-v1-row-actions{
    display:flex;
    gap:7px;
    flex-wrap:wrap;
}

.examreview-v1-row-actions a,
.examreview-v1-detail{
    color:#147a7e;
    text-decoration:none;
    white-space:nowrap;
    font-size:11px;
    font-weight:900;
}

.examreview-v1-muted{
    display:block;
    margin-top:3px;
    color:#8b989f;
    font-size:10px;
}

.examreview-v1-abnormal-item{
    margin-top:4px;
    color:#8f5d44;
    font-size:10px;
}

.examreview-v1-empty{
    padding:35px !important;
    text-align:center;
    color:#89979f !important;
}

.examreview-v1-empty div{
    font-size:24px;
}

.examreview-v1-empty strong{
    display:block;
    margin-top:5px;
}

.examreview-v1-empty span{
    display:block;
    margin-top:3px;
    font-size:11px;
}


@media(max-width:1000px){

    .examreview-v1-kpis{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .examreview-v1-filters{
        grid-template-columns:
            1fr 1fr;
    }

    .examreview-v1-search{
        grid-column:1 / -1;
    }

}

@media(max-width:760px){

    .examreview-v1-hero,
    .examreview-v1-employee-hero{
        align-items:flex-start;
        flex-wrap:wrap;
        padding:18px;
    }

    .examreview-v1-copy h1,
    .examreview-v1-employee-hero h1{
        font-size:26px !important;
    }

    .examreview-v1-actions{
        width:100%;
    }

    .examreview-v1-kpis{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .examreview-v1-filters{
        grid-template-columns:1fr;
    }

    .examreview-v1-search{
        grid-column:auto;
    }

}



/* ==========================================================
   STAFF TRAINING UI V4
   ========================================================== */

.training-v4-hero,
.training-v4-detail-hero{
    display:flex;
    align-items:center;
    gap:20px;
    min-height:145px;
    margin-bottom:13px;
    padding:24px 28px;
    border:1px solid #dbe9ef;
    border-radius:17px;
    background:
        radial-gradient(
            circle at 82% 40%,
            rgba(181,230,231,.46),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3fbfd 58%,
            #edf9f7
        );
}

.training-v4-hero-icon{
    width:72px;
    height:72px;
    flex:0 0 72px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#e8efff;
    color:#536fb0;
    font-size:29px;
}

.training-v4-hero-copy{
    flex:1;
}

.training-v4-hero h1,
.training-v4-detail-hero h1{
    margin:0;
    color:#173e61;
    font-size:35px !important;
}

.training-v4-hero p,
.training-v4-detail-hero p{
    margin:8px 0 0;
    color:#718592;
    font-size:15px;
    line-height:1.65;
}

.training-v4-year{
    min-width:130px;
    padding:13px 17px;
    border:1px solid #d3e5e7;
    border-radius:12px;
    background:rgba(255,255,255,.86);
    text-align:center;
}

.training-v4-year span{
    display:block;
    color:#71858f;
    font-size:11px;
}

.training-v4-year strong{
    display:block;
    margin-top:3px;
    color:#536fa8;
    font-size:27px;
}

.training-v4-detail-hero{
    justify-content:space-between;
}

.training-v4-detail-actions{
    display:flex;
    gap:7px;
    flex-wrap:wrap;
}

.training-v4-detail-actions a{
    min-height:40px;
    display:flex;
    align-items:center;
    padding:0 12px;
    border:1px solid #bed9dd;
    border-radius:8px;
    background:#fff;
    color:#14777c;
    text-decoration:none;
    font-size:12px;
    font-weight:900;
}


/* notice */

.training-v4-notice{
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin-bottom:12px;
    padding:12px 15px;
    border:1px solid #d5e7e8;
    border-radius:10px;
    background:#f1f8f7;
}

.training-v4-notice > div:first-child{
    width:28px;
    height:28px;
    flex:0 0 28px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#16888a;
    color:#fff;
    font-size:11px;
    font-weight:900;
}

.training-v4-notice strong{
    display:block;
    color:#426269;
    font-size:13px;
}

.training-v4-notice span{
    display:block;
    margin-top:3px;
    color:#71858c;
    font-size:11px;
    line-height:1.6;
}


/* overview toolbar */

.training-v4-toolbar{
    display:grid;
    grid-template-columns:
        auto
        minmax(280px,1fr)
        180px
        auto;
    gap:8px;
    margin-bottom:13px;
}

.training-v4-year-form{
    display:flex;
    align-items:center;
    gap:7px;
}

.training-v4-year-form label{
    color:#607986;
    font-size:11px;
    font-weight:900;
}

.training-v4-year-form input{
    width:100px !important;
    min-height:42px !important;
}

.training-v4-year-form button{
    min-height:42px !important;
    padding:0 12px !important;
}

.training-v4-search{
    min-height:42px;
    display:flex;
    align-items:center;
    gap:8px;
    padding:0 12px;
    border:1px solid #cadde5;
    border-radius:9px;
    background:#fff;
}

.training-v4-search span{
    color:#25849a;
    font-size:19px;
}

.training-v4-search input{
    width:100%;
    min-height:0 !important;
    padding:0 !important;
    border:0 !important;
    outline:none;
    background:transparent !important;
    box-shadow:none !important;
}

.training-v4-toolbar select{
    min-height:42px !important;
    border-radius:9px !important;
}

.training-v4-visible{
    min-height:42px;
    display:flex;
    align-items:center;
    padding:0 12px;
    border:1px solid #d5e2e7;
    border-radius:9px;
    background:#fff;
    color:#738691;
    white-space:nowrap;
    font-size:11px;
}

.training-v4-visible strong{
    margin:0 4px;
    color:#148287;
    font-size:18px;
}


/* summary */

.training-v4-summary{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:12px;
}

.training-v4-summary > div{
    min-height:103px;
    padding:15px 17px;
    border:1px solid #dce8ed;
    border-radius:12px;
    background:#fff;
}

.training-v4-summary > div.success{
    background:#eef9f5;
}

.training-v4-summary > div.warning{
    background:#fff8eb;
}

.training-v4-summary span{
    display:block;
    color:#778993;
    font-size:11px;
}

.training-v4-summary strong{
    display:inline-block;
    margin-top:7px;
    color:#274e66;
    font-size:27px;
}

.training-v4-summary strong.training-v4-summary-text{
    font-size:17px;
}

.training-v4-summary small{
    display:block;
    margin-top:3px;
    color:#87959d;
    font-size:10px;
}


/* progress */

.training-v4-progress-card{
    margin-bottom:12px;
    padding:16px 18px;
    border:1px solid #dce8ed;
    border-radius:12px;
    background:#fff;
}

.training-v4-progress-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
}

.training-v4-progress-title strong{
    display:block;
    color:#35596e;
    font-size:14px;
}

.training-v4-progress-title span{
    display:block;
    margin-top:3px;
    color:#7e9099;
    font-size:11px;
}

.training-v4-large-progress{
    height:11px;
    overflow:hidden;
    margin-top:13px;
    border-radius:999px;
    background:#e8eef1;
}

.training-v4-large-progress span{
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(
        90deg,
        #56aaa9,
        #73bda8
    );
}

.training-v4-progress-card p{
    margin:8px 0 0;
    color:#87959c;
    font-size:10px;
}


/* panel */

.training-v4-panel,
.training-v4-record-panel,
.training-v4-add-panel{
    margin-bottom:13px;
    padding:18px;
    border:1px solid #dce8ed;
    border-radius:14px;
    background:#fff;
    box-shadow:
        0 4px 15px
        rgba(44,78,101,.035);
}

.training-v4-panel-head,
.training-v4-record-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    margin-bottom:13px;
}

.training-v4-panel-head h2,
.training-v4-record-head h2{
    margin:0;
    color:#284960;
    font-size:21px !important;
}

.training-v4-panel-head p,
.training-v4-record-head p{
    margin:4px 0 0;
    color:#81909a;
    font-size:11px;
}


/* table */

.training-v4-table-wrap{
    overflow-x:auto;
    border:1px solid #dce7ed;
    border-radius:10px;
}

.training-v4-table{
    width:100%;
    min-width:1000px;
    margin:0 !important;
    border:0 !important;
}

.training-v4-table th{
    padding:11px 10px !important;
    background:#ebf5f7 !important;
    color:#35586d !important;
    font-size:12px !important;
}

.training-v4-table td{
    padding:11px 10px !important;
    border-bottom:1px solid #e7eef1 !important;
    vertical-align:middle;
    color:#455f70;
    font-size:12px !important;
}

.training-v4-person{
    display:flex;
    align-items:center;
    gap:9px;
}

.training-v4-avatar{
    width:35px;
    height:35px;
    flex:0 0 35px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    background:#e6f3f4;
    color:#147b82;
    font-size:13px;
    font-weight:900;
}

.training-v4-person strong{
    display:block;
}

.training-v4-person span{
    display:block;
    margin-top:2px;
    color:#8b989f;
    font-size:9px;
}

.training-v4-role{
    display:inline-flex;
    padding:5px 8px;
    border-radius:999px;
    background:#eef3f7;
    color:#5b7180;
    font-size:10px;
    font-weight:800;
}

.training-v4-hours{
    color:#31596f;
    font-size:16px;
}

.training-v4-hours.total{
    color:#147d80;
}

.training-v4-unit{
    color:#8a989f;
    font-size:9px;
}

.training-v4-status{
    display:inline-flex;
    align-items:center;
    min-height:27px;
    padding:4px 8px;
    border-radius:999px;
    font-size:10px;
    font-weight:900;
}

.training-v4-status.success{
    background:#e8f8f0;
    color:#21765d;
}

.training-v4-status.warning{
    background:#fff3df;
    color:#9b6919;
}

.training-v4-status.neutral{
    background:#eff3f5;
    color:#6e808a;
}

.training-v4-progress{
    min-width:120px;
}

.training-v4-progress-track{
    height:7px;
    overflow:hidden;
    border-radius:999px;
    background:#e5ecef;
}

.training-v4-progress-track span{
    display:block;
    height:100%;
    border-radius:999px;
    background:#62af9f;
}

.training-v4-progress small{
    display:block;
    margin-top:4px;
    color:#84939b;
    font-size:9px;
}

.training-v4-detail-btn{
    color:#147a7f;
    text-decoration:none;
    white-space:nowrap;
    font-size:11px;
    font-weight:900;
}

.training-v4-empty{
    padding:30px !important;
    color:#89979f !important;
    text-align:center;
}

.training-v4-browser-empty{
    margin-top:10px;
    border:1px dashed #d0dde3;
    border-radius:9px;
}


/* add */

.training-v4-add-panel{
    padding:0;
    overflow:hidden;
}

.training-v4-add-panel > details > summary{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:66px;
    padding:14px 18px;
    cursor:pointer;
}

.training-v4-add-panel summary strong{
    display:block;
    color:#31566d;
    font-size:14px;
}

.training-v4-add-panel summary span{
    display:block;
    margin-top:3px;
    color:#89979f;
    font-size:10px;
}

.training-v4-add-panel summary b{
    color:#147d82;
    font-size:11px;
}

.training-v4-form{
    padding:18px;
    border-top:1px solid #e8eef1;
}

.training-v4-form-grid{
    display:grid;
    grid-template-columns:
        1fr 1fr 2fr 1.2fr .7fr 1fr;
    gap:10px;
}

.training-v4-form label > span,
.training-v4-edit-form label > span,
.training-v4-proof label > span{
    display:block;
    margin-bottom:5px;
    color:#466173;
    font-size:11px;
    font-weight:800;
}

.training-v4-form label > span b{
    color:#c95858;
}

.training-v4-form input,
.training-v4-form select,
.training-v4-edit-form input,
.training-v4-edit-form select{
    width:100%;
    min-height:40px !important;
    padding:7px 9px !important;
    border:1px solid #cadce4 !important;
    border-radius:8px !important;
}

.training-v4-proof{
    display:flex;
    align-items:flex-end;
    gap:12px;
    margin-top:11px;
}

.training-v4-proof > div{
    display:flex;
    gap:10px;
    align-items:center;
}

.training-v4-proof .grow{
    flex:1;
}

.training-v4-form-actions{
    display:flex;
    justify-content:flex-end;
    margin-top:13px;
}

.training-v4-form-actions button{
    min-height:41px !important;
    padding:0 16px !important;
}


/* proofs */

.training-v4-proofs{
    display:flex;
    flex-wrap:wrap;
    gap:4px;
}

.training-v4-proofs span{
    padding:3px 6px;
    border-radius:999px;
    background:#eef5f7;
    color:#5e7785;
    font-size:9px;
}


/* edit */

.training-v4-edit > summary{
    cursor:pointer;
    color:#147a80;
    font-size:11px;
    font-weight:900;
}

.training-v4-edit-box{
    min-width:760px;
    margin-top:8px;
    padding:13px;
    border:1px solid #dbe6eb;
    border-radius:9px;
    background:#f9fbfc;
}

.training-v4-edit-grid{
    display:grid;
    grid-template-columns:
        1fr 2fr 1.2fr .7fr 1fr;
    gap:8px;
}

.training-v4-edit-form button{
    min-height:38px !important;
    margin-top:10px;
}

.training-v4-delete{
    margin-top:7px;
}

.training-v4-delete button{
    min-height:36px !important;
    background:#a95555 !important;
}


/* responsive */

@media(max-width:1100px){

    .training-v4-toolbar{
        grid-template-columns:
            1fr 1fr;
    }

    .training-v4-search{
        grid-column:1 / -1;
    }

    .training-v4-form-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}

@media(max-width:760px){

    .training-v4-hero,
    .training-v4-detail-hero{
        align-items:flex-start;
        flex-wrap:wrap;
        padding:18px;
    }

    .training-v4-hero h1,
    .training-v4-detail-hero h1{
        font-size:26px !important;
    }

    .training-v4-year{
        width:100%;
    }

    .training-v4-detail-actions{
        width:100%;
    }

    .training-v4-summary{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .training-v4-progress-title{
        align-items:flex-start;
        flex-direction:column;
    }

    .training-v4-toolbar{
        grid-template-columns:1fr;
    }

    .training-v4-search{
        grid-column:auto;
    }

    .training-v4-form-grid,
    .training-v4-edit-grid{
        grid-template-columns:1fr;
    }

    .training-v4-proof{
        align-items:stretch;
        flex-direction:column;
    }

}



/* ==========================================================
   TRAINING REMINDER V1
   ========================================================== */

.training-reminder-v1{
    margin-bottom:14px;
    padding:18px 20px;
    border:1px solid #d9e7ec;
    border-radius:14px;
    background:
        linear-gradient(
            120deg,
            #ffffff,
            #f5fbfc
        );
    box-shadow:
        0 4px 15px
        rgba(45,75,95,.035);
}

.training-reminder-v1.is-complete{
    border-color:#c9e5d8;
    background:
        linear-gradient(
            120deg,
            #fff,
            #f2faf6
        );
}

.training-reminder-v1.is-pending{
    border-color:#ead7ae;
    background:
        linear-gradient(
            120deg,
            #fff,
            #fffaf0
        );
}

.training-reminder-v1.is-unset{
    border-color:#dde3e7;
}

.training-reminder-v1-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
}

.training-reminder-v1-eyebrow{
    display:block;
    margin-bottom:4px;
    color:#349097;
    font-size:10px;
    font-weight:900;
    letter-spacing:.08em;
}

.training-reminder-v1 h2{
    margin:0;
    color:#294e65;
    font-size:20px !important;
}

.training-reminder-v1-head p{
    margin:5px 0 0;
    color:#71848e;
    font-size:12px;
    line-height:1.55;
}

.training-reminder-v1-status span{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:5px 10px;
    border-radius:999px;
    white-space:nowrap;
    font-size:11px;
    font-weight:900;
}

.training-reminder-v1-status .success{
    background:#e5f7ef;
    color:#23765e;
}

.training-reminder-v1-status .pending{
    background:#fff1d8;
    color:#9b6918;
}

.training-reminder-v1-status .unset{
    background:#eef2f4;
    color:#6f7f88;
}

.training-reminder-v1-grid{
    display:grid;
    grid-template-columns:
        repeat(2,minmax(0,1fr));
    gap:12px;
    margin-top:15px;
}

.training-reminder-v1-grid.single{
    grid-template-columns:
        minmax(0,520px);
}

.training-reminder-v1-grid > div{
    padding:13px 15px;
    border:1px solid #e0e9ed;
    border-radius:10px;
    background:rgba(255,255,255,.88);
}

.training-reminder-v1-grid > div > span{
    display:block;
    color:#758994;
    font-size:11px;
    font-weight:800;
}

.training-reminder-v1-grid strong{
    display:block;
    margin-top:5px;
    color:#284f68;
    font-size:22px;
}

.training-reminder-v1-grid strong small{
    color:#83939c;
    font-size:11px;
    font-weight:700;
}

.training-reminder-v1-progress{
    height:8px;
    overflow:hidden;
    margin-top:9px;
    border-radius:999px;
    background:#e5ecef;
}

.training-reminder-v1-progress i{
    display:block;
    height:100%;
    border-radius:999px;
    background:
        linear-gradient(
            90deg,
            #4fa7aa,
            #6ab69c
        );
}

.training-reminder-v1-grid em{
    display:block;
    margin-top:6px;
    color:#a27021;
    font-size:10px;
    font-style:normal;
    font-weight:800;
}

.training-reminder-v1-grid em.done{
    color:#28755e;
}

.training-reminder-v1-split{
    display:flex;
    gap:14px;
    margin-top:7px;
    color:#758790;
    font-size:10px;
}

.training-reminder-v1-split span{
    display:inline !important;
}

.training-reminder-v1-split b{
    color:#385d72;
}

.training-reminder-v1-unset{
    margin-top:14px;
    padding:13px;
    border-radius:9px;
    background:#f5f7f8;
}

.training-reminder-v1-unset strong{
    color:#586d79;
}

.training-reminder-v1-unset p{
    margin:5px 0 0;
    color:#7b8a92;
    font-size:11px;
}

.training-reminder-v1-action{
    display:flex;
    justify-content:flex-end;
    margin-top:12px;
}

.training-reminder-v1-action a{
    color:#147a80;
    text-decoration:none;
    font-size:11px;
    font-weight:900;
}


@media(max-width:760px){

    .training-reminder-v1-head{
        flex-direction:column;
    }

    .training-reminder-v1-grid{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   MY SALARY UI V4
   ========================================================== */

.mysalary-v4-hero{
    display:flex;
    align-items:center;
    gap:20px;
    min-height:145px;
    margin-bottom:13px;
    padding:24px 28px;
    border:1px solid #dbe9ef;
    border-radius:17px;
    background:
        radial-gradient(
            circle at 82% 40%,
            rgba(181,230,231,.46),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3fbfd 58%,
            #edf9f7
        );
}

.mysalary-v4-icon{
    width:72px;
    height:72px;
    flex:0 0 72px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#e3f5ee;
    color:#26826a;
    font-size:27px;
    font-weight:900;
}

.mysalary-v4-copy{
    flex:1;
}

.mysalary-v4-copy h1{
    margin:0;
    color:#173e61;
    font-size:35px !important;
}

.mysalary-v4-copy p{
    max-width:760px;
    margin:8px 0 0;
    color:#718592;
    font-size:15px;
    line-height:1.65;
}

.mysalary-v4-state{
    min-width:140px;
    padding:14px 17px;
    border:1px solid #d6e4e8;
    border-radius:12px;
    background:rgba(255,255,255,.86);
    text-align:center;
}

.mysalary-v4-state span{
    display:block;
    color:#819099;
    font-size:11px;
}

.mysalary-v4-state strong{
    display:block;
    margin-top:5px;
    color:#7f8e96;
    font-size:16px;
}


/* notice */

.mysalary-v4-notice{
    display:flex;
    align-items:flex-start;
    gap:11px;
    margin-bottom:13px;
    padding:13px 15px;
    border:1px solid #e2dfca;
    border-radius:10px;
    background:#fffdf4;
}

.mysalary-v4-notice > div:first-child{
    width:28px;
    height:28px;
    flex:0 0 28px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#c59e4d;
    color:#fff;
    font-size:11px;
    font-weight:900;
}

.mysalary-v4-notice strong{
    color:#6e633f;
    font-size:13px;
}

.mysalary-v4-notice p{
    margin:3px 0 0;
    color:#897e5b;
    font-size:11px;
    line-height:1.6;
}


/* grid */

.mysalary-v4-grid{
    display:grid;
    grid-template-columns:
        minmax(0,1fr)
        320px;
    gap:13px;
}

.mysalary-v4-main-card,
.mysalary-v4-side-card{
    border:1px solid #dce8ed;
    border-radius:14px;
    background:#fff;
    box-shadow:
        0 4px 15px
        rgba(44,78,101,.035);
}

.mysalary-v4-main-card{
    padding:30px;
    text-align:center;
}

.mysalary-v4-empty-icon{
    width:62px;
    height:62px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto;
    border-radius:16px;
    background:#edf6f7;
    color:#4a9299;
    font-size:25px;
}

.mysalary-v4-main-card h2{
    margin:15px 0 0;
    color:#31566e;
    font-size:22px !important;
}

.mysalary-v4-main-card > p{
    max-width:620px;
    margin:8px auto 0;
    color:#80909a;
    font-size:13px;
    line-height:1.7;
}

.mysalary-v4-features{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:9px;
    margin-top:24px;
    text-align:left;
}

.mysalary-v4-features > div{
    min-height:115px;
    padding:13px;
    border:1px solid #e0eaee;
    border-radius:10px;
    background:#fbfcfd;
}

.mysalary-v4-features span{
    color:#62a4aa;
    font-size:10px;
    font-weight:900;
}

.mysalary-v4-features strong{
    display:block;
    margin-top:8px;
    color:#3d5f73;
    font-size:13px;
}

.mysalary-v4-features small{
    display:block;
    margin-top:5px;
    color:#84939c;
    font-size:10px;
    line-height:1.5;
}

.mysalary-v4-back{
    min-height:41px;
    display:inline-flex;
    align-items:center;
    margin-top:22px;
    padding:0 14px;
    border:1px solid #bcd9dc;
    border-radius:8px;
    background:#eff9f8;
    color:#14777c;
    text-decoration:none;
    font-size:12px;
    font-weight:900;
}


/* side */

.mysalary-v4-side-card{
    padding:19px;
}

.mysalary-v4-side-card h3{
    margin:0;
    color:#31566e;
    font-size:16px !important;
}

.mysalary-v4-connect{
    display:grid;
    gap:8px;
    margin-top:13px;
}

.mysalary-v4-connect > div{
    padding:12px;
    border:1px solid #e0eaee;
    border-radius:9px;
    background:#fbfcfd;
}

.mysalary-v4-connect span{
    display:inline-flex;
    padding:4px 7px;
    border-radius:999px;
    background:#e8f4f5;
    color:#367e84;
    font-size:9px;
    font-weight:900;
}

.mysalary-v4-connect p{
    margin:6px 0 0;
    color:#7d8d96;
    font-size:10px;
    line-height:1.55;
}

.mysalary-v4-security{
    margin-top:15px;
    padding:13px;
    border-radius:9px;
    background:#f1f6f8;
}

.mysalary-v4-security strong{
    color:#3e6277;
    font-size:12px;
}

.mysalary-v4-security p{
    margin:5px 0 0;
    color:#7a8d97;
    font-size:10px;
    line-height:1.6;
}


/* responsive */

@media(max-width:1000px){

    .mysalary-v4-grid{
        grid-template-columns:1fr;
    }

    .mysalary-v4-features{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}

@media(max-width:760px){

    .mysalary-v4-hero{
        flex-wrap:wrap;
        padding:18px;
    }

    .mysalary-v4-icon{
        width:55px;
        height:55px;
        flex-basis:55px;
    }

    .mysalary-v4-copy h1{
        font-size:26px !important;
    }

    .mysalary-v4-state{
        width:100%;
    }

    .mysalary-v4-main-card{
        padding:20px 15px;
    }

    .mysalary-v4-features{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   COMPANY WORKFLOW NAV V4.1
   ========================================================== */

.workspace-flow-v41{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:9px;
    margin:0 0 14px;
}

.workspace-flow-v41 > a{
    min-height:70px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:11px 13px;
    border:1px solid #d9e7ec;
    border-radius:11px;
    background:#fff;
    color:#496474;
    text-decoration:none;
    transition:.15s ease;
}

.workspace-flow-v41 > a:hover{
    transform:translateY(-1px);
    border-color:#9ecfd1;
    box-shadow:
        0 5px 16px
        rgba(44,78,101,.06);
}

.workspace-flow-v41 > a > span{
    width:35px;
    height:35px;
    flex:0 0 35px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    background:#e7f5f5;
    color:#168086;
    font-size:14px;
    font-weight:900;
}

.workspace-flow-v41 strong{
    display:block;
    color:#33566c;
    font-size:12px;
}

.workspace-flow-v41 small{
    display:block;
    margin-top:3px;
    color:#88969e;
    font-size:9px;
    line-height:1.4;
}

#workspace-a,
#workspace-b,
#workspace-c,
#workspace-d{
    scroll-margin-top:95px;
}

@media(max-width:950px){

    .workspace-flow-v41{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}

@media(max-width:600px){

    .workspace-flow-v41{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   EMPLOYEE CENTER UI V1
   ========================================================== */

.employee-center-v1-hero{
    display:flex;
    align-items:center;
    gap:18px;
    min-height:130px;
    margin-bottom:13px;
    padding:22px 25px;
    border:1px solid #d9e7ec;
    border-radius:16px;
    background:
        radial-gradient(
            circle at 80% 40%,
            rgba(190,232,230,.4),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f4fbfc
        );
}

.employee-center-v1-icon{
    width:65px;
    height:65px;
    flex:0 0 65px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:16px;
    background:#e3f4f4;
    color:#21868a;
    font-size:27px;
    font-weight:900;
}

.employee-center-v1-copy{
    flex:1;
}

.employee-center-v1-copy h1{
    margin:0;
    color:#204760;
    font-size:30px !important;
}

.employee-center-v1-copy p{
    max-width:740px;
    margin:7px 0 0;
    color:#758892;
    font-size:13px;
    line-height:1.65;
}

.employee-center-v1-company{
    min-width:185px;
    padding:13px 15px;
    border:1px solid #d9e7ec;
    border-radius:11px;
    background:rgba(255,255,255,.88);
}

.employee-center-v1-company span{
    display:block;
    color:#86959c;
    font-size:10px;
}

.employee-center-v1-company strong{
    display:block;
    margin-top:4px;
    color:#315b70;
    font-size:13px;
}


/* KPI */

.employee-center-v1-kpis{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:10px;
    margin-bottom:13px;
}

.employee-center-v1-kpi{
    min-height:83px;
    display:flex;
    align-items:center;
    padding:14px 17px;
    border:1px solid #dce7eb;
    border-radius:12px;
    background:#fff;
    color:#526e7d;
    text-decoration:none;
}

.employee-center-v1-kpi:hover{
    border-color:#aad3d4;
}

.employee-center-v1-kpi span{
    flex:1;
    font-size:12px;
    font-weight:800;
}

.employee-center-v1-kpi strong{
    color:#315c71;
    font-size:27px;
}

.employee-center-v1-kpi small{
    margin-left:4px;
    color:#88969d;
    font-size:10px;
}

.employee-center-v1-kpi.active strong{
    color:#287761;
}

.employee-center-v1-kpi.left strong{
    color:#8c6666;
}


/* toolbar */

.employee-center-v1-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:13px;
    padding:12px;
    border:1px solid #dde8ec;
    border-radius:12px;
    background:#fff;
}

.employee-center-v1-search{
    flex:1;
    display:flex;
    align-items:center;
    gap:8px;
}

.employee-center-v1-searchbox{
    flex:1;
    min-width:260px;
    display:flex;
    align-items:center;
    gap:6px;
    padding:0 10px;
    border:1px solid #d8e3e7;
    border-radius:8px;
    background:#fbfcfd;
}

.employee-center-v1-searchbox span{
    color:#7e939c;
}

.employee-center-v1-searchbox input{
    width:100%;
    min-height:39px;
    border:0 !important;
    background:transparent !important;
    outline:none;
    box-shadow:none !important;
}

.employee-center-v1-search select{
    min-height:41px;
}

.employee-center-v1-search button{
    min-height:41px;
}

.employee-center-v1-clear,
.employee-center-v1-toolbar-actions a{
    min-height:39px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 11px;
    border:1px solid #cbdde2;
    border-radius:8px;
    background:#fff;
    color:#37717a;
    text-decoration:none;
    font-size:10px;
    font-weight:800;
}

.employee-center-v1-toolbar-actions{
    display:flex;
    gap:7px;
}


/* table card */

.employee-center-v1-card{
    border:1px solid #dce7eb;
    border-radius:14px;
    background:#fff;
    overflow:hidden;
}

.employee-center-v1-card-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:15px;
    padding:16px 18px;
    border-bottom:1px solid #e4ecef;
}

.employee-center-v1-card-head h2{
    margin:0;
    color:#31566d;
    font-size:16px !important;
}

.employee-center-v1-card-head p{
    max-width:760px;
    margin:5px 0 0;
    color:#839098;
    font-size:10px;
    line-height:1.55;
}

.employee-center-v1-result-count{
    white-space:nowrap;
    color:#84939b;
    font-size:10px;
}

.employee-center-v1-result-count strong{
    margin:0 3px;
    color:#25878a;
    font-size:16px;
}

.employee-center-v1-table-wrap{
    overflow-x:auto;
}

.employee-center-v1-table{
    width:100%;
    border-collapse:collapse;
}

.employee-center-v1-table th{
    padding:10px 13px;
    border-bottom:1px solid #e4ecef;
    background:#f7fafb;
    color:#6e818b;
    text-align:left;
    font-size:10px;
}

.employee-center-v1-table td{
    padding:11px 13px;
    border-bottom:1px solid #edf1f3;
    color:#4d6572;
    font-size:11px;
    vertical-align:middle;
}

.employee-center-v1-table tbody tr:hover{
    background:#fbfdfd;
}

.employee-center-v1-empno{
    color:#557884 !important;
    font-weight:800;
}

.employee-center-v1-person{
    display:flex;
    align-items:center;
    gap:8px;
}

.employee-center-v1-avatar{
    width:31px;
    height:31px;
    flex:0 0 31px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#e7f4f4;
    color:#317d81;
    font-weight:900;
}

.employee-center-v1-person strong{
    color:#365c70;
}

.employee-center-v1-status{
    display:inline-flex;
    padding:4px 8px;
    border-radius:999px;
    font-size:9px;
    font-weight:900;
}

.employee-center-v1-status.active{
    background:#e6f5ee;
    color:#31745d;
}

.employee-center-v1-status.left{
    background:#f3ebeb;
    color:#8a5d5d;
}

.employee-center-v1-status.pause{
    background:#fff2dc;
    color:#956d25;
}

.employee-center-v1-open{
    display:inline-flex;
    align-items:center;
    min-height:31px;
    padding:0 9px;
    border:1px solid #b9d8da;
    border-radius:7px;
    background:#eff9f8;
    color:#18777b;
    text-decoration:none;
    font-size:9px;
    font-weight:900;
}

.employee-center-v1-muted{
    color:#a5afb4;
}

.employee-center-v1-empty{
    padding:45px 20px !important;
    text-align:center;
}

.employee-center-v1-empty > div{
    color:#83afb1;
    font-size:30px;
}

.employee-center-v1-empty strong{
    display:block;
    margin-top:8px;
    color:#556f7c;
}

.employee-center-v1-empty p{
    margin:5px 0 0;
    color:#8b989f;
}


/* responsive */

@media(max-width:900px){

    .employee-center-v1-hero{
        flex-wrap:wrap;
    }

    .employee-center-v1-company{
        width:100%;
    }

    .employee-center-v1-toolbar{
        align-items:stretch;
        flex-direction:column;
    }

    .employee-center-v1-toolbar-actions{
        justify-content:flex-end;
    }

}

@media(max-width:700px){

    .employee-center-v1-kpis{
        grid-template-columns:1fr;
    }

    .employee-center-v1-search{
        align-items:stretch;
        flex-direction:column;
    }

    .employee-center-v1-searchbox{
        min-width:0;
    }

    .employee-center-v1-toolbar-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
    }

}



/* ==========================================================
   A HEALTH FILES NAV UI V1
   ========================================================== */

.a-health-nav-v1{
    margin-bottom:14px;
    overflow:hidden;

    border:1px solid #d9e7ec;
    border-radius:14px;

    background:#fff;

    box-shadow:
        0 4px 15px
        rgba(44,78,101,.035);
}


/* header */

.a-health-nav-v1-head{
    min-height:66px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:14px;

    padding:11px 15px;

    border-bottom:
        1px solid #e4edef;

    background:
        linear-gradient(
            110deg,
            #fbfefe,
            #f1f9f9
        );
}


.a-health-nav-v1-brand{
    display:flex;
    align-items:center;

    gap:10px;
}


.a-health-nav-v1-letter{
    width:38px;
    height:38px;

    flex:0 0 38px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:10px;

    background:#def3f2;
    color:#147c81;

    font-size:15px;
    font-weight:900;
}


.a-health-nav-v1-brand strong{
    display:block;

    color:#294f66;

    font-size:15px;
}


.a-health-nav-v1-brand small{
    display:block;

    margin-top:3px;

    color:#83939b;

    font-size:10px;
}


/* actions */

.a-health-nav-v1-actions{
    display:flex;
    align-items:center;

    gap:7px;
}


.a-health-nav-v1-actions a{
    min-height:35px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:0 10px;

    border:
        1px solid #bddadd;

    border-radius:8px;

    background:#fff;

    color:#14767b;

    text-decoration:none;

    white-space:nowrap;

    font-size:10px;
    font-weight:900;
}


.a-health-nav-v1-actions a:hover{
    background:#edf8f7;
}


/* tabs */

.a-health-nav-v1-tabs{
    display:grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0,1fr)
        );
}


.a-health-nav-v1-tabs > a{
    min-height:67px;

    display:flex;
    align-items:center;

    gap:9px;

    padding:10px 13px;

    border-right:
        1px solid #e5edef;

    background:#fff;

    color:#566f7c;

    text-decoration:none;

    transition:.15s ease;
}


.a-health-nav-v1-tabs > a:last-child{
    border-right:0;
}


.a-health-nav-v1-tabs > a:hover{
    background:#f7fbfb;
}


.a-health-nav-v1-tabs > a.active{
    background:#eaf7f6;

    box-shadow:
        inset 0 -3px 0
        #248c8f;
}


.a-health-nav-v1-tabs > a > span{
    min-width:32px;
    height:32px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:8px;

    background:#edf4f6;

    color:#597482;

    font-size:10px;
    font-weight:900;
}


.a-health-nav-v1-tabs > a.active > span{
    background:#168589;
    color:#fff;
}


.a-health-nav-v1-tabs strong{
    display:block;

    color:#395b6f;

    font-size:12px;
}


.a-health-nav-v1-tabs small{
    display:block;

    margin-top:2px;

    color:#8b989f;

    font-size:9px;
}


/* responsive */

@media(max-width:1000px){

    .a-health-nav-v1-tabs{
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }

    .a-health-nav-v1-tabs > a{
        border-bottom:
            1px solid #e5edef;
    }

}


@media(max-width:700px){

    .a-health-nav-v1-head{
        align-items:flex-start;
        flex-direction:column;
    }

    .a-health-nav-v1-actions{
        width:100%;
    }

    .a-health-nav-v1-actions a{
        flex:1;
    }

    .a-health-nav-v1-tabs{
        grid-template-columns:1fr;
    }

    .a-health-nav-v1-tabs > a{
        border-right:0;
    }

}



/* ==========================================================
   A3 FOLLOWUPS UI V4
   ========================================================== */

.followups-v4-page{
    display:block;
}


/* HERO */

.followups-v4-hero{
    display:flex;
    align-items:center;
    gap:18px;

    min-height:138px;

    margin-bottom:13px;
    padding:22px 25px;

    border:1px solid #d9e7ec;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 79% 40%,
            rgba(196,232,222,.42),
            transparent 29%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f4fbfa
        );
}


.followups-v4-hero-icon{
    width:65px;
    height:65px;

    flex:0 0 65px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:17px;

    background:#e4f5ef;
    color:#27846c;

    font-size:27px;
    font-weight:900;
}


.followups-v4-hero-copy{
    flex:1;
}


.followups-v4-hero-copy h1{
    margin:0;

    color:#204760;

    font-size:30px !important;
}


.followups-v4-hero-copy p{
    max-width:720px;

    margin:7px 0 0;

    color:#758892;

    font-size:13px;
    line-height:1.65;
}


.followups-v4-hero-side{
    min-width:225px;

    display:grid;
    gap:10px;
}


.followups-v4-hero-side > div:first-child{
    padding:11px 13px;

    border:1px solid #d9e7ec;
    border-radius:10px;

    background:rgba(255,255,255,.88);
}


.followups-v4-hero-side span{
    display:block;

    color:#87959d;

    font-size:9px;
}


.followups-v4-hero-side strong{
    display:block;

    margin-top:3px;

    color:#345c70;

    font-size:12px;
}


.followups-v4-hero-actions{
    display:flex;

    gap:6px;
}


.followups-v4-hero-actions a{
    flex:1;

    min-height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0 8px;

    border:1px solid #bddadd;
    border-radius:7px;

    background:#fff;

    color:#18767b;

    text-decoration:none;

    font-size:9px;
    font-weight:900;
}


/* KPI */

.followups-v4-kpis{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:10px;

    margin-bottom:13px;
}


.followups-v4-kpi{
    min-height:104px;

    display:flex;
    align-items:center;

    gap:12px;

    padding:15px 17px;

    border:1px solid #dce7eb;
    border-radius:12px;

    background:#fff;
}


.followups-v4-kpi-icon{
    width:39px;
    height:39px;

    flex:0 0 39px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:10px;

    font-weight:900;
}


.followups-v4-kpi.suggestion
.followups-v4-kpi-icon{
    background:#fff2d9;
    color:#9a6a18;
}


.followups-v4-kpi.open
.followups-v4-kpi-icon{
    background:#e7f4f5;
    color:#37838a;
}


.followups-v4-kpi.overdue
.followups-v4-kpi-icon{
    background:#f9e7e7;
    color:#a05252;
}


.followups-v4-kpi > div:last-child{
    flex:1;
}


.followups-v4-kpi span{
    color:#748791;

    font-size:10px;
    font-weight:800;
}


.followups-v4-kpi strong{
    display:block;

    margin-top:3px;

    color:#345c70;

    font-size:25px;
}


.followups-v4-kpi strong small{
    margin-left:3px;

    color:#8a989f;

    font-size:9px;
}


.followups-v4-kpi p{
    margin:2px 0 0;

    color:#98a3a9;

    font-size:9px;
}


/* COMMON CARDS */

.followups-v4-page .card{
    margin-bottom:13px;

    padding:17px;

    border:1px solid #dce7eb;
    border-radius:13px;

    background:#fff;

    box-shadow:
        0 3px 12px
        rgba(44,78,101,.025);
}


.followups-v4-page .card h2{
    margin-top:0;

    color:#31566d;

    font-size:17px !important;
}


.followups-v4-page .card h3{
    color:#435f70;

    font-size:13px !important;
}


/* AUTO SUGGESTIONS */

.followups-v4-candidate{
    border-left:
        4px solid #d19a39 !important;

    background:
        linear-gradient(
            110deg,
            #fffefa,
            #fff
        ) !important;
}


.followups-v4-candidate > h2::before{
    content:"✦";

    display:inline-flex;

    margin-right:7px;

    color:#bd8727;
}


.followups-v4-candidate .notice{
    margin:9px 0 13px;

    padding:10px 12px;

    border:1px solid #eadfbe;
    border-radius:8px;

    background:#fffaf0;

    color:#776947;

    font-size:10px;
    line-height:1.6;
}


/* MANUAL ENTRY */

.followups-v4-manual{
    position:relative;
}


.followups-v4-manual > h2::before{
    content:"+";

    width:25px;
    height:25px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    margin-right:7px;

    border-radius:7px;

    background:#e7f5f3;
    color:#22827e;

    font-size:13px;
}


.followups-v4-page
input,

.followups-v4-page
select,

.followups-v4-page
textarea{
    border:
        1px solid #d7e2e6;

    border-radius:7px;

    background:#fff;
}


.followups-v4-page
button{
    min-height:38px;

    border-radius:7px;

    font-weight:800;
}


/* FILTER */

.followups-v4-filter{
    padding:12px !important;

    background:#f9fbfc !important;
}


.followups-v4-filter form{
    align-items:center;
}


.followups-v4-filter a{
    color:#33757b;

    font-size:10px;
    font-weight:800;
}


/* TABLE */

.followups-v4-records{
    padding:0 !important;

    overflow:hidden;
}


.followups-v4-records > h2{
    margin:0 !important;

    padding:15px 17px;

    border-bottom:
        1px solid #e4ecef;

    background:#fbfcfd;
}


.followups-v4-records
.follow-table{
    overflow-x:auto;
}


.followups-v4-records table,
.followups-v4-records.follow-table table{
    width:100%;

    min-width:1150px;

    border-collapse:collapse;
}


.followups-v4-records th{
    padding:10px 11px;

    border-bottom:
        1px solid #dfe8eb;

    background:#f4f8f9;

    color:#647984;

    text-align:left;

    font-size:9px;
}


.followups-v4-records td{
    padding:10px 11px;

    border-bottom:
        1px solid #edf1f3;

    color:#526a76;

    font-size:10px;

    vertical-align:top;
}


.followups-v4-records
tbody tr:hover{
    background:#fbfdfd;
}


.followups-v4-records textarea{
    min-width:220px;
}


.followups-v4-page .overdue{
    color:#a14646;

    font-weight:900;
}


.followups-v4-page .small{
    color:#7d8e97;

    font-size:10px;
}


/* candidate table */

.followups-v4-candidate table{
    width:100%;

    border-collapse:collapse;
}


.followups-v4-candidate th{
    padding:9px 10px;

    background:#faf7ee;

    color:#756b53;

    font-size:9px;

    text-align:left;
}


.followups-v4-candidate td{
    padding:9px 10px;

    border-bottom:
        1px solid #eee9dc;

    font-size:10px;

    vertical-align:top;
}


/* responsive */

@media(max-width:1000px){

    .followups-v4-hero{
        flex-wrap:wrap;
    }

    .followups-v4-hero-side{
        width:100%;
    }

}


@media(max-width:760px){

    .followups-v4-kpis{
        grid-template-columns:1fr;
    }

    .followups-v4-hero{
        padding:18px;
    }

    .followups-v4-hero-copy h1{
        font-size:25px !important;
    }

    .followups-v4-hero-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
    }

    .followups-v4-page .row{
        align-items:stretch;
        flex-direction:column;
    }

}



/* ==========================================================
   B OCCUPATIONAL NAV UI V1
   ========================================================== */

.b-health-nav-v1{
    margin-bottom:14px;

    overflow:hidden;

    border:1px solid #d9e7ec;
    border-radius:14px;

    background:#fff;

    box-shadow:
        0 4px 15px
        rgba(44,78,101,.035);
}


/* HEADER */

.b-health-nav-v1-head{
    min-height:67px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:14px;

    padding:11px 15px;

    border-bottom:
        1px solid #e4edef;

    background:
        linear-gradient(
            110deg,
            #fbfefe,
            #f2f8fb
        );
}


.b-health-nav-v1-brand{
    display:flex;
    align-items:center;

    gap:10px;
}


.b-health-nav-v1-letter{
    width:38px;
    height:38px;

    flex:0 0 38px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:10px;

    background:#e5f0f5;
    color:#397991;

    font-size:15px;
    font-weight:900;
}


.b-health-nav-v1-brand strong{
    display:block;

    color:#294f66;

    font-size:15px;
}


.b-health-nav-v1-brand small{
    display:block;

    margin-top:3px;

    color:#83939b;

    font-size:10px;
}


/* ACTIONS */

.b-health-nav-v1-actions{
    display:flex;
    align-items:center;

    gap:7px;
}


.b-health-nav-v1-actions a{
    min-height:35px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:0 10px;

    border:1px solid #bfd5df;
    border-radius:8px;

    background:#fff;

    color:#3d748a;

    text-decoration:none;

    white-space:nowrap;

    font-size:10px;
    font-weight:900;
}


.b-health-nav-v1-actions a:hover{
    background:#f0f7fa;
}


/* TABS */

.b-health-nav-v1-tabs{
    display:grid;

    grid-template-columns:
        repeat(
            7,
            minmax(0,1fr)
        );
}


.b-health-nav-v1-tabs > a{
    min-height:68px;

    display:flex;
    align-items:center;

    gap:8px;

    padding:9px 10px;

    border-right:
        1px solid #e5edef;

    background:#fff;

    color:#566f7c;

    text-decoration:none;

    transition:.15s ease;
}


.b-health-nav-v1-tabs > a:last-child{
    border-right:0;
}


.b-health-nav-v1-tabs > a:hover{
    background:#f7fafc;
}


.b-health-nav-v1-tabs > a.active{
    background:#edf6f9;

    box-shadow:
        inset 0 -3px 0
        #4c8ca3;
}


.b-health-nav-v1-tabs > a > span{
    min-width:31px;
    height:31px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:8px;

    background:#edf3f6;

    color:#607d8b;

    font-size:9px;
    font-weight:900;
}


.b-health-nav-v1-tabs > a.active > span{
    background:#477f96;
    color:#fff;
}


.b-health-nav-v1-tabs strong{
    display:block;

    color:#395b6f;

    font-size:10px;
    line-height:1.3;
}


.b-health-nav-v1-tabs small{
    display:block;

    margin-top:2px;

    color:#8b989f;

    font-size:8px;
    line-height:1.3;
}


/* ----------------------------------------------------------
   舊 global nav 已由 B NAV 取代
   ---------------------------------------------------------- */

.b-health-nav-v1
+ .occ-v4-global-nav{
    display:none;
}


/* RESPONSIVE */

@media(max-width:1250px){

    .b-health-nav-v1-tabs{
        grid-template-columns:
            repeat(
                4,
                minmax(0,1fr)
            );
    }

    .b-health-nav-v1-tabs > a{
        border-bottom:
            1px solid #e5edef;
    }

}


@media(max-width:850px){

    .b-health-nav-v1-tabs{
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }

}


@media(max-width:650px){

    .b-health-nav-v1-head{
        align-items:flex-start;
        flex-direction:column;
    }

    .b-health-nav-v1-actions{
        width:100%;
    }

    .b-health-nav-v1-actions a{
        flex:1;
    }

    .b-health-nav-v1-tabs{
        grid-template-columns:1fr;
    }

    .b-health-nav-v1-tabs > a{
        border-right:0;
    }

}



/* ==========================================================
   B1 OVERLOAD UI V4
   ========================================================== */

.overload-v4-hero{
    display:flex;
    align-items:center;
    gap:18px;

    min-height:140px;

    margin-bottom:13px;
    padding:22px 25px;

    border:1px solid #d9e7ec;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 81% 38%,
            rgba(247,218,165,.36),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #fffaf2
        );
}


.overload-v4-hero-icon{
    width:65px;
    height:65px;

    flex:0 0 65px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:17px;

    background:#fff0d3;
    color:#b77a18;

    font-size:27px;
    font-weight:900;
}


.overload-v4-copy{
    flex:1;
}


.overload-v4-copy h1{
    margin:0;

    color:#204760;

    font-size:30px !important;
}


.overload-v4-copy p{
    max-width:720px;

    margin:7px 0 0;

    color:#758892;

    font-size:13px;
    line-height:1.65;
}


.overload-v4-side{
    min-width:225px;

    display:grid;
    gap:10px;
}


.overload-v4-side > div:first-child{
    padding:11px 13px;

    border:1px solid #e4ddcf;
    border-radius:10px;

    background:rgba(255,255,255,.9);
}


.overload-v4-side span{
    display:block;

    color:#8c8d89;

    font-size:9px;
}


.overload-v4-side strong{
    display:block;

    margin-top:3px;

    color:#345c70;

    font-size:12px;
}


.overload-v4-links{
    display:flex;
    gap:6px;
}


.overload-v4-links a{
    flex:1;

    min-height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0 8px;

    border:1px solid #decda9;
    border-radius:7px;

    background:#fff;

    color:#8b6829;

    text-decoration:none;

    font-size:9px;
    font-weight:900;
}


/* 說明 */

.overload-v4-notice{
    margin-bottom:14px !important;

    padding:13px 15px !important;

    border:1px solid #e8dfc9 !important;
    border-left:4px solid #d19a39 !important;
    border-radius:10px !important;

    background:#fffaf0 !important;

    color:#71674e !important;

    font-size:10px !important;
    line-height:1.7 !important;
}


/* 年度統計 */

.overload-v4-yearly{
    margin-top:0 !important;

    padding:15px;

    border:1px solid #dce7eb;
    border-radius:13px;

    background:#fff;

    box-shadow:
        0 3px 12px
        rgba(44,78,101,.025);
}


.overload-v4-yearly
.oh-year-header{
    margin-bottom:7px;
}


.overload-v4-yearly
.oh-year-header > div{
    color:#617782;

    font-size:9px;
    font-weight:900;
}


.overload-v4-yearly
.oh-year-label{
    border-radius:9px;

    background:#b8832d;

    color:#fff;
}


.overload-v4-yearly
.oh-year-value{
    min-height:44px;

    border:1px solid #dce7eb;
    border-radius:9px;

    background:#fff;

    color:#365d70;

    font-size:18px;
    font-weight:900;

    text-decoration:none;
}


.overload-v4-yearly
.oh-year-value:hover{
    border-color:#dfc48f;
    background:#fffaf1;
}


/* 工具列 */

.overload-v4-tools{
    margin:13px 0 !important;

    padding:11px 12px;

    border:1px solid #dce7eb;
    border-radius:11px;

    background:#fff;
}


.overload-v4-tools a{
    min-height:37px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:0 11px;

    border:1px solid #c9dce2;
    border-radius:7px;

    background:#fff;

    color:#3d7483 !important;

    text-decoration:none;

    font-size:10px;
    font-weight:900;
}


.overload-v4-tools a.btn{
    border-color:#b88a37;

    background:#b88a37;

    color:#fff !important;
}


/* Excel import */

.overload-v4-import{
    margin-bottom:13px !important;

    padding:16px !important;

    border:1px solid #dce7eb !important;
    border-radius:12px !important;

    background:
        linear-gradient(
            110deg,
            #fff,
            #fbfcfd
        ) !important;
}


.overload-v4-import h2{
    margin-top:0;

    color:#31566d;

    font-size:16px !important;
}


.overload-v4-import .lang-note{
    margin-bottom:0;

    color:#7d8e96;

    font-size:10px;

    line-height:1.65;
}


/* 新增按鈕 */

.overload-add-trigger-wrap{
    margin:13px 0;
}


.overload-add-trigger-wrap
.oh-add-btn{
    min-height:42px;

    padding:0 15px;

    border-radius:8px;

    background:#b8842d !important;

    color:#fff !important;

    font-size:11px;
    font-weight:900;
}


/* 新增 panel */

.overload-v4-add-panel{
    margin-bottom:13px !important;

    padding:18px !important;

    border:1px solid #e1d5bb !important;
    border-radius:13px !important;

    background:
        linear-gradient(
            120deg,
            #fff,
            #fffaf2
        ) !important;
}


.overload-v4-add-panel h2{
    margin-top:0;

    color:#31566d;

    font-size:17px !important;
}


/* B1 全頁既有 cards */

.oh-page .card{
    border-radius:12px;
}


.oh-page input,
.oh-page select,
.oh-page textarea{
    border:1px solid #d7e2e6;

    border-radius:7px;
}


.oh-page input:focus,
.oh-page select:focus,
.oh-page textarea:focus{
    border-color:#d4af69;

    outline:none;

    box-shadow:
        0 0 0 2px
        rgba(185,132,45,.08);
}


/* 問卷 matrix */

.oh-page .matrix-wrap{
    border:1px solid #dce6e9;

    border-radius:10px;

    background:#fff;
}


.oh-page .qmatrix th{
    border-color:#d8e2e5 !important;

    background:#f2f6f7 !important;

    color:#526b77;
}


.oh-page .qmatrix td{
    border-color:#e1e8eb !important;

    color:#4d6572;
}


.oh-page .qmatrix tr:hover td{
    background:#fffdf8;
}


/* 歷史區 */

#overload-history{
    scroll-margin-top:110px;
}


#overload-history table{
    width:100%;

    border-collapse:collapse;
}


#overload-history th{
    padding:10px 11px;

    background:#f5f8f9;

    color:#647984;

    font-size:9px;
}


#overload-history td{
    padding:10px 11px;

    border-bottom:1px solid #edf1f3;

    color:#526a76;

    font-size:10px;
}


/* responsive */

@media(max-width:1000px){

    .overload-v4-hero{
        flex-wrap:wrap;
    }

    .overload-v4-side{
        width:100%;
    }

}


@media(max-width:760px){

    .overload-v4-hero{
        padding:18px;
    }

    .overload-v4-copy h1{
        font-size:25px !important;
    }

    .overload-v4-links{
        display:grid;
        grid-template-columns:1fr 1fr;
    }

    .overload-v4-tools{
        align-items:stretch !important;
        flex-direction:column;
    }

    .overload-v4-tools a{
        width:100%;
        box-sizing:border-box;
    }

    .oh-page .row{
        align-items:stretch;
        flex-direction:column;
    }

}



/* ==========================================================
   B2 NMQ UI V4
   ========================================================== */


/* MANAGEMENT HERO */

.nmq-v4-hero{
    display:flex;
    align-items:center;
    gap:18px;

    min-height:140px;

    margin-bottom:13px;
    padding:22px 25px;

    border:1px solid #d9e7ec;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 80% 40%,
            rgba(205,220,241,.5),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f4f8fc
        );
}


.nmq-v4-hero-icon{
    width:65px;
    height:65px;

    flex:0 0 65px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:17px;

    background:#e7eef8;
    color:#55799f;

    font-size:26px;
    font-weight:900;
}


.nmq-v4-copy{
    flex:1;
}


.nmq-v4-copy h1{
    margin:0;

    color:#204760;

    font-size:30px !important;
}


.nmq-v4-copy p{
    max-width:720px;

    margin:7px 0 0;

    color:#758892;

    font-size:13px;
    line-height:1.65;
}


.nmq-v4-side{
    min-width:225px;

    display:grid;
    gap:7px;
}


.nmq-v4-side > div:not(.nmq-v4-links){
    padding:9px 12px;

    border:1px solid #d9e3ea;
    border-radius:9px;

    background:rgba(255,255,255,.9);
}


.nmq-v4-side span{
    display:block;

    color:#89969d;

    font-size:9px;
}


.nmq-v4-side strong{
    display:block;

    margin-top:2px;

    color:#345c70;

    font-size:11px;
}


.nmq-v4-links{
    display:flex;
    gap:6px;
}


.nmq-v4-links a{
    flex:1;

    min-height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0 7px;

    border:1px solid #c8d8e4;
    border-radius:7px;

    background:#fff;

    color:#537695;

    text-decoration:none;

    font-size:9px;
    font-weight:900;
}


/* NOTICE */

.nmq-v4-notice{
    margin-bottom:14px !important;

    padding:13px 15px !important;

    border:1px solid #dce5ed !important;
    border-left:4px solid #6688ad !important;

    border-radius:10px !important;

    background:#f6f9fd !important;

    color:#627787 !important;

    font-size:10px !important;
    line-height:1.7 !important;
}


/* YEAR STATS */

.nmq-v4-yearly{
    margin-top:0 !important;

    padding:15px;

    border:1px solid #dce7eb;
    border-radius:13px;

    background:#fff;

    box-shadow:
        0 3px 12px
        rgba(44,78,101,.025);
}


.nmq-v4-yearly
.oh-year-header{
    margin-bottom:7px;
}


.nmq-v4-yearly
.oh-year-header > div{
    color:#607681;

    font-size:9px;
    font-weight:900;
}


.nmq-v4-yearly
.oh-year-label{
    border-radius:9px;

    background:#5b7fa1;

    color:#fff;
}


.nmq-v4-yearly
.oh-year-value{
    min-height:45px;

    border:1px solid #dce6ec;
    border-radius:9px;

    background:#fff;

    color:#365d70;

    font-size:19px;
    font-weight:900;

    text-decoration:none;
}


.nmq-v4-yearly
.oh-year-value:hover{
    border-color:#aebfd2;

    background:#f6f9fc;
}


/* ACTION CARD */

.nmq-v4-actions-card{
    margin:13px 0 !important;

    padding:11px 12px !important;

    border:1px solid #dce7eb !important;
    border-radius:11px !important;

    background:#fff !important;
}


.nmq-v4-actions-card
.oh-actions{
    margin:0;
}


.nmq-v4-actions-card a{
    min-height:38px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:0 12px;

    border:1px solid #c9dae4;
    border-radius:7px;

    background:#fff;

    color:#47748e !important;

    text-decoration:none;

    font-size:10px;
    font-weight:900;
}


.nmq-v4-actions-card
a.oh-add-btn{
    border-color:#547c9e;

    background:#547c9e;

    color:#fff !important;
}


/* HISTORY */

.nmq-v4-history{
    padding:0 !important;

    overflow:hidden;
}


.nmq-v4-history-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;

    gap:12px;

    padding:15px 17px;

    border-bottom:1px solid #e4ecef;

    background:#fbfcfd;
}


.nmq-v4-history-head h2{
    margin:0 !important;

    color:#31566d;

    font-size:17px !important;
}


.nmq-v4-history-head p{
    margin:4px 0 0;

    color:#85939a;

    font-size:9px;
}


.nmq-v4-history-head > span{
    padding:5px 8px;

    border-radius:999px;

    background:#edf3f7;

    color:#55778c;

    white-space:nowrap;

    font-size:9px;
    font-weight:900;
}


.nmq-v4-history > form{
    padding:12px 16px 0;
}


.nmq-v4-history
.oh-year-filter{
    margin-bottom:12px;
}


.nmq-v4-history
.oh-year-filter button{
    min-height:34px;

    border:1px solid #bfd0dc;

    border-radius:7px;

    background:#fff;

    color:#54778e;
}


.nmq-v4-history
.oh-year-filter button.active{
    border-color:#547c9e;

    background:#547c9e;

    color:#fff;
}


.nmq-v4-history table{
    width:100%;

    border-collapse:collapse;
}


.nmq-v4-history th{
    padding:10px 11px;

    border-bottom:1px solid #dfe8eb;

    background:#f4f8f9;

    color:#647984;

    text-align:left;

    font-size:9px;

    white-space:nowrap;
}


.nmq-v4-history td{
    padding:10px 11px;

    border-bottom:1px solid #edf1f3;

    color:#526a76;

    font-size:10px;

    vertical-align:top;
}


.nmq-v4-history tbody tr:hover{
    background:#fbfdfd;
}


.nmq-v4-history td .btn{
    min-height:29px;

    display:inline-flex;
    align-items:center;

    padding:0 7px;

    margin:1px;

    border-radius:6px;

    font-size:8px;
}


/* ==========================================================
   NMQ FORM / DETAIL
   ========================================================== */

.nmq-form-v4-hero{
    display:flex;
    align-items:center;

    gap:16px;

    min-height:115px;

    margin-bottom:13px;
    padding:18px 21px;

    border:1px solid #d9e5ec;
    border-radius:14px;

    background:
        linear-gradient(
            110deg,
            #fff,
            #f5f9fc
        );
}


.nmq-form-v4-icon{
    width:52px;
    height:52px;

    flex:0 0 52px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:13px;

    background:#e7eef8;
    color:#55799f;

    font-size:20px;
}


.nmq-form-v4-copy{
    flex:1;
}


.nmq-form-v4-copy h1{
    margin:0;

    color:#294f66;

    font-size:24px !important;
}


.nmq-form-v4-copy p{
    margin:5px 0 0;

    color:#7b8e98;

    font-size:10px;
}


.nmq-form-v4-actions a{
    min-height:35px;

    display:flex;
    align-items:center;

    padding:0 10px;

    border:1px solid #c4d7e1;
    border-radius:7px;

    background:#fff;

    color:#4d758b;

    text-decoration:none;

    font-size:9px;
    font-weight:900;
}


.nmq-form-v4-notice{
    margin-bottom:13px !important;

    border-left:4px solid #6688ad !important;

    background:#f6f9fd !important;
}


/* Existing NMQ score table */

.nmq-score-table{
    width:100% !important;

    border-collapse:collapse;

    background:#fff;
}


.nmq-score-table th{
    background:#f3f7f9 !important;

    color:#58707c !important;
}


.nmq-score-table th,
.nmq-score-table td{
    border-color:#dce5e9 !important;

    padding:10px !important;
}


.nmq-part{
    color:#365b70;

    font-weight:900;
}


.nmq-scores label{
    border-radius:7px;
}


.nmq-result{
    border:1px solid #d9e4eb !important;

    border-radius:11px !important;

    background:#f7fafc !important;
}


.nmq-result strong{
    color:#436e86;
}


/* Form cards */

.nmq-form-v4 .card{
    margin-bottom:13px;

    border:1px solid #dce7eb;

    border-radius:12px;

    box-shadow:
        0 3px 12px
        rgba(44,78,101,.025);
}


.nmq-form-v4 input,
.nmq-form-v4 select,
.nmq-form-v4 textarea{
    border:1px solid #d7e2e6;

    border-radius:7px;
}


.nmq-form-v4 input:focus,
.nmq-form-v4 select:focus,
.nmq-form-v4 textarea:focus{
    border-color:#8eabc1;

    outline:none;

    box-shadow:
        0 0 0 2px
        rgba(84,124,158,.08);
}


/* RESPONSIVE */

@media(max-width:1000px){

    .nmq-v4-hero{
        flex-wrap:wrap;
    }

    .nmq-v4-side{
        width:100%;
    }

}


@media(max-width:760px){

    .nmq-v4-hero{
        padding:18px;
    }

    .nmq-v4-copy h1{
        font-size:25px !important;
    }

    .nmq-v4-links{
        display:grid;
        grid-template-columns:1fr 1fr;
    }

    .nmq-form-v4-hero{
        align-items:flex-start;
        flex-wrap:wrap;
    }

    .nmq-form-v4-actions{
        width:100%;
    }

    .nmq-form-v4-actions a{
        justify-content:center;
    }

}



/* ==========================================================
   B3 MENTAL HEALTH UI V4
   ========================================================== */

.mental-v4-hero{
    display:flex;
    align-items:center;
    gap:18px;

    min-height:140px;

    margin-bottom:13px;
    padding:22px 25px;

    border:1px solid #d9e7ec;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 80% 40%,
            rgba(229,207,230,.45),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #faf5fb
        );
}


.mental-v4-hero-icon{
    width:65px;
    height:65px;

    flex:0 0 65px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:17px;

    background:#f2e8f3;
    color:#8b5a91;

    font-size:25px;
    font-weight:900;
}


.mental-v4-copy{
    flex:1;
}


.mental-v4-copy h1{
    margin:0 !important;

    color:#204760 !important;

    font-size:30px !important;
}


.mental-v4-copy p{
    max-width:720px;

    margin:7px 0 0;

    color:#758892;

    font-size:13px;
    line-height:1.65;
}


.mental-v4-side{
    min-width:225px;

    display:grid;
    gap:9px;
}


.mental-v4-side > div:first-child{
    padding:10px 12px;

    border:1px solid #e0d8e5;
    border-radius:9px;

    background:rgba(255,255,255,.9);
}


.mental-v4-side span{
    display:block;

    color:#8a9298;

    font-size:9px;
}


.mental-v4-side strong{
    display:block;

    margin-top:3px;

    color:#345c70;

    font-size:12px;
}


.mental-v4-links{
    display:flex;
    gap:6px;
}


.mental-v4-links a{
    flex:1;

    min-height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0 8px;

    border:1px solid #d2bfd6;
    border-radius:7px;

    background:#fff;

    color:#755b7d;

    text-decoration:none;

    font-size:9px;
    font-weight:900;
}


/* 說明 */

.mental-v4-notice{
    margin-bottom:14px !important;

    padding:13px 15px !important;

    border:1px solid #e4d9e7 !important;
    border-left:4px solid #9a6da0 !important;

    border-radius:10px !important;

    background:#fbf7fc !important;

    color:#6d6470 !important;

    font-size:10px !important;
    line-height:1.7 !important;
}


/* 年度統計 */

.mental-page .mh-yearly-stats{
    padding:15px;

    border:1px solid #dce7eb;
    border-radius:13px;

    background:#fff;

    box-shadow:
        0 3px 12px
        rgba(44,78,101,.025);
}


.mental-page .mh-year-label{
    background:#8d6494 !important;
}


.mental-page .mh-year-value{
    border-color:#e0d8e5 !important;

    color:#405f72 !important;
}


.mental-page .mh-year-value:hover{
    border-color:#cdb6d1 !important;

    background:#fcf8fc !important;
}


/* 統計卡 */

.mental-page .mh-stats{
    gap:10px !important;
}


.mental-page .mh-stats .card{
    border:1px solid #dce7eb !important;

    border-radius:12px !important;

    background:#fff !important;

    box-shadow:
        0 3px 12px
        rgba(44,78,101,.025) !important;
}


/* 操作按鈕 */

.mental-page .oh-actions,
.mental-page .mh-actions{
    padding:11px 12px;

    border:1px solid #dce7eb;
    border-radius:11px;

    background:#fff;
}


.mental-page .oh-actions a,
.mental-page .mh-actions a{
    border-radius:7px;
}


/* 新增區 */

.mental-v4-add-panel{
    border:1px solid #e0d6e4 !important;

    border-radius:13px !important;

    background:
        linear-gradient(
            120deg,
            #fff,
            #fbf7fc
        ) !important;
}


/* 一般 card */

.mental-page .card{
    border-radius:12px !important;
}


/* 表單 */

.mental-page input,
.mental-page select,
.mental-page textarea{
    border:1px solid #d7e2e6 !important;

    border-radius:7px !important;
}


.mental-page input:focus,
.mental-page select:focus,
.mental-page textarea:focus{
    border-color:#b79abb !important;

    outline:none;

    box-shadow:
        0 0 0 2px
        rgba(141,100,148,.08);
}


/* 表格 */

.mental-page table{
    width:100%;

    border-collapse:collapse;
}


.mental-page table th{
    padding:10px 11px;

    background:#f6f7f9;

    color:#647984;

    font-size:9px;

    white-space:nowrap;
}


.mental-page table td{
    padding:10px 11px;

    border-bottom:1px solid #edf1f3;

    color:#526a76;

    font-size:10px;

    vertical-align:top;
}


.mental-page table tbody tr:hover{
    background:#fcfafc;
}


/* Q15 優先提醒區若有既有警示 class */

.mental-page .danger,
.mental-page .alert,
.mental-page .warning{
    font-weight:900;
}


/* responsive */

@media(max-width:1000px){

    .mental-v4-hero{
        flex-wrap:wrap;
    }

    .mental-v4-side{
        width:100%;
    }

}


@media(max-width:760px){

    .mental-v4-hero{
        padding:18px;
    }

    .mental-v4-copy h1{
        font-size:25px !important;
    }

    .mental-v4-links{
        display:grid;

        grid-template-columns:
            1fr 1fr;
    }

    .mental-page .mh-stats{
        grid-template-columns:1fr !important;
    }

    .mental-page .row{
        align-items:stretch;
        flex-direction:column;
    }

}



/* ==========================================================
   B4 WORKPLACE VIOLENCE UI V4
   ========================================================== */

.violence-v4-hero,
.violence-self-v4-hero{
    min-height:138px;
    display:flex;
    align-items:center;
    gap:18px;
    margin-bottom:13px;
    padding:22px 25px;
    border:1px solid #d9e7ec;
    border-radius:16px;
    background:
        radial-gradient(
            circle at 80% 40%,
            rgba(235,205,205,.42),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #fcf6f6
        );
}

.violence-v4-icon,
.violence-self-v4-icon{
    width:65px;
    height:65px;
    flex:0 0 65px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:17px;
    background:#f6e8e8;
    color:#985f65;
    font-size:25px;
    font-weight:900;
}

.violence-v4-copy,
.violence-self-v4-copy{
    flex:1;
}

.violence-v4-copy h1,
.violence-self-v4-copy h1{
    margin:0 !important;
    color:#204760 !important;
    font-size:30px !important;
}

.violence-v4-copy p,
.violence-self-v4-copy p{
    max-width:720px;
    margin:7px 0 0;
    color:#758892;
    font-size:13px;
    line-height:1.65;
}

.violence-v4-side{
    min-width:225px;
    display:grid;
    gap:9px;
}

.violence-v4-side > div:first-child{
    padding:10px 12px;
    border:1px solid #e5d8d8;
    border-radius:9px;
    background:rgba(255,255,255,.9);
}

.violence-v4-side span{
    display:block;
    color:#89959b;
    font-size:9px;
}

.violence-v4-side strong{
    display:block;
    margin-top:3px;
    color:#345c70;
    font-size:12px;
}

.violence-v4-links,
.violence-self-v4-links{
    display:flex;
    gap:6px;
}

.violence-v4-links a,
.violence-self-v4-links a{
    min-height:35px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 10px;
    border:1px solid #dcc5c8;
    border-radius:7px;
    background:#fff;
    color:#875d63;
    text-decoration:none;
    font-size:9px;
    font-weight:900;
}

.violence-v4-links a{
    flex:1;
}


/* Summary */

.violence-v4-summary{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:10px;
    margin-bottom:13px;
}

.violence-v4-summary > div{
    min-height:92px;
    padding:14px 17px;
    border:1px solid #dce7eb;
    border-radius:12px;
    background:#fff;
}

.violence-v4-summary span{
    color:#758892;
    font-size:10px;
    font-weight:800;
}

.violence-v4-summary strong{
    display:block;
    margin-top:4px;
    color:#365d70;
    font-size:25px;
}

.violence-v4-summary strong.text{
    font-size:16px;
}

.violence-v4-summary strong small{
    font-size:9px;
    color:#89979e;
}

.violence-v4-summary p{
    margin:3px 0 0;
    color:#97a2a8;
    font-size:9px;
}


/* Notice */

.violence-v4-notice,
.violence-self-v4-notice,
.violence-form-v4-notice{
    border:1px solid #e5d9da !important;
    border-left:4px solid #a66b72 !important;
    border-radius:10px !important;
    background:#fcf7f7 !important;
    color:#716669 !important;
}


/* Main actions */

.violence-v4-actions{
    margin:13px 0 !important;
    padding:11px 12px;
    border:1px solid #dce7eb;
    border-radius:11px;
    background:#fff;
}


/* History */

.violence-v4-history{
    padding:0 !important;
    overflow:hidden;
}

.violence-v4-history-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:15px 17px;
    border-bottom:1px solid #e4ecef;
    background:#fbfcfd;
}

.violence-v4-history-head h2{
    margin:0 !important;
    color:#31566d;
    font-size:17px !important;
}

.violence-v4-history-head p{
    margin:4px 0 0;
    color:#87949b;
    font-size:9px;
}

.violence-v4-history-head > span{
    padding:5px 8px;
    border-radius:999px;
    background:#f3ebec;
    color:#855f64;
    font-size:9px;
    font-weight:900;
}


/* FORM */

.violence-form-v4-hero,
.violence-detail-v4-hero{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:13px;
    padding:18px 21px;
    border:1px solid #dce5e9;
    border-radius:14px;
    background:
        linear-gradient(
            110deg,
            #fff,
            #faf6f6
        );
}

.violence-form-v4-icon{
    width:52px;
    height:52px;
    flex:0 0 52px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:13px;
    background:#f4e8e9;
    color:#956168;
    font-size:20px;
}

.violence-form-v4-copy{
    flex:1;
}

.violence-form-v4-copy h1,
.violence-detail-v4-hero h1{
    margin:0;
    color:#294f66;
    font-size:23px !important;
}

.violence-form-v4-copy p,
.violence-detail-v4-hero p{
    margin:5px 0 0;
    color:#7c8d96;
    font-size:10px;
}

.violence-form-v4-back{
    min-height:35px;
    display:flex;
    align-items:center;
    padding:0 10px;
    border:1px solid #d6c2c5;
    border-radius:7px;
    background:#fff;
    color:#825c62;
    text-decoration:none;
    font-size:9px;
    font-weight:900;
}

.violence-form-v4 .card{
    margin-bottom:13px;
    border:1px solid #dce7eb;
    border-radius:12px;
}

.violence-form-v4 input,
.violence-form-v4 select,
.violence-form-v4 textarea{
    border:1px solid #d7e2e6;
    border-radius:7px;
}

.violence-form-v4 table{
    width:100%;
    border-collapse:collapse;
}

.violence-form-v4 th{
    background:#f5f8f9;
    color:#647984;
    font-size:9px;
}

.violence-form-v4 td{
    font-size:10px;
}


/* DETAIL */

.violence-detail-v4-risk{
    min-width:140px;
    padding:10px 13px;
    border:1px solid #e0d2d4;
    border-radius:9px;
    background:#fff;
    text-align:center;
}

.violence-detail-v4-risk span{
    display:block;
    color:#89949a;
    font-size:9px;
}

.violence-detail-v4-risk strong{
    display:block;
    margin-top:4px;
    color:#8f555e;
    font-size:14px;
}


/* Employee self yearly */

.violence-self-v4-yearly{
    padding:15px;
    border:1px solid #dce7eb;
    border-radius:13px;
    background:#fff;
}

.violence-self-v4-yearly
.oh-year-label{
    background:#96656b !important;
}

.violence-self-v4-history{
    border-radius:12px !important;
}

#violence-self-history{
    scroll-margin-top:110px;
}


/* Responsive */

@media(max-width:1000px){

    .violence-v4-hero,
    .violence-self-v4-hero{
        flex-wrap:wrap;
    }

    .violence-v4-side{
        width:100%;
    }

}

@media(max-width:760px){

    .violence-v4-summary{
        grid-template-columns:1fr;
    }

    .violence-v4-copy h1,
    .violence-self-v4-copy h1{
        font-size:25px !important;
    }

    .violence-self-v4-links{
        width:100%;
        display:grid;
        grid-template-columns:1fr 1fr;
    }

    .violence-form-v4-hero,
    .violence-detail-v4-hero{
        align-items:flex-start;
        flex-wrap:wrap;
    }

}



/* ==========================================================
   B5 MATERNAL HEALTH UI V4
   ========================================================== */

.maternal-v4-hero{
    display:flex;
    align-items:center;
    gap:18px;

    min-height:140px;

    margin-bottom:13px;
    padding:22px 25px;

    border:1px solid #d9e7ec;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 80% 40%,
            rgba(241,211,220,.46),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #fdf6f8
        );
}


.maternal-v4-icon{
    width:65px;
    height:65px;

    flex:0 0 65px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:17px;

    background:#f8e8ed;
    color:#a66579;

    font-size:29px;
    font-weight:900;
}


.maternal-v4-copy{
    flex:1;
}


.maternal-v4-copy h1{
    margin:0 !important;

    color:#204760 !important;

    font-size:30px !important;
}


.maternal-v4-copy p{
    max-width:720px;

    margin:7px 0 0;

    color:#758892;

    font-size:13px;
    line-height:1.65;
}


.maternal-v4-side{
    min-width:225px;

    display:grid;
    gap:9px;
}


.maternal-v4-side > div:first-child{
    padding:10px 12px;

    border:1px solid #e5d8dc;
    border-radius:9px;

    background:rgba(255,255,255,.9);
}


.maternal-v4-side span{
    display:block;

    color:#89959b;

    font-size:9px;
}


.maternal-v4-side strong{
    display:block;

    margin-top:3px;

    color:#345c70;

    font-size:12px;
}


.maternal-v4-links{
    display:flex;
    gap:6px;
}


.maternal-v4-links a{
    flex:1;

    min-height:35px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0 8px;

    border:1px solid #dfc3cc;
    border-radius:7px;

    background:#fff;

    color:#916073;

    text-decoration:none;

    font-size:9px;
    font-weight:900;
}


/* Summary */

.maternal-v4-summary{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:10px;

    margin-bottom:13px;
}


.maternal-v4-summary > div,
.maternal-v4-summary > a{
    min-height:98px;

    display:block;

    padding:14px 17px;

    border:1px solid #dce7eb;
    border-radius:12px;

    background:#fff;

    text-decoration:none;
}


.maternal-v4-summary > a:hover{
    border-color:#dfc1cb;

    background:#fdf9fa;
}


.maternal-v4-summary span{
    color:#758892;

    font-size:10px;
    font-weight:800;
}


.maternal-v4-summary strong{
    display:block;

    margin-top:4px;

    color:#365d70;

    font-size:25px;
}


.maternal-v4-summary strong.text{
    font-size:16px;
}


.maternal-v4-summary strong small{
    color:#89979e;

    font-size:9px;
}


.maternal-v4-summary p{
    margin:4px 0 0;

    color:#97a2a8;

    font-size:9px;
}


/* Notice */

.maternal-v4-notice{
    margin-bottom:13px !important;

    padding:13px 15px !important;

    border:1px solid #e7dadd !important;
    border-left:4px solid #ae7184 !important;

    border-radius:10px !important;

    background:#fdf8fa !important;

    color:#71676b !important;

    font-size:10px !important;
    line-height:1.7 !important;
}


/* Main action card */

.maternal-v4-actions-card{
    padding:11px 12px !important;

    border:1px solid #dce7eb !important;

    border-radius:11px !important;
}


.maternal-v4-actions{
    margin:0 !important;
}


/* Cases */

.maternal-v4-cases{
    padding:0 !important;

    overflow:hidden;
}


.maternal-v4-section-head{
    display:flex;

    align-items:flex-start;
    justify-content:space-between;

    gap:12px;

    padding:15px 17px;

    border-bottom:
        1px solid #e4ecef;

    background:#fbfcfd;
}


.maternal-v4-section-head h2{
    margin:0 !important;

    color:#31566d;

    font-size:17px !important;
}


.maternal-v4-section-head p{
    margin:4px 0 0;

    color:#87949b;

    font-size:9px;
}


.maternal-v4-section-head > span{
    padding:5px 8px;

    border-radius:999px;

    background:#f6e9ed;

    color:#936477;

    white-space:nowrap;

    font-size:9px;
    font-weight:900;
}


/* Tables */

.maternal-v4-page table,
.maternal-sub-v4-history table{
    width:100%;

    border-collapse:collapse;
}


.maternal-v4-page th,
.maternal-sub-v4-history th{
    padding:10px 11px;

    background:#f5f8f9;

    color:#647984;

    font-size:9px;

    white-space:nowrap;
}


.maternal-v4-page td,
.maternal-sub-v4-history td{
    padding:10px 11px;

    border-bottom:
        1px solid #edf1f3;

    color:#526a76;

    font-size:10px;

    vertical-align:top;
}


.maternal-v4-page
tbody tr:hover,

.maternal-sub-v4-history
tbody tr:hover{
    background:#fdfafb;
}


/* ==========================================================
   Maternal sub pages
   ========================================================== */

.maternal-sub-v4-hero{
    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:16px;

    min-height:115px;

    margin-bottom:13px;
    padding:18px 21px;

    border:1px solid #dce5e9;
    border-radius:14px;

    background:
        linear-gradient(
            110deg,
            #fff,
            #fdf7f9
        );
}


.maternal-sub-v4-hero h1{
    margin:0;

    color:#294f66;

    font-size:23px !important;
}


.maternal-sub-v4-hero p{
    max-width:690px;

    margin:5px 0 0;

    color:#7c8d96;

    font-size:10px;
}


.maternal-sub-v4-actions{
    display:flex;

    gap:6px;
}


.maternal-sub-v4-actions a{
    min-height:35px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0 10px;

    border:1px solid #dbc5cc;
    border-radius:7px;

    background:#fff;

    color:#885e6d;

    text-decoration:none;

    white-space:nowrap;

    font-size:9px;
    font-weight:900;
}


.maternal-sub-v4-toolbar{
    margin-bottom:13px !important;

    padding:11px 12px !important;

    border:1px solid #dce7eb !important;

    border-radius:11px !important;
}


.maternal-sub-v4-history{
    border:1px solid #dce7eb !important;

    border-radius:12px !important;

    overflow:hidden;
}


.maternal-sub-v4-history > h2{
    margin:0 !important;

    padding:15px 17px;

    border-bottom:
        1px solid #e4ecef;

    background:#fbfcfd;

    color:#31566d;

    font-size:17px !important;
}


/* Responsive */

@media(max-width:1000px){

    .maternal-v4-hero{
        flex-wrap:wrap;
    }

    .maternal-v4-side{
        width:100%;
    }

}


@media(max-width:760px){

    .maternal-v4-summary{
        grid-template-columns:1fr;
    }

    .maternal-v4-copy h1{
        font-size:25px !important;
    }

    .maternal-v4-links{
        display:grid;

        grid-template-columns:
            1fr 1fr;
    }

    .maternal-sub-v4-hero{
        align-items:flex-start;

        flex-direction:column;
    }

    .maternal-sub-v4-actions{
        width:100%;
    }

    .maternal-sub-v4-actions a{
        flex:1;
    }

}



/* ==========================================================
   B6 OLDER WORKER UI V4
   ========================================================== */

.older-v4-hero{
    display:flex;
    align-items:center;
    gap:18px;
    min-height:140px;
    margin-bottom:13px;
    padding:22px 25px;
    border:1px solid #d9e7ec;
    border-radius:16px;
    background:
        radial-gradient(
            circle at 80% 40%,
            rgba(203,225,219,.46),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f4faf8
        );
}

.older-v4-icon{
    width:65px;
    height:65px;
    flex:0 0 65px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:17px;
    background:#e5f2ee;
    color:#527e71;
    font-size:28px;
    font-weight:900;
}

.older-v4-copy{
    flex:1;
}

.older-v4-copy h1{
    margin:0 !important;
    color:#204760 !important;
    font-size:30px !important;
}

.older-v4-copy p{
    max-width:720px;
    margin:7px 0 0;
    color:#758892;
    font-size:13px;
    line-height:1.65;
}

.older-v4-side{
    min-width:225px;
    display:grid;
    gap:9px;
}

.older-v4-side > div:first-child{
    padding:10px 12px;
    border:1px solid #d5e4df;
    border-radius:9px;
    background:rgba(255,255,255,.9);
}

.older-v4-side span{
    display:block;
    color:#89959b;
    font-size:9px;
}

.older-v4-side strong{
    display:block;
    margin-top:3px;
    color:#345c70;
    font-size:12px;
}

.older-v4-links{
    display:flex;
    gap:6px;
}

.older-v4-links a{
    flex:1;
    min-height:35px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 8px;
    border:1px solid #bfd7cf;
    border-radius:7px;
    background:#fff;
    color:#53796f;
    text-decoration:none;
    font-size:9px;
    font-weight:900;
}


/* Summary */

.older-v4-summary{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:10px;
    margin-bottom:13px;
}

.older-v4-summary > div{
    min-height:98px;
    padding:14px 17px;
    border:1px solid #dce7eb;
    border-radius:12px;
    background:#fff;
}

.older-v4-summary span{
    color:#758892;
    font-size:10px;
    font-weight:800;
}

.older-v4-summary strong{
    display:block;
    margin-top:4px;
    color:#365d70;
    font-size:25px;
}

.older-v4-summary small{
    color:#89979e;
    font-size:9px;
}

.older-v4-summary p{
    margin:4px 0 0;
    color:#97a2a8;
    font-size:9px;
}


/* Notice */

.older-v4-notice,
.wai-v4-notice,
.older-clinical-v4-notice{
    border:1px solid #d9e5df !important;
    border-left:4px solid #668d80 !important;
    border-radius:10px !important;
    background:#f6fbf9 !important;
    color:#64756f !important;
}


/* Main */

.older-v4-actions-card{
    padding:11px 12px !important;
    border:1px solid #dce7eb !important;
    border-radius:11px !important;
}

.older-v4-actions{
    margin:0 !important;
}

.older-v4-workers{
    padding:0 !important;
    overflow:hidden;
}

.older-v4-section-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:15px 17px;
    border-bottom:1px solid #e4ecef;
    background:#fbfcfd;
}

.older-v4-section-head h2{
    margin:0 !important;
    color:#31566d;
    font-size:17px !important;
}

.older-v4-section-head p{
    margin:4px 0 0;
    color:#87949b;
    font-size:9px;
}

.older-v4-section-head > span{
    padding:5px 8px;
    border-radius:999px;
    background:#e9f3ef;
    color:#58796f;
    white-space:nowrap;
    font-size:9px;
    font-weight:900;
}

.older-v4-workers table{
    min-width:1050px;
}

.older-v4-page table{
    width:100%;
    border-collapse:collapse;
}

.older-v4-page th{
    padding:10px 11px;
    background:#f5f8f9;
    color:#647984;
    font-size:9px;
    white-space:nowrap;
}

.older-v4-page td{
    padding:10px 11px;
    border-bottom:1px solid #edf1f3;
    color:#526a76;
    font-size:10px;
    vertical-align:top;
}

.older-v4-page tbody tr:hover{
    background:#f9fcfb;
}

.older-v4-year-filter{
    border-radius:12px !important;
}


/* ==========================================================
   WAI FORM
   ========================================================== */

.wai-v4-hero,
.older-clinical-v4-hero,
.older-clinical-detail-v4-hero{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:13px;
    padding:18px 21px;
    border:1px solid #dce5e9;
    border-radius:14px;
    background:
        linear-gradient(
            110deg,
            #fff,
            #f5faf8
        );
}

.wai-v4-icon,
.older-clinical-v4-icon{
    width:52px;
    height:52px;
    flex:0 0 52px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:13px;
    background:#e5f2ee;
    color:#537e72;
    font-size:20px;
}

.wai-v4-copy,
.older-clinical-v4-copy{
    flex:1;
}

.wai-v4-copy h1,
.older-clinical-v4-copy h1,
.older-clinical-detail-v4-hero h1{
    margin:0;
    color:#294f66;
    font-size:23px !important;
}

.wai-v4-copy p,
.older-clinical-v4-copy p,
.older-clinical-detail-v4-hero p{
    margin:5px 0 0;
    color:#7c8d96;
    font-size:10px;
}

.wai-v4-back,
.older-clinical-v4-back{
    min-height:35px;
    display:flex;
    align-items:center;
    padding:0 10px;
    border:1px solid #bfd7cf;
    border-radius:7px;
    background:#fff;
    color:#56796f;
    text-decoration:none;
    white-space:nowrap;
    font-size:9px;
    font-weight:900;
}


/* WAI cards */

.wai-v4-form .card{
    margin-bottom:13px;
    border:1px solid #dce7eb;
    border-radius:12px;
}

.wai-v4-form .wai-options label{
    padding:7px 9px;
    margin:4px 5px 4px 0;
    border:1px solid #d7e3e0;
    border-radius:7px;
    background:#fff;
}

.wai-v4-form .wai-options label:hover{
    background:#f3f9f7;
}

.wai-v4-form .wai-disease label{
    padding:7px 9px;
    border-radius:7px;
}

.wai-v4-form .wai-score-box{
    border:1px solid #c9ddd6;
    border-radius:11px;
    background:#f4faf8;
}

.wai-v4-form .wai-score-box strong{
    color:#416f62;
}


/* ==========================================================
   CLINICAL FORM / DETAIL
   ========================================================== */

.older-clinical-v4-form .card{
    margin-bottom:13px;
    border:1px solid #dce7eb;
    border-radius:12px;
}

.older-clinical-v4-form input,
.older-clinical-v4-form select,
.older-clinical-v4-form textarea{
    border:1px solid #d7e2e6;
    border-radius:7px;
}

.older-clinical-v4-form table,
.older-clinical-detail-v4-hero
~ .card table{
    width:100%;
    border-collapse:collapse;
}

.older-clinical-v4-form th{
    background:#f5f8f9;
    color:#647984;
}

.older-clinical-detail-v4-result{
    min-width:150px;
    padding:10px 13px;
    border:1px solid #d5e3de;
    border-radius:9px;
    background:#fff;
    text-align:center;
}

.older-clinical-detail-v4-result span{
    display:block;
    color:#89949a;
    font-size:9px;
}

.older-clinical-detail-v4-result strong{
    display:block;
    margin-top:4px;
    color:#4d7468;
    font-size:14px;
}

.older-clinical-detail-v4-actions{
    border-radius:11px !important;
}


/* Responsive */

@media(max-width:1000px){

    .older-v4-hero{
        flex-wrap:wrap;
    }

    .older-v4-side{
        width:100%;
    }

}

@media(max-width:760px){

    .older-v4-summary{
        grid-template-columns:1fr;
    }

    .older-v4-copy h1{
        font-size:25px !important;
    }

    .older-v4-links{
        display:grid;
        grid-template-columns:1fr 1fr;
    }

    .wai-v4-hero,
    .older-clinical-v4-hero,
    .older-clinical-detail-v4-hero{
        align-items:flex-start;
        flex-wrap:wrap;
    }

    .wai-v4-back,
    .older-clinical-v4-back{
        width:100%;
        justify-content:center;
        box-sizing:border-box;
    }

}



/* ==========================================================
   EMPLOYEE HEALTH MASTER REPORT V1
   ========================================================== */

.health-master-v1{
    display:grid;
    gap:14px;
}


.health-master-hero{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;

    padding:22px 25px;

    border:1px solid #dbe6ea;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 82% 30%,
            rgba(196,226,220,.42),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f4faf8
        );
}


.health-master-hero h1{
    margin:0;

    color:#234d60;

    font-size:29px;
}


.health-master-hero p{
    margin:6px 0 0;

    color:#73868e;

    font-size:12px;
}


.health-master-actions{
    display:flex;
    gap:7px;
}


.health-master-actions a{
    min-height:38px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0 12px;

    border:1px solid #bfd4d2;
    border-radius:8px;

    background:#fff;

    color:#47746f;

    text-decoration:none;

    font-size:10px;
    font-weight:900;
}


.health-master-actions a.primary{
    border-color:#218b80;

    background:#218b80;

    color:#fff;
}


.health-master-alert{
    padding:12px 15px;

    border:1px solid #e2c873;
    border-left:4px solid #d29a33;

    border-radius:10px;

    background:#fffbed;

    color:#6f5d2d;

    font-size:11px;
}


.health-master-alert a{
    margin-left:10px;

    font-weight:900;
}


/* KPI */

.health-master-kpis{
    display:grid;

    grid-template-columns:
        repeat(6,minmax(0,1fr));

    gap:8px;
}


.health-master-kpis > div{
    min-height:88px;

    padding:12px;

    border:1px solid #dce7eb;
    border-radius:11px;

    background:#fff;
}


.health-master-kpis span{
    display:block;

    color:#7b8d94;

    font-size:9px;
    font-weight:800;
}


.health-master-kpis strong{
    display:block;

    margin-top:7px;

    color:#315e68;

    font-size:14px;
}


/* Sections */

.health-master-section{
    margin:0 !important;

    border:1px solid #dce7eb !important;

    border-radius:13px !important;
}


.health-master-section-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;

    gap:12px;

    margin-bottom:13px;
}


.health-master-section-head h2{
    margin:0 !important;

    color:#294f5e;

    font-size:18px !important;
}


.health-master-section-head p{
    margin:3px 0 0;

    color:#88969c;

    font-size:9px;
}


.health-master-section-head > a{
    font-size:9px;
    font-weight:900;
}


.health-master-status{
    padding:5px 9px;

    border-radius:999px;

    background:#e9f4f1;

    color:#47776d;

    font-size:9px;
    font-weight:900;
}


/* Exam */

.health-master-exam-summary{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:8px;

    margin-bottom:15px;
}


.health-master-exam-summary > div{
    display:grid;
    gap:4px;

    padding:11px;

    border:1px solid #e0e8eb;
    border-radius:9px;

    background:#fafcfc;
}


.health-master-exam-summary strong{
    color:#315c69;

    font-size:15px;
}


.health-master-exam-summary span{
    color:#697f87;

    font-size:9px;
}


.health-master-table-wrap{
    overflow-x:auto;
}


.health-master-table{
    width:100%;

    min-width:700px;

    border-collapse:collapse;
}


.health-master-table th{
    background:#f2f7f7;

    color:#58727b;

    font-size:9px;
}


.health-master-table td,
.health-master-table th{
    padding:9px 10px;

    border-bottom:1px solid #e5edef;

    vertical-align:top;
}


.health-master-table td{
    color:#4f6871;

    font-size:10px;
}


/* Main 2-col */

.health-master-two-col{
    display:grid;

    grid-template-columns:
        minmax(0,1.1fr)
        minmax(0,.9fr);

    gap:14px;
}


.health-master-stack{
    display:grid;

    gap:14px;
}


.health-master-radar{
    max-width:610px;

    margin:auto;
}


.health-master-radar svg{
    width:100%;

    height:auto;
}


.health-master-nmq-grid{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:6px;
}


.health-master-nmq-grid > div{
    display:flex;

    align-items:center;
    justify-content:space-between;

    padding:7px 9px;

    border:1px solid #dfe8eb;
    border-radius:7px;

    background:#fbfcfc;
}


.health-master-nmq-grid > div.alert{
    border-color:#e7b8a8;

    background:#fff4ef;
}


.health-master-nmq-grid span{
    color:#61767e;

    font-size:9px;
}


.health-master-nmq-grid strong{
    color:#365e68;

    font-size:12px;
}


.health-master-nmq-grid .alert strong{
    color:#a64f34;
}


.health-master-note{
    color:#819198;

    font-size:9px;
}


.health-master-result{
    display:flex;

    justify-content:space-between;
    align-items:center;

    gap:12px;

    margin-bottom:8px;

    padding:9px 11px;

    border-radius:8px;

    background:#f4f8f8;
}


.health-master-result strong{
    color:#365f68;
}


.health-master-result span{
    color:#7c8d94;

    font-size:9px;
}


.health-master-empty{
    padding:12px;

    border:1px dashed #cddadd;
    border-radius:8px;

    color:#7b8c93;

    font-size:10px;
}


.health-master-empty.warning{
    border-color:#e1c774;

    background:#fffbed;

    color:#7d6831;
}


/* Consult */

.health-master-consult-grid{
    display:grid;

    grid-template-columns:
        1fr 1fr;

    gap:18px;
}


.health-master-consult-grid h3{
    margin-top:0;
}


.health-master-consult-row{
    display:flex;

    justify-content:space-between;
    align-items:center;

    gap:10px;

    padding:8px 0;

    border-bottom:1px solid #edf1f2;
}


.health-master-consult-row div{
    display:grid;
}


.health-master-consult-row strong{
    color:#3f626d;

    font-size:10px;
}


.health-master-consult-row span{
    color:#87969c;

    font-size:9px;
}


.health-master-consult-row a{
    font-size:9px;
    font-weight:900;
}


/* Print rule */

.health-master-print-note{
    background:#f8fbfa !important;
}


.health-master-print-note > div{
    display:flex;

    flex-wrap:wrap;

    gap:8px;
}


.health-master-print-note span{
    padding:6px 9px;

    border-radius:7px;

    background:#eef3f4;

    color:#667a81;

    font-size:9px;
    font-weight:900;
}


.health-master-print-note span.ok{
    background:#e8f5f1;

    color:#397668;
}


.health-master-print-note span.warning{
    background:#fff5d9;

    color:#80652c;
}


@media(max-width:1100px){

    .health-master-kpis{
        grid-template-columns:
            repeat(3,1fr);
    }

}


@media(max-width:850px){

    .health-master-hero{
        align-items:flex-start;
        flex-direction:column;
    }

    .health-master-two-col{
        grid-template-columns:1fr;
    }

    .health-master-exam-summary{
        grid-template-columns:1fr;
    }

    .health-master-consult-grid{
        grid-template-columns:1fr;
    }

}


@media(max-width:650px){

    .health-master-kpis{
        grid-template-columns:
            repeat(2,1fr);
    }

    .health-master-actions{
        width:100%;
    }

    .health-master-actions a{
        flex:1;
    }

    .health-master-nmq-grid{
        grid-template-columns:
            repeat(2,1fr);
    }

}



/* ==========================================================
   HEALTH MANAGEMENT DASHBOARD INTEGRATED V1
   ========================================================== */

.hmd-v1-hero{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;

    margin-bottom:13px;
    padding:22px 25px;

    border:1px solid #d8e5e7;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 82% 32%,
            rgba(184,222,217,.45),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f2faf8
        );
}

.hmd-v1-hero h1{
    margin:0;
    color:#214d5c;
    font-size:30px;
}

.hmd-v1-hero p{
    margin:6px 0 0;
    color:#74878e;
    font-size:11px;
}

.hmd-v1-hero-actions{
    display:flex;
    gap:7px;
}

.hmd-v1-hero-actions a{
    min-height:38px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 12px;
    border:1px solid #bcd5d0;
    border-radius:8px;
    background:#fff;
    color:#39776f;
    text-decoration:none;
    font-size:9px;
    font-weight:900;
}

.hmd-v1-hero-actions a:first-child{
    border-color:#178b80;
    background:#178b80;
    color:#fff;
}


/* Filters */

.hmd-v1-filter{
    margin-bottom:13px !important;
}

.hmd-v1-filter form{
    display:grid;
    gap:9px;
}

.hmd-v1-filter form > div{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
}

.hmd-v1-filter strong{
    min-width:55px;
    color:#56717a;
    font-size:10px;
}

.hmd-v1-filter button{
    min-height:34px;
    padding:0 11px;
    border:1px solid #bfd2d6;
    border-radius:7px;
    background:#fff;
    color:#56747c;
    font-size:9px;
    font-weight:900;
    cursor:pointer;
}

.hmd-v1-filter button.active{
    border-color:#178b80;
    background:#178b80;
    color:#fff;
}


/* Cards */

.hmd-v1-grade-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-bottom:9px;
}

.hmd-v1-grade-grid > div,
.hmd-v1-metric-grid > div,
.hmd-v1-bp-grid > div{
    padding:13px 15px;
    border:1px solid #dce7ea;
    border-radius:11px;
    background:#fff;
}

.hmd-v1-grade-grid span,
.hmd-v1-metric-grid span,
.hmd-v1-bp-grid span{
    display:block;
    color:#71858c;
    font-size:9px;
    font-weight:800;
}

.hmd-v1-grade-grid strong,
.hmd-v1-metric-grid strong,
.hmd-v1-bp-grid strong{
    display:block;
    margin-top:5px;
    color:#315f68;
    font-size:24px;
}

.hmd-v1-grade-grid small{
    color:#96a1a5;
    font-size:8px;
}

.hmd-v1-metric-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px;
    margin-bottom:9px;
}

.hmd-v1-bp-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    margin-bottom:13px;
}


/* Charts */

.hmd-v1-charts{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:13px;
    margin-bottom:13px;
}

.hmd-v1-chart{
    margin:0 !important;
    border-radius:13px !important;
}

.hmd-v1-chart:last-child{
    grid-column:1 / -1;
}

.hmd-v1-section-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:13px;
}

.hmd-v1-section-head h2{
    margin:0 !important;
    color:#294f5d;
    font-size:18px !important;
}

.hmd-v1-section-head p{
    margin:4px 0 0;
    color:#89979d;
    font-size:9px;
}

.hmd-v1-year-chart{
    display:grid;
    grid-template-columns:70px 1fr;
    gap:10px;
    margin-bottom:14px;
}

.hmd-v1-year-chart > strong{
    color:#37636c;
    font-size:13px;
}

.hmd-v1-bar-row{
    display:grid;
    grid-template-columns:105px 1fr 38px;
    align-items:center;
    gap:8px;
    margin:6px 0;
}

.hmd-v1-bar-row > span{
    color:#647982;
    font-size:9px;
}

.hmd-v1-bar-row > b{
    color:#42656e;
    text-align:right;
    font-size:9px;
}

.hmd-v1-bar-track{
    height:11px;
    overflow:hidden;
    border-radius:999px;
    background:#edf3f3;
}

.hmd-v1-bar-track i{
    display:block;
    height:100%;
    min-width:0;
    border-radius:999px;
    background:#328f86;
}

.hmd-v1-age-row{
    display:grid;
    grid-template-columns:130px 1fr 230px;
    align-items:center;
    gap:10px;
    margin:10px 0;
}

.hmd-v1-age-row > div:first-child{
    display:grid;
}

.hmd-v1-age-row strong{
    color:#3d626c;
    font-size:10px;
}

.hmd-v1-age-row span{
    color:#7b8d94;
    font-size:9px;
}

.hmd-v1-age-detail{
    display:flex;
    gap:10px;
}


/* Annual consultation */

.hmd-v1-consult{
    margin-bottom:15px !important;
    border-radius:13px !important;
}

.hmd-v1-consult-summary{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
    margin-bottom:15px;
}

.hmd-v1-consult-summary > div{
    padding:11px;
    border:1px solid #dce7e9;
    border-radius:9px;
    background:#fafcfc;
}

.hmd-v1-consult-summary span{
    display:block;
    min-height:27px;
    color:#647a82;
    font-size:9px;
    font-weight:800;
}

.hmd-v1-consult-summary strong{
    display:block;
    margin-top:4px;
    color:#315f68;
    font-size:19px;
}

.hmd-v1-consult-summary small{
    display:block;
    margin-top:2px;
    color:#8a989d;
    font-size:8px;
}

.hmd-v1-rate{
    height:5px;
    margin-top:7px;
    overflow:hidden;
    border-radius:999px;
    background:#e8efef;
}

.hmd-v1-rate i{
    display:block;
    height:100%;
    background:#278b80;
}

.hmd-v1-consult-table-wrap{
    overflow-x:auto;
    margin-bottom:14px;
}

.hmd-v1-consult-table{
    width:100%;
    min-width:650px;
    border-collapse:collapse;
}

.hmd-v1-consult-table th{
    padding:9px;
    background:#eef5f5;
    color:#5c737c;
    font-size:9px;
}

.hmd-v1-consult-table td{
    padding:9px;
    border-bottom:1px solid #e7eeee;
    color:#526b74;
    font-size:10px;
}

.hmd-v1-other-add{
    margin-bottom:13px;
    padding:12px;
    border:1px solid #dce7e9;
    border-radius:9px;
    background:#f8fbfb;
}

.hmd-v1-other-add h3{
    margin:0 0 8px;
    color:#42636d;
    font-size:12px;
}

.hmd-v1-other-add form{
    display:grid;
    grid-template-columns:170px 1fr auto;
    gap:7px;
}

.hmd-v1-other-add input{
    min-height:36px;
    border:1px solid #cadadd;
    border-radius:7px;
    padding:0 10px;
}

.hmd-v1-consult-group{
    margin-top:8px;
    border:1px solid #dce7e9;
    border-radius:9px;
    background:#fff;
}

.hmd-v1-consult-group summary{
    display:flex;
    justify-content:space-between;
    gap:10px;
    padding:11px 13px;
    cursor:pointer;
}

.hmd-v1-consult-group summary strong{
    color:#3d626c;
    font-size:10px;
}

.hmd-v1-consult-group summary span{
    color:#7d8f96;
    font-size:9px;
}

.hmd-v1-consult-candidates{
    padding:0 13px 10px;
}

.hmd-v1-consult-person{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:8px 0;
    border-top:1px solid #edf1f2;
}

.hmd-v1-consult-person > div:first-child{
    display:grid;
}

.hmd-v1-consult-person > div:last-child{
    display:flex;
    align-items:center;
    gap:5px;
}

.hmd-v1-consult-person strong{
    color:#42636c;
    font-size:10px;
}

.hmd-v1-consult-person span{
    color:#7b8e95;
    font-size:9px;
}

.hmd-v1-consult-person form{
    margin:0;
}

.hmd-v1-consult-person .btn{
    min-height:30px;
    padding:0 7px;
    font-size:8px;
}

.hmd-v1-done{
    padding:4px 7px;
    border-radius:999px;
    background:#e6f4ee;
    color:#377463 !important;
    font-weight:900;
}

.hmd-v1-pending{
    padding:4px 7px;
    border-radius:999px;
    background:#fff2df;
    color:#8b692b !important;
    font-weight:900;
}

.hmd-v1-old-pending-title{
    margin:24px 0 10px;
    padding-top:17px;
    border-top:2px solid #dfe8ea;
}

.hmd-v1-old-pending-title h2{
    margin:0;
    color:#294f5d;
}

.hmd-v1-old-pending-title p{
    margin:4px 0 0;
    color:#87969c;
    font-size:9px;
}


@media(max-width:1050px){

    .hmd-v1-metric-grid{
        grid-template-columns:repeat(3,1fr);
    }

    .hmd-v1-consult-summary{
        grid-template-columns:repeat(2,1fr);
    }

}


@media(max-width:800px){

    .hmd-v1-hero{
        align-items:flex-start;
        flex-direction:column;
    }

    .hmd-v1-grade-grid,
    .hmd-v1-bp-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .hmd-v1-metric-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .hmd-v1-charts{
        grid-template-columns:1fr;
    }

    .hmd-v1-chart:last-child{
        grid-column:auto;
    }

    .hmd-v1-age-row{
        grid-template-columns:110px 1fr;
    }

    .hmd-v1-age-detail{
        grid-column:1 / -1;
    }

    .hmd-v1-other-add form{
        grid-template-columns:1fr;
    }

}


@media(max-width:560px){

    .hmd-v1-grade-grid,
    .hmd-v1-metric-grid,
    .hmd-v1-bp-grid,
    .hmd-v1-consult-summary{
        grid-template-columns:1fr 1fr;
    }

    .hmd-v1-consult-person{
        align-items:flex-start;
        flex-direction:column;
    }

    .hmd-v1-consult-person > div:last-child{
        flex-wrap:wrap;
    }

}



/* HEALTH DASHBOARD FILTER FIX V1 */

.hmd-v1-filter-form{
    display:block !important;
    margin:0;
}

.hmd-v1-filter-form + .hmd-v1-filter-form{
    margin-top:9px;
}

.hmd-v1-filter-form > div{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
}



/* ==========================================================
   GENERAL HEALTH EXAM LEGAL DUE V1
   ========================================================== */

.legal-exam-v1{
    margin-bottom:14px;
    padding:17px;

    border:1px solid #d9e6e8;
    border-radius:14px;

    background:#fff;
}


.legal-exam-v1-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;

    margin-bottom:12px;
}


.legal-exam-v1-head h2{
    margin:1px 0 0;

    color:#285261;

    font-size:18px;
}


.legal-exam-v1-head p{
    margin:5px 0 0;

    color:#7c8f96;

    font-size:9px;
}


.legal-exam-v1-kpis{
    display:grid;

    grid-template-columns:
        repeat(5,minmax(0,1fr));

    gap:8px;

    margin-bottom:13px;
}


.legal-exam-v1-kpis > div{
    padding:10px 12px;

    border:1px solid #dce7e9;
    border-radius:9px;

    background:#fafcfc;
}


.legal-exam-v1-kpis span{
    display:block;

    color:#74878e;

    font-size:9px;
}


.legal-exam-v1-kpis strong{
    display:block;

    margin-top:4px;

    color:#315e68;

    font-size:20px;
}


.legal-exam-v1-kpis .overdue{
    border-color:#edc2ba;

    background:#fff5f3;
}


.legal-exam-v1-kpis .overdue strong{
    color:#ad4d3d;
}


.legal-exam-v1-kpis .due{
    border-color:#ebd09b;

    background:#fff9eb;
}


.legal-exam-v1-kpis .due strong{
    color:#9a6b19;
}


.legal-exam-v1-kpis .upcoming{
    border-color:#bfd9e7;

    background:#f3f9fc;
}


.legal-exam-v1-table-wrap{
    overflow-x:auto;
}


.legal-exam-v1 table{
    width:100%;

    min-width:880px;

    border-collapse:collapse;
}


.legal-exam-v1 th{
    padding:9px;

    background:#f0f6f7;

    color:#5d747c;

    text-align:left;

    font-size:9px;

    white-space:nowrap;
}


.legal-exam-v1 td{
    padding:9px;

    border-bottom:1px solid #e8eeee;

    color:#526b74;

    font-size:9px;
}


.legal-exam-badge{
    display:inline-flex;

    align-items:center;

    min-height:25px;

    padding:0 8px;

    border-radius:999px;

    font-size:8px;

    font-weight:900;

    white-space:nowrap;
}


.legal-exam-badge.valid{
    background:#e7f4ef;
    color:#3c7768;
}


.legal-exam-badge.upcoming{
    background:#e9f4fa;
    color:#3f708b;
}


.legal-exam-badge.due{
    background:#fff1d5;
    color:#93671e;
}


.legal-exam-badge.overdue{
    background:#fce7e3;
    color:#a8493b;
}


.legal-exam-badge.missing,
.legal-exam-badge.unknown_age{
    background:#f1edf7;
    color:#725c86;
}


.legal-exam-row-overdue{
    background:#fffafa;
}


.legal-exam-v1-all-good{
    padding:11px;

    border:1px dashed #bad6cc;
    border-radius:8px;

    background:#f5fbf8;

    color:#4e786b;

    font-size:10px;
}


/* 個人 */

.legal-exam-person-v1{
    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:18px;

    margin-bottom:14px;
    padding:14px 16px;

    border:1px solid #d9e6e8;
    border-left:5px solid #529080;

    border-radius:11px;

    background:#f8fcfb;
}


.legal-exam-person-v1 > div:first-child{
    flex:1;
}


.legal-exam-person-v1 > div:first-child > span{
    color:#71868d;

    font-size:9px;
    font-weight:800;
}


.legal-exam-person-v1 > div:first-child > strong{
    display:block;

    margin-top:3px;

    color:#315f68;

    font-size:17px;
}


.legal-exam-person-v1 p{
    margin:5px 0 0;

    color:#71858c;

    font-size:9px;
}


.legal-exam-person-v1.overdue{
    border-left-color:#bc5948;
    background:#fff7f5;
}


.legal-exam-person-v1.overdue
> div:first-child > strong{
    color:#a94637;
}


.legal-exam-person-v1.due{
    border-left-color:#cf9a36;
    background:#fffaf0;
}


.legal-exam-person-v1.upcoming{
    border-left-color:#5597b4;
    background:#f5fbfe;
}


.legal-exam-person-v1.missing,
.legal-exam-person-v1.unknown_age{
    border-left-color:#806a96;
    background:#faf8fc;
}


.legal-exam-person-meta{
    display:grid;

    grid-template-columns:
        repeat(4,minmax(80px,1fr));

    gap:6px;
}


.legal-exam-person-meta > div{
    padding:8px 10px;

    border:1px solid #dce7e9;
    border-radius:8px;

    background:#fff;
}


.legal-exam-person-meta span{
    display:block;

    color:#839298;

    font-size:8px;
}


.legal-exam-person-meta strong{
    display:block;

    margin-top:2px;

    color:#41646d;

    font-size:10px;
}


@media(max-width:900px){

    .legal-exam-v1-kpis{
        grid-template-columns:
            repeat(2,1fr);
    }

    .legal-exam-person-v1{
        align-items:flex-start;
        flex-direction:column;
    }

    .legal-exam-person-meta{
        width:100%;

        grid-template-columns:
            repeat(2,1fr);
    }

}



/* ==========================================================
   DASHBOARD GENERAL EXAM LEGAL DUE V1
   ========================================================== */

.hmd-legal-v1{
    margin-bottom:13px !important;

    border:1px solid #dce7e9 !important;
    border-radius:13px !important;
}


.hmd-legal-v1-date{
    padding:5px 9px;

    border-radius:999px;

    background:#eef5f5;

    color:#537078;

    font-size:9px;
    font-weight:900;
}


.hmd-legal-v1-grid{
    display:grid;

    grid-template-columns:
        repeat(6,minmax(0,1fr));

    gap:8px;

    margin-bottom:13px;
}


.hmd-legal-v1-grid > div{
    min-height:90px;

    padding:11px 12px;

    border:1px solid #dce7e9;
    border-radius:10px;

    background:#fafcfc;
}


.hmd-legal-v1-grid span{
    display:block;

    min-height:24px;

    color:#70848b;

    font-size:9px;
    font-weight:800;
}


.hmd-legal-v1-grid strong{
    display:block;

    margin-top:3px;

    color:#315e68;

    font-size:23px;
}


.hmd-legal-v1-grid small{
    display:block;

    margin-top:3px;

    color:#929fa4;

    font-size:8px;
}


.hmd-legal-v1-grid .valid{
    background:#f5fbf8;
    border-color:#cde3da;
}


.hmd-legal-v1-grid .upcoming{
    background:#f4fafd;
    border-color:#c9e0eb;
}


.hmd-legal-v1-grid .due{
    background:#fffbf1;
    border-color:#ecd7a6;
}


.hmd-legal-v1-grid .due strong{
    color:#966a20;
}


.hmd-legal-v1-grid .overdue{
    background:#fff6f4;
    border-color:#edc9c1;
}


.hmd-legal-v1-grid .overdue strong{
    color:#ac4c3c;
}


.hmd-legal-v1-grid .missing,
.hmd-legal-v1-grid .unknown{
    background:#faf8fc;
    border-color:#ddd3e7;
}


.hmd-legal-v1-details{
    border:1px solid #dce7e9;
    border-radius:9px;
    overflow:hidden;
}


.hmd-legal-v1-details summary{
    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:10px;

    padding:11px 13px;

    background:#f7fafb;

    cursor:pointer;
}


.hmd-legal-v1-details summary strong{
    color:#3f626c;

    font-size:10px;
}


.hmd-legal-v1-details summary span{
    color:#7d8e95;

    font-size:9px;
}


.hmd-legal-v1-table-wrap{
    overflow-x:auto;
}


.hmd-legal-v1 table{
    width:100%;

    min-width:920px;

    border-collapse:collapse;
}


.hmd-legal-v1 th{
    padding:9px;

    background:#eef5f5;

    color:#5e747c;

    text-align:left;

    white-space:nowrap;

    font-size:9px;
}


.hmd-legal-v1 td{
    padding:9px;

    border-bottom:1px solid #e8eeee;

    color:#526a73;

    font-size:9px;
}


.hmd-legal-row-overdue{
    background:#fffafa;
}


.hmd-legal-row-due{
    background:#fffdf7;
}


.hmd-legal-v1-good{
    padding:11px;

    border:1px dashed #bfd9cf;
    border-radius:8px;

    background:#f5fbf8;

    color:#4c776a;

    font-size:10px;
}


@media(max-width:1100px){

    .hmd-legal-v1-grid{
        grid-template-columns:
            repeat(3,1fr);
    }

}


@media(max-width:650px){

    .hmd-legal-v1-grid{
        grid-template-columns:
            repeat(2,1fr);
    }

}



/* ==========================================================
   QR WORD EXPORT UI V1
   ========================================================== */

.qr-word-v1{
    border:1px solid #dce7e9 !important;
    border-radius:13px !important;
}


.qr-word-v1-head{
    margin-bottom:12px;
}


.qr-word-v1-head h2{
    margin:0 !important;

    color:#2b5361;

    font-size:18px !important;
}


.qr-word-v1-head p{
    margin:5px 0 0;

    color:#7c8e95;

    font-size:9px;
}


.qr-word-v1-grid{
    display:grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:12px;
}


.qr-word-v1-panel{
    padding:14px;

    border:1px solid #dce7e9;
    border-radius:10px;

    background:#fafcfc;
}


.qr-word-v1-panel h3{
    margin:0 0 10px;

    color:#365f69;

    font-size:14px;
}


.qr-word-v1-panel > p{
    color:#72868d;

    font-size:9px;
    line-height:1.7;
}


.qr-word-v1-panel label{
    display:block;

    color:#526e76;

    font-size:9px;
    font-weight:800;
}


.qr-word-v1-panel select{
    width:100%;

    min-height:38px;

    margin-top:5px;

    padding:0 9px;

    border:1px solid #c9dadd;
    border-radius:7px;

    background:#fff;
}


.qr-word-v1-modules{
    display:grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:6px;

    margin:12px 0;

    padding:10px;

    border:1px solid #dde7e9;
    border-radius:8px;

    background:#fff;
}


.qr-word-v1-modules > strong{
    grid-column:1 / -1;

    color:#42636c;

    font-size:9px;
}


.qr-word-v1-modules label{
    display:flex;

    align-items:center;

    gap:6px;

    padding:6px;

    border-radius:6px;

    font-weight:500;
}


.qr-word-v1-note{
    margin:9px 0;

    color:#819197 !important;

    font-size:8px !important;
}


.qr-word-v1-panel .btn{
    margin-top:8px;
}


@media(max-width:800px){

    .qr-word-v1-grid{
        grid-template-columns:1fr;
    }

}


@media(max-width:520px){

    .qr-word-v1-modules{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   ANNUAL CONSULTATION MANAGEMENT V1
   ========================================================== */

.annual-consult-v1-hero{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;

    margin-bottom:13px;
    padding:22px 24px;

    border:1px solid #d8e6e7;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 85% 30%,
            rgba(191,225,219,.46),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3faf8
        );
}


.annual-consult-v1-hero h1{
    margin:0;
    color:#28515e;
    font-size:29px;
}


.annual-consult-v1-hero p{
    max-width:650px;
    margin:6px 0 0;
    color:#74868d;
    font-size:10px;
    line-height:1.7;
}


.annual-consult-v1-hero-actions{
    display:flex;
    gap:7px;
}


.annual-consult-v1-hero-actions a{
    display:flex;
    align-items:center;
    min-height:37px;
    padding:0 11px;

    border:1px solid #bdd5d1;
    border-radius:8px;

    background:#fff;
    color:#39746e;

    font-size:9px;
    font-weight:900;
    text-decoration:none;
}


.annual-consult-v1-kpis{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:9px;
    margin-bottom:13px;
}


.annual-consult-v1-kpis > div{
    padding:13px 15px;

    border:1px solid #dce7e9;
    border-radius:11px;

    background:#fff;
}


.annual-consult-v1-kpis span{
    display:block;
    color:#71858c;
    font-size:9px;
    font-weight:800;
}


.annual-consult-v1-kpis strong{
    display:inline-block;
    margin-top:4px;

    color:#315f68;
    font-size:26px;
}


.annual-consult-v1-kpis small{
    margin-left:4px;
    color:#94a0a4;
    font-size:8px;
}


.annual-consult-v1-kpis .done{
    background:#f6fbf8;
}


.annual-consult-v1-kpis .pending{
    background:#fffaf0;
}


.annual-consult-v1-kpis .pending strong{
    color:#9a6c20;
}


.annual-consult-v1-kpis .rate{
    background:#f4fafb;
}


.annual-consult-v1-filter{
    margin-bottom:13px !important;
}


.annual-consult-v1-filter form{
    display:grid;
    gap:9px;
}


.annual-consult-v1-filter form > div{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
}


.annual-consult-v1-filter strong{
    min-width:50px;
    color:#627982;
    font-size:9px;
}


.annual-consult-v1-filter a{
    padding:6px 9px;

    border:1px solid #cbdadd;
    border-radius:7px;

    background:#fff;
    color:#637a82;

    font-size:8px;
    font-weight:800;
    text-decoration:none;
}


.annual-consult-v1-filter a.active{
    border-color:#25897f;
    background:#25897f;
    color:#fff;
}


.annual-consult-v1-group{
    margin-bottom:12px !important;
    border-radius:13px !important;
}


.annual-consult-v1-group-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;

    margin-bottom:10px;
}


.annual-consult-v1-group-head h2{
    margin:0 !important;
    color:#315763;
    font-size:17px !important;
}


.annual-consult-v1-group-head p{
    margin:4px 0 0;
    color:#7e8f95;
    font-size:9px;
}


.annual-consult-v1-group-rate{
    text-align:right;
}


.annual-consult-v1-group-rate strong{
    display:block;
    color:#25877d;
    font-size:20px;
}


.annual-consult-v1-group-rate span{
    color:#849399;
    font-size:8px;
}


.annual-consult-v1-case{
    display:grid;

    grid-template-columns:
        minmax(190px,1.2fr)
        minmax(190px,1.4fr)
        110px
        minmax(300px,1.7fr);

    align-items:center;
    gap:12px;

    padding:11px 0;

    border-top:1px solid #e9eeee;
}


.annual-consult-v1-case.completed{
    opacity:.82;
}


.annual-consult-v1-person{
    display:flex;
    align-items:center;
    gap:9px;
}


.annual-consult-v1-avatar{
    width:34px;
    height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#e5f1ef;
    color:#3c756d;

    font-weight:900;
}


.annual-consult-v1-person > div:last-child{
    display:grid;
}


.annual-consult-v1-person strong{
    color:#3d606a;
    font-size:10px;
}


.annual-consult-v1-person span{
    color:#849298;
    font-size:8px;
}


.annual-consult-v1-source{
    display:grid;
}


.annual-consult-v1-source span{
    color:#8b999e;
    font-size:8px;
}


.annual-consult-v1-source strong{
    margin-top:2px;
    color:#586f77;
    font-size:9px;
    line-height:1.55;
}


.annual-consult-v1-status{
    display:grid;
}


.annual-consult-v1-status > span{
    display:inline-flex;
    justify-self:start;

    padding:5px 8px;
    border-radius:999px;

    font-size:8px;
    font-weight:900;
}


.annual-consult-v1-status .done{
    background:#e5f3ec;
    color:#397766;
}


.annual-consult-v1-status .pending{
    background:#fff0d3;
    color:#93681e;
}


.annual-consult-v1-status small{
    margin-top:3px;
    color:#8c999d;
    font-size:7px;
}


.annual-consult-v1-actions{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:5px;
}


.annual-consult-v1-actions a,
.annual-consult-v1-actions button{
    min-height:30px;
    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:0 7px;

    border:1px solid #c3d5d7;
    border-radius:7px;

    background:#fff;
    color:#527078;

    font-size:8px;
    font-weight:800;
    text-decoration:none;

    cursor:pointer;
}


.annual-consult-v1-actions a.primary{
    border-color:#21877d;
    background:#21877d;
    color:#fff;
}


.annual-consult-v1-actions form{
    margin:0;
}


.annual-consult-v1-empty{
    padding:16px;
    color:#849499;
    text-align:center;
    font-size:10px;
}


.annual-consult-source-notice{
    margin-bottom:12px;
    padding:9px 11px;

    border:1px solid #bedbd4;
    border-radius:8px;

    background:#f3faf7;
    color:#50746b;

    font-size:9px;
}


@media(max-width:1100px){

    .annual-consult-v1-case{
        grid-template-columns:
            1fr 1fr;
    }

    .annual-consult-v1-actions{
        justify-content:flex-start;
    }

}


@media(max-width:750px){

    .annual-consult-v1-hero{
        align-items:flex-start;
        flex-direction:column;
    }

    .annual-consult-v1-kpis{
        grid-template-columns:
            repeat(2,1fr);
    }

    .annual-consult-v1-case{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   CONSULTATION CASE INTEGRATED V1
   ========================================================== */

.consult-case-v1-hero{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;

    margin-bottom:12px;
    padding:20px 23px;

    border:1px solid #d8e5e7;
    border-radius:15px;

    background:
        radial-gradient(
            circle at 84% 30%,
            rgba(188,224,217,.48),
            transparent 31%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3faf8
        );
}


.consult-case-v1-person{
    display:flex;
    align-items:center;
    gap:13px;
}


.consult-case-v1-avatar{
    width:54px;
    height:54px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#dcefeb;
    color:#37756d;

    font-size:22px;
    font-weight:900;
}


.consult-case-v1-hero h1{
    margin:0;
    color:#28515e;
    font-size:28px;
}


.consult-case-v1-hero p{
    margin:4px 0 0;
    color:#778a91;
    font-size:9px;
}


.consult-case-v1-hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}


.consult-case-v1-hero-actions a{
    min-height:36px;

    display:flex;
    align-items:center;

    padding:0 10px;

    border:1px solid #bfd5d2;
    border-radius:8px;

    background:#fff;
    color:#3e746f;

    font-size:8px;
    font-weight:900;
    text-decoration:none;
}


.consult-case-v1-hero-actions a:first-child{
    border-color:#23877e;
    background:#23877e;
    color:#fff;
}


/* KPI */

.consult-case-v1-kpis{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:7px;
    margin-bottom:12px;
}


.consult-case-v1-kpis > div{
    padding:11px 12px;

    border:1px solid #dce7e9;
    border-radius:10px;

    background:#fff;
}


.consult-case-v1-kpis span{
    display:block;
    min-height:22px;

    color:#73868d;
    font-size:8px;
}


.consult-case-v1-kpis strong{
    color:#315e68;
    font-size:22px;
}


.consult-case-v1-kpis small{
    margin-left:3px;
    color:#8f9ca0;
    font-size:8px;
}


.consult-case-v1-kpis .done{
    background:#f5fbf8;
}


.consult-case-v1-kpis .pending{
    background:#fff9ee;
}


.consult-case-v1-kpis .pending strong{
    color:#95691d;
}


/* Year */

.consult-case-v1-year{
    display:flex;
    align-items:center;
    gap:6px;
    margin-bottom:12px !important;
}


.consult-case-v1-year strong{
    margin-right:5px;
    color:#607780;
    font-size:9px;
}


.consult-case-v1-year a{
    padding:6px 10px;

    border:1px solid #c8d9dc;
    border-radius:7px;

    color:#617981;
    font-size:8px;
    font-weight:900;
    text-decoration:none;
}


.consult-case-v1-year a.active{
    border-color:#21877d;
    background:#21877d;
    color:#fff;
}


/* main columns */

.consult-case-v1-columns{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:12px;
}


.consult-case-v1-section{
    margin-bottom:12px !important;
    border-radius:12px !important;
}


.consult-case-v1-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;

    margin-bottom:10px;
}


.consult-case-v1-head h2{
    margin:0 !important;
    color:#315763;
    font-size:16px !important;
}


.consult-case-v1-head p{
    margin:4px 0 0;
    color:#839399;
    font-size:8px;
}


.consult-case-v1-head > a{
    padding:5px 8px;

    border:1px solid #c6d8da;
    border-radius:7px;

    color:#55747a;
    text-decoration:none;
    font-size:8px;
    font-weight:900;
}


/* annual */

.consult-case-v1-annual-item{
    display:grid;

    grid-template-columns:
        minmax(150px,1fr)
        90px
        minmax(240px,1.2fr);

    align-items:center;
    gap:9px;

    padding:9px 0;

    border-top:1px solid #e9eeee;
}


.consult-case-v1-annual-item:first-child{
    border-top:0;
}


.consult-case-v1-annual-item > div:first-child{
    display:grid;
}


.consult-case-v1-annual-item strong{
    color:#46656e;
    font-size:9px;
}


.consult-case-v1-annual-item span{
    color:#809096;
    font-size:8px;
}


.consult-case-v1-actions{
    display:flex;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:4px;
}


.consult-case-v1-actions a{
    min-height:28px;

    display:flex;
    align-items:center;

    padding:0 6px;

    border:1px solid #c9d8da;
    border-radius:6px;

    color:#58737a;

    font-size:7px;
    font-weight:800;
    text-decoration:none;
}


.consult-case-v1-actions a.primary{
    border-color:#26897f;
    background:#26897f;
    color:#fff;
}


/* badges */

.consult-case-v1-badge{
    display:inline-flex;

    padding:4px 7px;

    border-radius:999px;

    font-size:7px;
    font-weight:900;
    white-space:nowrap;
}


.consult-case-v1-badge.done{
    background:#e6f3ed;
    color:#397465;
}


.consult-case-v1-badge.pending{
    background:#fff0d4;
    color:#8f671f;
}


/* exam */

.consult-case-v1-exam-kpis{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:6px;
    margin-bottom:10px;
}


.consult-case-v1-exam-kpis > div{
    padding:8px;

    border:1px solid #e0e8ea;
    border-radius:7px;

    background:#fafcfc;
}


.consult-case-v1-exam-kpis span{
    display:block;
    color:#87959a;
    font-size:7px;
}


.consult-case-v1-exam-kpis strong{
    display:block;
    margin-top:2px;

    color:#47666e;
    font-size:9px;
}


.consult-case-v1-subtitle{
    margin:12px 0 6px;

    color:#536f77;
    font-size:11px;
}


.consult-case-v1-abnormal{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:6px;
}


.consult-case-v1-abnormal > div{
    padding:8px;

    border:1px solid #edd7cf;
    border-radius:7px;

    background:#fff9f7;
}


.consult-case-v1-abnormal strong,
.consult-case-v1-abnormal span,
.consult-case-v1-abnormal small{
    display:block;
}


.consult-case-v1-abnormal strong{
    color:#75564e;
    font-size:8px;
}


.consult-case-v1-abnormal span{
    margin-top:2px;
    color:#9b5546;
    font-size:10px;
    font-weight:900;
}


.consult-case-v1-abnormal small{
    margin-top:2px;
    color:#99827b;
    font-size:7px;
}


/* questionnaires */

.consult-case-v1-questionnaires > div{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;

    padding:8px 0;

    border-top:1px solid #e9eeee;
}


.consult-case-v1-questionnaires > div:first-child{
    border-top:0;
}


.consult-case-v1-questionnaires > div > div{
    display:grid;
}


.consult-case-v1-questionnaires strong{
    color:#486871;
    font-size:9px;
}


.consult-case-v1-questionnaires span{
    color:#849399;
    font-size:8px;
}


.consult-case-v1-questionnaires b{
    color:#397168;
    font-size:8px;
}


/* legal */

.consult-case-v1-legal{
    padding:10px;

    border:1px solid #dce6e8;
    border-radius:8px;

    background:#fafcfc;
}


.consult-case-v1-legal > strong{
    display:block;

    margin:8px 0;

    color:#657980;
    font-size:8px;
    line-height:1.6;
}


.consult-case-v1-legal > div{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:5px;
}


.consult-case-v1-legal > div > span{
    display:grid;

    padding:6px;

    border-radius:6px;
    background:#fff;

    color:#8a989d;
    font-size:7px;
}


.consult-case-v1-legal b{
    margin-top:2px;
    color:#496871;
    font-size:9px;
}


/* history */

.consult-case-v1-history > a{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;

    padding:8px 0;

    border-top:1px solid #e8eeee;

    text-decoration:none;
}


.consult-case-v1-history > a:first-child{
    border-top:0;
}


.consult-case-v1-history > a > div{
    display:grid;
}


.consult-case-v1-history strong{
    color:#4a6871;
    font-size:8px;
}


.consult-case-v1-history span{
    color:#627a82;
    font-size:9px;
    font-weight:800;
}


.consult-case-v1-history small{
    color:#8b989d;
    font-size:7px;
}


.consult-case-v1-more{
    display:inline-block;
    margin-top:8px;

    color:#39786f;
    font-size:8px;
    font-weight:900;
}


/* followups */

.consult-case-v1-followups > div{
    display:flex;
    justify-content:space-between;
    gap:10px;
    align-items:center;

    padding:8px 0;

    border-top:1px solid #e8eeee;
}


.consult-case-v1-followups > div:first-child{
    border-top:0;
}


.consult-case-v1-followups > div > div{
    display:grid;
}


.consult-case-v1-followups strong{
    color:#4d6971;
    font-size:8px;
}


.consult-case-v1-followups span{
    color:#849399;
    font-size:7px;
}


/* timeline */

.consult-case-v1-timeline{
    margin-top:0 !important;
}


.consult-case-v1-timeline-row{
    display:grid;

    grid-template-columns:
        14px
        90px
        1fr
        90px;

    gap:9px;
    align-items:start;

    position:relative;

    padding:10px 0;

    border-top:1px solid #e9eeee;
}


.consult-case-v1-timeline-row:first-child{
    border-top:0;
}


.consult-case-v1-timeline-dot{
    width:8px;
    height:8px;

    margin-top:5px;

    border:2px solid #21887e;
    border-radius:50%;

    background:#fff;
}


.consult-case-v1-timeline-date{
    padding-top:2px;

    color:#71868d;
    font-size:8px;
    font-weight:800;
}


.consult-case-v1-timeline-type{
    color:#27847b;
    font-size:7px;
    font-weight:900;
}


.consult-case-v1-timeline-row strong{
    color:#4b666f;
    font-size:9px;
}


.consult-case-v1-timeline-row p{
    margin:3px 0 0;

    color:#77898f;
    font-size:8px;
    white-space:pre-wrap;
}


.consult-case-v1-timeline-row > div:last-child{
    display:grid;
    justify-items:end;
    gap:4px;
}


.consult-case-v1-timeline-row > div:last-child > a{
    color:#47766f;
    font-size:7px;
}


.consult-case-v1-empty{
    padding:12px;

    border:1px dashed #d1dfe1;
    border-radius:7px;

    background:#fafcfc;

    color:#859499;
    font-size:9px;
    text-align:center;
}


.consult-case-v1-good{
    padding:9px;

    border:1px dashed #bfdbd1;
    border-radius:7px;

    background:#f5fbf8;

    color:#4f776b;
    font-size:8px;
}


@media(max-width:1150px){

    .consult-case-v1-kpis{
        grid-template-columns:repeat(3,1fr);
    }

    .consult-case-v1-columns{
        grid-template-columns:1fr;
    }

}


@media(max-width:800px){

    .consult-case-v1-hero{
        align-items:flex-start;
        flex-direction:column;
    }

    .consult-case-v1-annual-item{
        grid-template-columns:1fr;
    }

    .consult-case-v1-actions{
        justify-content:flex-start;
    }

    .consult-case-v1-exam-kpis{
        grid-template-columns:repeat(2,1fr);
    }

    .consult-case-v1-abnormal{
        grid-template-columns:repeat(2,1fr);
    }

}


@media(max-width:560px){

    .consult-case-v1-kpis{
        grid-template-columns:repeat(2,1fr);
    }

    .consult-case-v1-timeline-row{
        grid-template-columns:14px 1fr;
    }

    .consult-case-v1-timeline-date,
    .consult-case-v1-timeline-row > div:last-child{
        grid-column:2;
        justify-items:start;
    }

}



/* ==========================================================
   PHYSICIAN INTEGRATED HEALTH SUMMARY V1
   ========================================================== */

.physician-summary-v1{
    margin:13px 0;
    padding:16px;

    border:1px solid #d7e5e6;
    border-radius:13px;

    background:
        linear-gradient(
            120deg,
            #fff,
            #f7fbfa
        );
}


.physician-summary-v1-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:15px;

    margin-bottom:10px;
}


.physician-summary-v1-head h2{
    margin:0;
    color:#315863;
    font-size:17px;
}


.physician-summary-v1-head p{
    margin:4px 0 0;
    color:#809096;
    font-size:8px;
}


.physician-summary-v1-actions{
    display:flex;
    gap:5px;
}


.physician-summary-v1-actions a{
    padding:6px 8px;

    border:1px solid #c3d7d5;
    border-radius:7px;

    background:#fff;
    color:#42756f;

    font-size:8px;
    font-weight:900;
    text-decoration:none;
}


.physician-summary-v1-person{
    margin-bottom:9px;
    padding:8px 10px;

    border-radius:8px;

    background:#edf7f4;
}


.physician-summary-v1-person strong,
.physician-summary-v1-person span{
    display:block;
}


.physician-summary-v1-person strong{
    color:#42676d;
    font-size:10px;
}


.physician-summary-v1-person span{
    margin-top:2px;
    color:#809096;
    font-size:8px;
}


/* 三年健檢 */

.physician-summary-v1-exams{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:7px;

    margin-bottom:8px;
}


.physician-summary-v1-exam{
    padding:9px;

    border:1px solid #dee8e9;
    border-radius:8px;

    background:#fff;
}


.physician-summary-v1-exam-head{
    display:flex;
    justify-content:space-between;
    align-items:center;

    margin-bottom:6px;
}


.physician-summary-v1-exam-head strong{
    color:#375f68;
    font-size:13px;
}


.physician-summary-v1-exam-head span{
    padding:3px 6px;

    border-radius:999px;

    background:#edf4f5;
    color:#60777e;

    font-size:7px;
}


.physician-summary-v1-exam-head .grade{
    background:#fff0d7;
    color:#8f641f;
}


.physician-summary-v1-exam-head .empty{
    background:#f2f2f2;
    color:#8a9194;
}


.physician-summary-v1-abnormal{
    display:grid;
    gap:4px;
}


.physician-summary-v1-abnormal > div{
    padding:5px 6px;

    border-left:3px solid #c87562;
    border-radius:4px;

    background:#fff8f6;
}


.physician-summary-v1-abnormal strong,
.physician-summary-v1-abnormal span,
.physician-summary-v1-abnormal small{
    display:block;
}


.physician-summary-v1-abnormal strong{
    color:#6f5953;
    font-size:7px;
}


.physician-summary-v1-abnormal span{
    margin-top:1px;

    color:#a45040;

    font-size:9px;
    font-weight:900;
}


.physician-summary-v1-abnormal small{
    color:#98837d;
    font-size:6px;
}


.physician-summary-v1-abnormal .more{
    border-left-color:#6f9c93;

    background:#f3faf8;

    color:#4e746c;

    font-size:7px;
    font-weight:900;
}


.physician-summary-v1-normal{
    padding:7px;

    border-radius:6px;

    background:#f4faf7;

    color:#52766b;

    font-size:7px;
}


.physician-summary-v1-normal.muted{
    background:#f7f8f8;
    color:#8d989b;
}


/* 問卷 */

.physician-summary-v1-questionnaires{
    display:grid;

    grid-template-columns:
        repeat(5,minmax(0,1fr));

    gap:6px;
}


.physician-summary-v1-questionnaires > div{
    min-height:74px;

    padding:8px;

    border:1px solid #dce7e9;
    border-radius:8px;

    background:#fff;
}


.physician-summary-v1-questionnaires span,
.physician-summary-v1-questionnaires strong,
.physician-summary-v1-questionnaires small{
    display:block;
}


.physician-summary-v1-questionnaires span{
    color:#778b91;
    font-size:7px;
}


.physician-summary-v1-questionnaires strong{
    margin-top:5px;

    color:#3e676e;

    font-size:10px;
}


.physician-summary-v1-questionnaires strong.empty{
    color:#999;
}


.physician-summary-v1-questionnaires small{
    margin-top:4px;

    color:#8b999e;

    font-size:6px;
}


.physician-summary-v1-questionnaires .warning{
    border-color:#e8ce9a;

    background:#fffaf0;
}


.physician-summary-v1-questionnaires .warning strong{
    color:#9b6b1e;
}


/* 未結追蹤 */

.physician-summary-v1-followups{
    margin-top:8px;
    padding:8px;

    border:1px solid #e6d4ae;
    border-radius:8px;

    background:#fffaf2;
}


.physician-summary-v1-followups > strong{
    display:block;

    margin-bottom:5px;

    color:#8b671e;
    font-size:8px;
}


.physician-summary-v1-followups > div{
    display:flex;
    justify-content:space-between;
    gap:10px;

    padding:4px 0;

    border-top:1px solid #eee3c9;
}


.physician-summary-v1-followups > div:first-of-type{
    border-top:0;
}


.physician-summary-v1-followups span{
    color:#6e6757;
    font-size:7px;
}


.physician-summary-v1-followups b{
    color:#977020;
    font-size:7px;
}


@media(max-width:1000px){

    .physician-summary-v1-questionnaires{
        grid-template-columns:
            repeat(3,1fr);
    }

}


@media(max-width:750px){

    .physician-summary-v1-head{
        flex-direction:column;
    }

    .physician-summary-v1-exams{
        grid-template-columns:1fr;
    }

    .physician-summary-v1-questionnaires{
        grid-template-columns:
            repeat(2,1fr);
    }

}


@media(max-width:480px){

    .physician-summary-v1-questionnaires{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   WORKSPACE HEALTH DASHBOARD CARD V1
   ========================================================== */

.v4-module-grid.five{
    grid-template-columns:
        repeat(5,minmax(0,1fr));
}


.v4-dashboard-card{
    border-color:#bcded8 !important;

    background:
        linear-gradient(
            145deg,
            #f4fbf9,
            #ffffff
        ) !important;
}


.v4-dashboard-card .v4-module-badge{
    background:#168f87 !important;
    color:#fff !important;
}


.v4-dashboard-card .v4-module-icon{
    background:#dff3ef !important;
    color:#11877f !important;
}


@media(max-width:1350px){

    .v4-module-grid.five{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

}


@media(max-width:850px){

    .v4-module-grid.five{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}


@media(max-width:560px){

    .v4-module-grid.five{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   C4 FOLLOW-UP WORKBOARD V2
   ========================================================== */

.c4-v2-hero{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;

    margin-bottom:12px;
    padding:21px 24px;

    border:1px solid #d8e6e7;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 86% 25%,
            rgba(190,224,218,.48),
            transparent 31%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f4faf9
        );
}


.c4-v2-hero h1{
    margin:0;

    color:#28535f;

    font-size:28px;
}


.c4-v2-hero p{
    max-width:680px;

    margin:6px 0 0;

    color:#798b91;

    font-size:9px;
    line-height:1.7;
}


.c4-v2-hero-actions{
    display:flex;
    gap:6px;
}


.c4-v2-hero-actions a{
    display:flex;
    align-items:center;

    min-height:36px;
    padding:0 10px;

    border:1px solid #bfd5d2;
    border-radius:8px;

    background:#fff;
    color:#39736d;

    font-size:8px;
    font-weight:900;
    text-decoration:none;
}


/* KPI */

.c4-v2-kpis{
    display:grid;

    grid-template-columns:
        repeat(6,minmax(0,1fr));

    gap:7px;

    margin-bottom:12px;
}


.c4-v2-kpis a{
    padding:11px 12px;

    border:1px solid #dce6e8;
    border-radius:10px;

    background:#fff;

    text-decoration:none;
}


.c4-v2-kpis span,
.c4-v2-kpis strong,
.c4-v2-kpis small{
    display:block;
}


.c4-v2-kpis span{
    color:#75888e;
    font-size:8px;
    font-weight:800;
}


.c4-v2-kpis strong{
    margin-top:3px;

    color:#315e68;

    font-size:23px;
}


.c4-v2-kpis small{
    margin-top:2px;

    color:#909da1;

    font-size:7px;
}


.c4-v2-kpis .overdue{
    background:#fff5f3;
    border-color:#ecc5bc;
}


.c4-v2-kpis .overdue strong{
    color:#ad4b3d;
}


.c4-v2-kpis .today{
    background:#fff8ef;
    border-color:#ead1ae;
}


.c4-v2-kpis .today strong{
    color:#a36b25;
}


.c4-v2-kpis .next7{
    background:#fffbed;
    border-color:#eadca9;
}


.c4-v2-kpis .next7 strong{
    color:#8c721e;
}


.c4-v2-kpis .tracking{
    background:#f2f9fc;
    border-color:#c6deea;
}


.c4-v2-kpis .tracking strong{
    color:#497b91;
}


.c4-v2-kpis .closed{
    background:#f3faf7;
    border-color:#c8e0d7;
}


.c4-v2-kpis .closed strong{
    color:#477869;
}


.c4-v2-kpis a.active{
    outline:2px solid #25887e;
    outline-offset:1px;
}


/* filter */

.c4-v2-filter{
    margin-bottom:12px !important;
}


.c4-v2-filter form{
    display:grid;

    grid-template-columns:
        minmax(180px,1.4fr)
        repeat(4,minmax(120px,.8fr))
        auto auto;

    gap:6px;
    align-items:center;
}


.c4-v2-filter input,
.c4-v2-filter select{
    width:100%;
    box-sizing:border-box;

    min-height:36px;
}


.c4-v2-filter-summary{
    margin-top:7px;

    color:#849399;

    font-size:8px;
}


/* details */

.c4-v2-candidates,
.c4-v2-new{
    margin-bottom:12px !important;
}


.c4-v2-candidates summary,
.c4-v2-new summary{
    display:flex;
    align-items:center;
    justify-content:space-between;

    cursor:pointer;
}


.c4-v2-candidates summary div,
.c4-v2-new summary div{
    display:grid;
}


.c4-v2-candidates summary strong,
.c4-v2-new summary strong{
    color:#3f636c;
    font-size:11px;
}


.c4-v2-candidates summary span,
.c4-v2-new summary span{
    color:#87959a;
    font-size:8px;
}


.c4-v2-candidate-table{
    overflow-x:auto;
    margin:10px 0;
}


.c4-v2-candidate-table table{
    min-width:850px;
}


.c4-v2-ignore{
    margin-top:12px;
    padding-top:10px;

    border-top:1px solid #e5ecec;
}


.c4-v2-ignore > div{
    display:flex;
    flex-wrap:wrap;
    gap:5px;

    margin-top:6px;
}


.c4-v2-ignore form{
    margin:0;
}


.c4-v2-new-form{
    display:grid;

    grid-template-columns:
        1.2fr 1.8fr .7fr .9fr auto;

    gap:8px;

    align-items:end;

    margin-top:12px;
}


.c4-v2-new-form label{
    display:grid;

    gap:4px;

    color:#657c84;

    font-size:8px;
}


/* worklist */

.c4-v2-worklist-head{
    display:flex;
    align-items:center;
    justify-content:space-between;

    margin:16px 0 8px;
}


.c4-v2-worklist-head h2{
    margin:0;

    color:#345b65;

    font-size:17px;
}


.c4-v2-worklist-head p{
    margin:3px 0 0;

    color:#869499;

    font-size:8px;
}


.c4-v2-worklist-head > span{
    padding:4px 8px;

    border-radius:999px;

    background:#edf5f5;

    color:#547078;

    font-size:8px;
    font-weight:900;
}


/* case */

.c4-v2-case{
    margin-bottom:8px;
    padding:12px 14px;

    border:1px solid #dae6e7;
    border-left:4px solid #8eb5ad;
    border-radius:11px;

    background:#fff;
}


.c4-v2-case.overdue{
    border-left-color:#ba5949;
    background:#fffafa;
}


.c4-v2-case.today{
    border-left-color:#d18b39;
    background:#fffcf8;
}


.c4-v2-case.next7{
    border-left-color:#c5a139;
}


.c4-v2-case.closed{
    border-left-color:#72a18f;
    background:#f9fcfb;
}


.c4-v2-case-top{
    display:grid;

    grid-template-columns:
        minmax(180px,1.3fr)
        minmax(110px,.7fr)
        90px
        minmax(120px,.8fr);

    gap:10px;

    align-items:center;
}


.c4-v2-person{
    display:flex;
    align-items:center;
    gap:8px;
}


.c4-v2-avatar{
    width:34px;
    height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#e4f1ee;
    color:#39756c;

    font-weight:900;
}


.c4-v2-person > div:last-child{
    display:grid;
}


.c4-v2-person strong{
    color:#3e616a;
    font-size:9px;
}


.c4-v2-person a{
    color:#498078;
    font-size:7px;
}


.c4-v2-source,
.c4-v2-priority,
.c4-v2-due{
    display:grid;
}


.c4-v2-source > span,
.c4-v2-priority > span,
.c4-v2-due > span{
    color:#89969b;
    font-size:7px;
}


.c4-v2-source strong,
.c4-v2-priority strong,
.c4-v2-due strong{
    margin-top:1px;

    color:#526d74;

    font-size:9px;
}


.c4-v2-source a{
    margin-top:2px;

    color:#458077;

    font-size:7px;
}


.c4-v2-due.overdue strong{
    color:#ab4b3c;
}


.c4-v2-due.today strong{
    color:#a76b22;
}


.c4-v2-due.next7 strong{
    color:#93751e;
}


.c4-v2-due small{
    color:#8d999d;
    font-size:7px;
}


.c4-v2-issue{
    display:grid;

    margin:10px 0;
    padding:8px 9px;

    border-radius:7px;

    background:#f7fafa;
}


.c4-v2-issue span{
    color:#8a989c;
    font-size:7px;
}


.c4-v2-issue strong{
    margin-top:2px;

    color:#4e6971;

    font-size:9px;
}


/* update */

.c4-v2-update{
    display:grid;

    grid-template-columns:
        .75fr .65fr .9fr .9fr 2fr auto;

    gap:6px;

    align-items:end;
}


.c4-v2-update label{
    display:grid;

    gap:3px;

    color:#778a90;

    font-size:7px;
}


.c4-v2-update input,
.c4-v2-update select,
.c4-v2-update textarea{
    width:100%;
    box-sizing:border-box;
}


.c4-v2-update textarea{
    resize:vertical;
}


.c4-v2-case-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;

    margin-top:8px;
    padding-top:7px;

    border-top:1px solid #e9eeee;
}


.c4-v2-case-footer > div{
    display:flex;
    flex-wrap:wrap;
    gap:9px;

    color:#8b989c;

    font-size:7px;
}


.c4-v2-case-footer form{
    margin:0;
}


.c4-v2-case-footer .danger{
    background:#fff;
    color:#a94e42;
    border:1px solid #dfbbb5;
}


.c4-v2-empty{
    padding:25px !important;

    text-align:center;

    color:#869599;
}


@media(max-width:1200px){

    .c4-v2-kpis{
        grid-template-columns:
            repeat(3,1fr);
    }

    .c4-v2-filter form{
        grid-template-columns:
            repeat(3,1fr);
    }

    .c4-v2-new-form{
        grid-template-columns:
            repeat(2,1fr);
    }

    .c4-v2-update{
        grid-template-columns:
            repeat(3,1fr);
    }

}


@media(max-width:800px){

    .c4-v2-hero{
        flex-direction:column;
        align-items:flex-start;
    }

    .c4-v2-case-top{
        grid-template-columns:
            repeat(2,1fr);
    }

}


@media(max-width:560px){

    .c4-v2-kpis{
        grid-template-columns:
            repeat(2,1fr);
    }

    .c4-v2-filter form,
    .c4-v2-new-form,
    .c4-v2-update,
    .c4-v2-case-top{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   D1 RETURN TO WORK CASE V1
   ========================================================== */

.rtw-case-v1-hero,
.rtw-case-detail-v1-hero{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;

    margin-bottom:12px;
    padding:21px 24px;

    border:1px solid #d8e6e7;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 85% 30%,
            rgba(188,224,217,.46),
            transparent 31%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f4faf8
        );
}


.rtw-case-v1-hero h1,
.rtw-case-detail-v1-hero h1{
    margin:0;

    color:#28525e;

    font-size:28px;
}


.rtw-case-v1-hero p,
.rtw-case-detail-v1-hero p{
    margin:5px 0 0;

    color:#7d8d93;

    font-size:9px;
}


.rtw-case-v1-actions{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}


.rtw-case-v1-actions a{
    min-height:36px;

    display:flex;
    align-items:center;

    padding:0 10px;

    border:1px solid #bed5d1;
    border-radius:8px;

    background:#fff;
    color:#40746f;

    font-size:8px;
    font-weight:900;
    text-decoration:none;
}


.rtw-case-v1-actions a.primary{
    border-color:#21877e;
    background:#21877e;
    color:#fff;
}


/* KPI */

.rtw-case-v1-kpis{
    display:grid;

    grid-template-columns:
        repeat(6,minmax(0,1fr));

    gap:7px;

    margin-bottom:12px;
}


.rtw-case-v1-kpis a,
.rtw-case-detail-v1-kpis > div{
    padding:11px 12px;

    border:1px solid #dce7e9;
    border-radius:10px;

    background:#fff;

    text-decoration:none;
}


.rtw-case-v1-kpis span,
.rtw-case-v1-kpis strong{
    display:block;
}


.rtw-case-v1-kpis span{
    color:#788a90;
    font-size:8px;
}


.rtw-case-v1-kpis strong{
    margin-top:3px;

    color:#315e68;

    font-size:22px;
}


/* filter */

.rtw-case-v1-filter form{
    display:grid;

    grid-template-columns:
        1.5fr 1fr 1.3fr auto auto;

    gap:7px;
}


/* list */

.rtw-case-v1-list{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:9px;
}


.rtw-case-v1-card{
    display:block;

    padding:13px;

    border:1px solid #dce6e8;
    border-radius:11px;

    background:#fff;

    text-decoration:none;
}


.rtw-case-v1-card:hover{
    border-color:#83bab0;
}


.rtw-case-v1-card-top{
    display:flex;
    justify-content:space-between;
    gap:10px;
}


.rtw-case-v1-card-top > div{
    display:grid;
}


.rtw-case-v1-no{
    color:#26867c;
    font-size:7px;
    font-weight:900;
}


.rtw-case-v1-card-top strong{
    margin-top:3px;

    color:#42656d;

    font-size:10px;
}


.rtw-case-v1-card-top small{
    color:#8a989d;
    font-size:7px;
}


.rtw-case-v1-status{
    align-self:start;

    padding:4px 7px;

    border-radius:999px;

    background:#eef4f5;
    color:#60777e;

    font-size:7px;
    font-weight:900;
}


.rtw-case-v1-status.待評估{
    background:#fff1d8;
    color:#94691f;
}


.rtw-case-v1-status.評估中{
    background:#eaf4f9;
    color:#4b788d;
}


.rtw-case-v1-status.工作調整中{
    background:#f3edf8;
    color:#705b86;
}


.rtw-case-v1-status.追蹤中{
    background:#eef6fb;
    color:#48778d;
}


.rtw-case-v1-status.結案{
    background:#e7f3ed;
    color:#417565;
}


.rtw-case-v1-reason{
    display:grid;

    margin:10px 0;
    padding:8px;

    border-radius:7px;

    background:#f8fafa;
}


.rtw-case-v1-reason span{
    color:#8c989c;
    font-size:7px;
}


.rtw-case-v1-reason strong{
    color:#506c74;
    font-size:9px;
}


.rtw-case-v1-reason small{
    margin-top:3px;

    color:#859398;
    font-size:7px;
}


.rtw-case-v1-card-meta{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:5px;
}


.rtw-case-v1-card-meta span{
    display:grid;

    color:#8a989d;

    font-size:7px;
}


.rtw-case-v1-card-meta b{
    margin-top:2px;

    color:#526e75;

    font-size:8px;
}


.rtw-case-v1-card-action{
    margin-top:10px;

    color:#348077;

    font-size:8px;
    font-weight:900;
}


/* form */

.rtw-case-v1-form{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:12px;
}


.rtw-case-v1-form label,
.rtw-case-detail-v1-update label{
    display:grid;

    gap:4px;

    color:#607881;

    font-size:8px;
    font-weight:800;
}


.rtw-case-v1-form .wide{
    grid-column:1 / -1;
}


.rtw-case-v1-form-actions{
    grid-column:1 / -1;

    display:flex;
    justify-content:flex-end;
    gap:7px;
}


.rtw-case-v1-form-actions a{
    display:flex;
    align-items:center;

    padding:0 10px;

    color:#627b82;
}


/* detail */

.rtw-case-detail-v1-kpis{
    display:grid;

    grid-template-columns:
        repeat(4,1fr);

    gap:7px;

    margin-bottom:12px;
}


.rtw-case-detail-v1-kpis span,
.rtw-case-detail-v1-kpis strong{
    display:block;
}


.rtw-case-detail-v1-kpis span{
    color:#7f8e94;
    font-size:7px;
}


.rtw-case-detail-v1-kpis strong{
    margin-top:3px;

    color:#42656d;

    font-size:11px;
}


.rtw-case-detail-v1-grid{
    display:grid;

    grid-template-columns:
        1.25fr .75fr;

    gap:12px;
}


.rtw-case-detail-v1-info{
    display:grid;

    grid-template-columns:
        repeat(2,1fr);

    gap:7px;
}


.rtw-case-detail-v1-info > div{
    display:grid;

    padding:8px;

    border:1px solid #e1e9ea;
    border-radius:7px;

    background:#fafcfc;
}


.rtw-case-detail-v1-info span{
    color:#8b989d;
    font-size:7px;
}


.rtw-case-detail-v1-info strong{
    color:#506c74;
    font-size:9px;
}


.rtw-case-detail-v1-actions{
    display:grid;
    gap:7px;
}


.rtw-case-detail-v1-actions a{
    display:grid;

    padding:10px;

    border:1px solid #dce7e8;
    border-radius:8px;

    background:#fafcfc;

    text-decoration:none;
}


.rtw-case-detail-v1-actions strong{
    color:#3f696f;
    font-size:9px;
}


.rtw-case-detail-v1-actions span{
    margin-top:3px;

    color:#849399;
    font-size:7px;
}


.rtw-case-detail-v1-update{
    display:grid;
    gap:9px;
}


.rtw-source-v1{
    display:grid;
    gap:4px;
}


.rtw-source-v1 strong{
    color:#46666e;
}


.rtw-source-v1 span,
.rtw-source-v1 p{
    color:#768a90;
    font-size:8px;
}


.rtw-case-next-v1{
    margin-top:2px !important;

    border-left:4px solid #25887e !important;
}


.rtw-case-next-v1 span{
    color:#28847b;
    font-size:7px;
    font-weight:900;
}


.rtw-case-next-v1 strong{
    display:block;

    margin-top:2px;

    color:#3e616a;

    font-size:13px;
}


.rtw-case-next-v1 p{
    margin:4px 0 0;

    color:#849399;

    font-size:8px;
}


.rtw-case-v1-empty{
    grid-column:1 / -1;

    padding:30px !important;

    text-align:center;
}


@media(max-width:1150px){

    .rtw-case-v1-kpis{
        grid-template-columns:
            repeat(3,1fr);
    }

    .rtw-case-v1-list{
        grid-template-columns:
            repeat(2,1fr);
    }

}


@media(max-width:850px){

    .rtw-case-v1-hero,
    .rtw-case-detail-v1-hero{
        align-items:flex-start;
        flex-direction:column;
    }

    .rtw-case-detail-v1-grid{
        grid-template-columns:1fr;
    }

    .rtw-case-v1-form{
        grid-template-columns:1fr;
    }

    .rtw-case-v1-form .wide,
    .rtw-case-v1-form-actions{
        grid-column:auto;
    }

}


@media(max-width:600px){

    .rtw-case-v1-kpis,
    .rtw-case-v1-list,
    .rtw-case-detail-v1-kpis{
        grid-template-columns:
            repeat(2,1fr);
    }

    .rtw-case-v1-filter form{
        grid-template-columns:1fr;
    }

    .rtw-case-detail-v1-info{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   D2 RETURN TO WORK ADJUSTMENT V1
   ========================================================== */

.rtw-adj-v1-hero{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;

    margin-bottom:12px;
    padding:21px 24px;

    border:1px solid #d8e6e7;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 86% 28%,
            rgba(190,224,218,.48),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f3faf8
        );
}


.rtw-adj-v1-hero h1{
    margin:0;
    color:#29535f;
    font-size:27px;
}


.rtw-adj-v1-hero p{
    margin:5px 0 0;
    color:#7e8e94;
    font-size:9px;
}


.rtw-adj-v1-hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}


.rtw-adj-v1-hero-actions a{
    min-height:35px;

    display:flex;
    align-items:center;

    padding:0 10px;

    border:1px solid #bfd6d2;
    border-radius:8px;

    background:#fff;
    color:#40736e;

    font-size:8px;
    font-weight:900;
    text-decoration:none;
}


/* Current */

.rtw-adj-v1-current{
    display:grid;

    grid-template-columns:
        .7fr 1.8fr 1fr;

    gap:8px;

    margin-bottom:12px !important;

    border-left:4px solid #27887e !important;
}


.rtw-adj-v1-current > div{
    display:grid;

    padding:7px;

    border-radius:7px;

    background:#f7faf9;
}


.rtw-adj-v1-current span{
    color:#859399;
    font-size:7px;
}


.rtw-adj-v1-current strong{
    margin-top:3px;

    color:#45666e;
    font-size:9px;
    line-height:1.6;
}


/* section */

.rtw-adj-v1-section-head{
    display:flex;
    justify-content:space-between;
    gap:12px;

    margin-bottom:10px;
}


.rtw-adj-v1-section-head h2{
    margin:0 !important;

    color:#345c66;

    font-size:15px !important;
}


.rtw-adj-v1-section-head p{
    margin:3px 0 0;

    color:#859398;

    font-size:8px;
}


.rtw-adj-v1-source{
    margin-bottom:12px !important;
}


.rtw-adj-v1-source select{
    width:100%;
    max-width:760px;
}


.rtw-adj-v1-source-summary{
    display:grid;

    grid-template-columns:
        repeat(4,1fr);

    gap:6px;

    margin:9px 0;
}


.rtw-adj-v1-source-summary > div{
    display:grid;

    padding:8px;

    border:1px solid #dfe8e9;
    border-radius:7px;

    background:#fafcfc;
}


.rtw-adj-v1-source-summary span{
    color:#88969b;
    font-size:7px;
}


.rtw-adj-v1-source-summary strong{
    margin-top:2px;

    color:#4d6a72;
    font-size:9px;
}


/* form */

.rtw-adj-v1-form{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:10px;
}


.rtw-adj-v1-form label{
    display:grid;

    gap:4px;

    color:#627a82;

    font-size:8px;
    font-weight:800;
}


.rtw-adj-v1-form .wide,
.rtw-adj-v1-form .full{
    grid-column:1 / -1;
}


.rtw-adj-v1-form .full{
    margin-top:8px;
    padding-top:10px;

    border-top:1px solid #e5ecec;
}


.rtw-adj-v1-measure{
    display:grid;

    grid-template-columns:
        minmax(170px,.8fr)
        minmax(200px,1.2fr);

    gap:8px;

    align-items:center;

    padding:8px 9px;

    border:1px solid #e0e9ea;
    border-radius:8px;

    background:#fafcfc;
}


.rtw-adj-v1-measure:has(input[type="time"]){
    grid-template-columns:
        minmax(170px,1fr)
        130px auto 130px;
}


.rtw-adj-v1-form label.check{
    display:flex;

    align-items:center;

    grid-template-columns:none;

    gap:7px;

    min-height:35px;

    padding:7px 9px;

    border:1px solid #e0e8e9;
    border-radius:7px;

    background:#fafcfc;
}


.rtw-adj-v1-form label.check input{
    width:auto;
}


.rtw-adj-v1-submit{
    display:flex;

    justify-content:flex-end;

    gap:7px;

    margin-top:7px;
}


.rtw-adj-v1-submit a{
    display:flex;
    align-items:center;

    padding:0 10px;

    color:#667c83;
}


/* History */

.rtw-adj-v1-history{
    display:grid;
    gap:7px;
}


.rtw-adj-v1-history > div{
    padding:10px;

    border:1px solid #e0e8e9;
    border-left:4px solid #b5c9c6;
    border-radius:8px;

    background:#fafcfc;
}


.rtw-adj-v1-history > div.active{
    border-left-color:#288a80;

    background:#f5fbf8;
}


.rtw-adj-v1-history > div > div{
    display:flex;

    justify-content:space-between;

    gap:10px;
}


.rtw-adj-v1-history strong{
    color:#45666e;
    font-size:9px;
}


.rtw-adj-v1-history span{
    color:#27847b;
    font-size:7px;
    font-weight:900;
}


.rtw-adj-v1-history p{
    margin:5px 0;

    color:#71858b;
    font-size:8px;
}


.rtw-adj-v1-history small{
    color:#849399;
    font-size:7px;
    line-height:1.6;
}


/* D1 detail current */

.rtw-current-adjustment-v1{
    display:grid;
    gap:8px;

    border-left:4px solid #25887e !important;
}


.rtw-current-adjustment-v1 > div{
    display:grid;
}


.rtw-current-adjustment-v1 span{
    color:#839297;
    font-size:7px;
}


.rtw-current-adjustment-v1 strong{
    margin-top:2px;

    color:#48676e;
    font-size:9px;
    line-height:1.6;
}


.rtw-current-adjustment-v1-dates{
    display:flex !important;

    flex-wrap:wrap;

    gap:15px;
}


.rtw-d2-entry-v1{
    border-color:#bcdad5 !important;

    background:#f4faf8 !important;
}


@media(max-width:850px){

    .rtw-adj-v1-hero{
        align-items:flex-start;
        flex-direction:column;
    }

    .rtw-adj-v1-current,
    .rtw-adj-v1-source-summary{
        grid-template-columns:
            repeat(2,1fr);
    }

    .rtw-adj-v1-form{
        grid-template-columns:1fr;
    }

    .rtw-adj-v1-form .wide,
    .rtw-adj-v1-form .full{
        grid-column:auto;
    }

}


@media(max-width:560px){

    .rtw-adj-v1-current,
    .rtw-adj-v1-source-summary{
        grid-template-columns:1fr;
    }

    .rtw-adj-v1-measure,
    .rtw-adj-v1-measure:has(input[type="time"]){
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   D3 RETURN TO WORK FOLLOW-UP V1
   ========================================================== */

.rtw-fu-v1-hero{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;

    margin-bottom:12px;
    padding:21px 24px;

    border:1px solid #d8e6e7;
    border-radius:16px;

    background:
        radial-gradient(
            circle at 86% 28%,
            rgba(189,224,218,.48),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #fff,
            #f4faf9
        );
}


.rtw-fu-v1-hero h1{
    margin:0;
    color:#29535f;
    font-size:27px;
}


.rtw-fu-v1-hero p{
    margin:5px 0 0;
    color:#7d8e94;
    font-size:9px;
}


.rtw-fu-v1-actions{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}


.rtw-fu-v1-actions a{
    display:flex;
    align-items:center;

    min-height:35px;
    padding:0 10px;

    border:1px solid #bfd6d2;
    border-radius:8px;

    background:#fff;
    color:#40736e;

    font-size:8px;
    font-weight:900;
    text-decoration:none;
}


/* KPI */

.rtw-fu-v1-kpis{
    display:grid;

    grid-template-columns:
        repeat(6,minmax(0,1fr));

    gap:7px;

    margin-bottom:12px;
}


.rtw-fu-v1-kpis a{
    padding:11px 12px;

    border:1px solid #dce7e9;
    border-radius:10px;

    background:#fff;

    text-decoration:none;
}


.rtw-fu-v1-kpis span,
.rtw-fu-v1-kpis strong,
.rtw-fu-v1-kpis small{
    display:block;
}


.rtw-fu-v1-kpis span{
    color:#788a90;
    font-size:8px;
}


.rtw-fu-v1-kpis strong{
    margin-top:3px;

    color:#315f68;
    font-size:22px;
}


.rtw-fu-v1-kpis small{
    color:#929da1;
    font-size:7px;
}


.rtw-fu-v1-kpis .overdue{
    background:#fff5f3;
    border-color:#ebc5bd;
}


.rtw-fu-v1-kpis .overdue strong{
    color:#ab4d3e;
}


.rtw-fu-v1-kpis .today{
    background:#fff9ef;
}


.rtw-fu-v1-kpis .today strong{
    color:#a46b25;
}


.rtw-fu-v1-kpis .next7{
    background:#fffbed;
}


.rtw-fu-v1-kpis .next7 strong{
    color:#8d711d;
}


.rtw-fu-v1-kpis a.active{
    outline:2px solid #25887e;
}


/* filter */

.rtw-fu-v1-filter form{
    display:grid;

    grid-template-columns:
        1.7fr 1fr auto auto;

    gap:7px;
}


/* cards */

.rtw-fu-v1-list{
    display:grid;
    gap:8px;
}


.rtw-fu-v1-card{
    padding:13px 14px;

    border:1px solid #dce6e8;
    border-left:4px solid #8db6ae;
    border-radius:11px;

    background:#fff;
}


.rtw-fu-v1-card.overdue{
    border-left-color:#b85949;
    background:#fffafa;
}


.rtw-fu-v1-card.today{
    border-left-color:#cf8a38;
}


.rtw-fu-v1-card.next7{
    border-left-color:#c1a039;
}


.rtw-fu-v1-top{
    display:flex;
    justify-content:space-between;
    gap:12px;
}


.rtw-fu-v1-top > div{
    display:grid;
}


.rtw-fu-v1-case-no{
    color:#27847b;
    font-size:7px;
    font-weight:900;
}


.rtw-fu-v1-top strong{
    color:#41636c;
    font-size:10px;
}


.rtw-fu-v1-top small{
    color:#859499;
    font-size:7px;
}


.rtw-fu-v1-due{
    align-self:start;

    padding:5px 8px;

    border-radius:999px;

    background:#eef4f5;

    color:#60777e;

    font-size:7px;
    font-weight:900;
}


.rtw-fu-v1-due.overdue{
    background:#fce7e3;
    color:#a94b3d;
}


.rtw-fu-v1-due.today{
    background:#fff0d5;
    color:#9c6821;
}


.rtw-fu-v1-due.next7{
    background:#fff7d9;
    color:#8a711e;
}


.rtw-fu-v1-body{
    display:grid;

    grid-template-columns:
        .7fr .8fr 2fr .8fr;

    gap:6px;

    margin-top:10px;
}


.rtw-fu-v1-body > div{
    display:grid;

    padding:7px 8px;

    border-radius:7px;

    background:#f7fafa;
}


.rtw-fu-v1-body span{
    color:#89979c;
    font-size:7px;
}


.rtw-fu-v1-body strong{
    margin-top:2px;

    color:#4e6b73;

    font-size:8px;
    line-height:1.55;
}


.rtw-fu-v1-latest{
    display:grid;

    margin-top:7px;
    padding:8px;

    border:1px solid #dce8e5;
    border-radius:7px;

    background:#f6fbf9;
}


.rtw-fu-v1-latest span{
    color:#829398;
    font-size:7px;
}


.rtw-fu-v1-latest strong{
    color:#456a70;
    font-size:8px;
}


.rtw-fu-v1-latest small{
    color:#849398;
    font-size:7px;
}


.rtw-fu-v1-card-actions{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;

    gap:5px;

    margin-top:9px;
}


.rtw-fu-v1-card-actions a{
    min-height:29px;

    display:flex;
    align-items:center;

    padding:0 7px;

    border:1px solid #c7d8d9;
    border-radius:6px;

    color:#57737a;

    font-size:7px;
    font-weight:800;
    text-decoration:none;
}


.rtw-fu-v1-card-actions a.primary{
    border-color:#25887e;
    background:#25887e;
    color:#fff;
}


.rtw-fu-v1-empty{
    padding:25px !important;
    text-align:center;
    color:#89979b;
}


/* followup form */

.rtw-fu-form-v1-current{
    display:grid;

    grid-template-columns:
        .7fr 2fr 1fr;

    gap:7px;

    border-left:4px solid #26887e !important;
}


.rtw-fu-form-v1-current > div{
    display:grid;

    padding:7px;

    background:#f7faf9;
    border-radius:7px;
}


.rtw-fu-form-v1-current span{
    color:#879499;
    font-size:7px;
}


.rtw-fu-form-v1-current strong{
    color:#47676f;
    font-size:8px;
    line-height:1.55;
}


.rtw-fu-form-v1{
    display:grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    gap:10px;
}


.rtw-fu-form-v1 label{
    display:grid;
    gap:4px;

    color:#627a82;

    font-size:8px;
    font-weight:800;
}


.rtw-fu-form-v1 .full{
    grid-column:1 / -1;
}


.rtw-fu-form-v1-head{
    margin-bottom:2px;
}


.rtw-fu-form-v1-head h2{
    margin:0 !important;

    color:#345d66;

    font-size:15px !important;
}


.rtw-fu-form-v1-head p{
    margin:3px 0 0;

    color:#859398;
    font-size:8px;
}


.rtw-fu-form-v1-check{
    display:flex !important;

    flex-direction:row !important;
    align-items:center;

    gap:7px !important;

    min-height:38px;

    padding:7px;

    border:1px solid #dfe8e9;
    border-radius:7px;

    background:#fafcfc;
}


.rtw-fu-form-v1-check input{
    width:auto;
}


.rtw-fu-form-v1-submit{
    display:flex;

    justify-content:flex-end;

    gap:7px;
}


.rtw-fu-form-v1-submit a{
    display:flex;
    align-items:center;

    padding:0 10px;

    color:#667c83;
}


/* history */

.rtw-fu-history-v1{
    display:grid;
    gap:7px;
}


.rtw-fu-history-v1 > div{
    padding:9px;

    border:1px solid #e0e8e9;
    border-left:4px solid #86b4aa;
    border-radius:8px;

    background:#fafcfc;
}


.rtw-fu-history-v1 > div > div{
    display:flex;

    justify-content:space-between;

    gap:10px;
}


.rtw-fu-history-v1 strong{
    color:#45666e;
    font-size:9px;
}


.rtw-fu-history-v1 span{
    color:#28837a;
    font-size:7px;
    font-weight:900;
}


.rtw-fu-history-v1 p{
    margin:5px 0;

    color:#71858b;
    font-size:8px;
}


.rtw-fu-history-v1 b{
    display:inline-block;

    margin-right:8px;

    color:#a06026;
    font-size:7px;
}


.rtw-fu-history-v1 small{
    color:#849398;
    font-size:7px;
}


.rtw-d3-entry-v1{
    border-color:#bddbd5 !important;

    background:#f4faf8 !important;
}


@media(max-width:950px){

    .rtw-fu-v1-kpis{
        grid-template-columns:
            repeat(3,1fr);
    }

    .rtw-fu-v1-body{
        grid-template-columns:
            repeat(2,1fr);
    }

    .rtw-fu-form-v1{
        grid-template-columns:
            repeat(2,1fr);
    }

    .rtw-fu-form-v1 .full{
        grid-column:1 / -1;
    }

}


@media(max-width:600px){

    .rtw-fu-v1-hero{
        align-items:flex-start;
        flex-direction:column;
    }

    .rtw-fu-v1-kpis{
        grid-template-columns:
            repeat(2,1fr);
    }

    .rtw-fu-v1-filter form,
    .rtw-fu-v1-body,
    .rtw-fu-form-v1,
    .rtw-fu-form-v1-current{
        grid-template-columns:1fr;
    }

    .rtw-fu-form-v1 .full{
        grid-column:auto;
    }

}



/* ==========================================================
   D4 RETURN TO WORK CLOSURE V1
   ========================================================== */

.rtw-close-v1-hero{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;
    margin-bottom:12px;
    padding:21px 24px;
    border:1px solid #d8e6e7;
    border-radius:16px;
    background:linear-gradient(
        110deg,
        #fff,
        #f4faf9
    );
}

.rtw-close-v1-hero h1{
    margin:0;
    color:#29535f;
    font-size:27px;
}

.rtw-close-v1-hero p{
    margin:5px 0 0;
    color:#7e8e94;
    font-size:9px;
}

.rtw-close-v1-actions{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}

.rtw-close-v1-actions a{
    display:flex;
    align-items:center;
    min-height:35px;
    padding:0 10px;
    border:1px solid #bfd6d2;
    border-radius:8px;
    background:#fff;
    color:#40736e;
    font-size:8px;
    font-weight:900;
    text-decoration:none;
}

.rtw-close-v1-kpis{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:7px;
    margin-bottom:12px;
}

.rtw-close-v1-kpis a{
    padding:11px 12px;
    border:1px solid #dce7e9;
    border-radius:10px;
    background:#fff;
    text-decoration:none;
}

.rtw-close-v1-kpis span,
.rtw-close-v1-kpis strong{
    display:block;
}

.rtw-close-v1-kpis span{
    color:#7b8b90;
    font-size:8px;
}

.rtw-close-v1-kpis strong{
    margin-top:3px;
    color:#315f68;
    font-size:22px;
}

.rtw-close-v1-kpis a.active{
    outline:2px solid #25887e;
}

.rtw-close-v1-list{
    display:grid;
    gap:8px;
}

.rtw-close-v1-card{
    padding:13px 14px;
    border:1px solid #dce6e8;
    border-left:4px solid #9bb8b3;
    border-radius:11px;
    background:#fff;
}

.rtw-close-v1-card.closed{
    border-left-color:#4f917e;
    background:#f8fcfa;
}

.rtw-close-v1-card-head{
    display:flex;
    justify-content:space-between;
    gap:12px;
}

.rtw-close-v1-card-head > div{
    display:grid;
}

.rtw-close-v1-card-head span{
    color:#27847b;
    font-size:7px;
    font-weight:900;
}

.rtw-close-v1-card-head strong{
    color:#42646c;
    font-size:10px;
}

.rtw-close-v1-card-head small{
    color:#859499;
    font-size:7px;
}

.rtw-close-v1-card-head > b{
    align-self:start;
    padding:5px 8px;
    border-radius:999px;
    background:#edf3f4;
    color:#60777e;
    font-size:7px;
}

.rtw-close-v1-card-head > b.recommended{
    background:#fff2d9;
    color:#95671e;
}

.rtw-close-v1-card-head > b.done{
    background:#e3f1eb;
    color:#417464;
}

.rtw-close-v1-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:6px;
    margin-top:10px;
}

.rtw-close-v1-grid > div{
    display:grid;
    padding:7px;
    border-radius:7px;
    background:#f7fafa;
}

.rtw-close-v1-grid span{
    color:#89979c;
    font-size:7px;
}

.rtw-close-v1-grid strong{
    margin-top:2px;
    color:#4e6b73;
    font-size:8px;
}

.rtw-close-v1-card-actions{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:5px;
    margin-top:9px;
}

.rtw-close-v1-card-actions a{
    display:flex;
    align-items:center;
    min-height:29px;
    padding:0 7px;
    border:1px solid #c7d8d9;
    border-radius:6px;
    color:#57737a;
    font-size:7px;
    font-weight:800;
    text-decoration:none;
}

.rtw-close-v1-card-actions a.primary{
    border-color:#25887e;
    background:#25887e;
    color:#fff;
}

.rtw-close-form-v1{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:10px;
}

.rtw-close-form-v1 label{
    display:grid;
    gap:4px;
    color:#607981;
    font-size:8px;
    font-weight:800;
}

.rtw-close-form-v1 .full{
    grid-column:1 / -1;
}

.rtw-close-check{
    display:flex !important;
    flex-direction:row !important;
    align-items:center;
    gap:8px !important;
    min-height:38px;
    padding:8px;
    border:1px solid #e0e8e9;
    border-radius:7px;
    background:#fafcfc;
}

.rtw-close-check input{
    width:auto;
}

.rtw-close-form-v1-submit{
    display:flex;
    justify-content:flex-end;
    gap:7px;
}

.rtw-d4-entry-v1{
    border-color:#bcd9d4 !important;
    background:#f3faf7 !important;
}


/* COMPLETE SUMMARY */

.rtw-summary-v1-page{
    max-width:1100px;
    margin:auto;
}

.rtw-summary-v1-actions{
    display:flex;
    justify-content:flex-end;
    gap:6px;
    margin-bottom:10px;
}

.rtw-summary-v1-header{
    display:flex;
    justify-content:space-between;
    padding:18px 20px;
    border:1px solid #ccdcdc;
    border-bottom:3px solid #42857b;
}

.rtw-summary-v1-header h1{
    margin:0;
    color:#315a63;
    font-size:22px;
}

.rtw-summary-v1-basic{
    display:grid;
    grid-template-columns:repeat(4,1fr);
}

.rtw-summary-v1-basic > div{
    display:grid;
    padding:8px;
    border:1px solid #d4e0e1;
}

.rtw-summary-v1-basic span{
    color:#849398;
    font-size:7px;
}

.rtw-summary-v1-basic strong{
    color:#48666e;
    font-size:9px;
}

.rtw-summary-v1-section{
    margin-top:14px;
}

.rtw-summary-v1-section h2{
    margin:0 0 6px;
    color:#345c65;
    font-size:13px;
}

.rtw-summary-v1-section table{
    width:100%;
    border-collapse:collapse;
}

.rtw-summary-v1-section th,
.rtw-summary-v1-section td{
    padding:6px;
    border:1px solid #d6e0e1;
    color:#536c73;
    font-size:8px;
    vertical-align:top;
}

.rtw-summary-v1-section th{
    background:#f2f7f6;
}

.rtw-summary-v1-record{
    margin-bottom:6px;
    padding:8px;
    border:1px solid #dce5e6;
    border-radius:6px;
}

.rtw-summary-v1-closure{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:6px;
    margin-bottom:7px;
    padding:8px;
    border:1px solid #cfe0da;
    border-radius:7px;
    background:#f7fbf9;
}

.rtw-summary-v1-closure > div{
    display:grid;
}

.rtw-summary-v1-closure .wide{
    grid-column:1 / -1;
}

.rtw-summary-v1-footer{
    display:flex;
    justify-content:space-between;
    margin-top:18px;
    padding-top:8px;
    border-top:1px solid #cbd9da;
    color:#879599;
    font-size:7px;
}

@media(max-width:800px){

    .rtw-close-v1-grid,
    .rtw-close-v1-kpis,
    .rtw-summary-v1-basic{
        grid-template-columns:repeat(2,1fr);
    }

    .rtw-close-form-v1{
        grid-template-columns:repeat(2,1fr);
    }

}

@media print{

    .no-print,
    .sh-sidebar,
    .sh-context,
    .consult-v4-global-nav,
    .a-health-nav-v1{
        display:none !important;
    }

    .sh-main{
        margin:0 !important;
        padding:0 !important;
    }

    body{
        background:#fff !important;
    }

}



/* ==========================================================
   RTW OFFICIAL ASSESSMENT FORM V1
   ========================================================== */

.rtw-official-v1-page{
    max-width:1100px;
    margin:auto;
}

.rtw-official-v1-toolbar{
    display:flex;
    justify-content:flex-end;
    gap:6px;
    margin-bottom:10px;
}

.rtw-official-v1-toolbar a{
    display:flex;
    align-items:center;
    min-height:34px;
    padding:0 10px;
    border:1px solid #c6d8d8;
    border-radius:7px;
    background:#fff;
    color:#56747a;
    font-size:8px;
    font-weight:900;
    text-decoration:none;
}

.rtw-official-v1-toolbar a.primary{
    border-color:#27877e;
    background:#27877e;
    color:#fff;
}

.rtw-official-v1-title{
    margin-bottom:12px;
    padding:18px 22px;
    border:1px solid #d8e5e5;
    border-radius:14px;
    text-align:center;
    background:#f8fbfa;
}

.rtw-official-v1-title span{
    color:#27847a;
    font-size:8px;
    font-weight:900;
}

.rtw-official-v1-title h1{
    margin:4px 0 2px;
    color:#315c64;
    font-size:25px;
}

.rtw-official-v1-title p{
    margin:0;
    color:#87969a;
    font-size:8px;
}

.rtw-official-v1-form{
    display:grid;
    gap:10px;
}

.rtw-official-v1-form h2{
    margin:0 0 10px;
    color:#355e66;
    font-size:15px;
}

.rtw-official-v1-form label{
    display:grid;
    gap:4px;
    color:#587078;
    font-size:8px;
    font-weight:800;
}

.rtw-official-v1-form label small{
    color:#8b979b;
    font-weight:400;
}

.rtw-official-v1-basic{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:8px;
}

.rtw-official-v1-checks{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:10px;
}

.rtw-official-v1-checks.vertical{
    display:grid;
    grid-template-columns:repeat(2,1fr);
}

.rtw-official-v1-checks label{
    display:flex;
    flex-direction:row;
    align-items:center;
    gap:7px;
    min-height:35px;
    padding:7px 9px;
    border:1px solid #dfe8e8;
    border-radius:7px;
    background:#fafcfc;
}

.rtw-official-v1-checks input{
    width:auto;
}

.rtw-official-v1-period{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:8px;
    margin-bottom:10px;
}

.rtw-official-v1-signatures{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:8px;
}

.rtw-official-v1-submit{
    display:flex;
    justify-content:flex-end;
    gap:7px;
    margin-bottom:25px;
}

.rtw-official-v1-submit a{
    display:flex;
    align-items:center;
    padding:0 10px;
    color:#697e83;
}

.rtw-official-entry-v1{
    border-color:#b8d9d2 !important;
    background:#f1faf7 !important;
}

@media(max-width:800px){

    .rtw-official-v1-basic,
    .rtw-official-v1-checks.vertical,
    .rtw-official-v1-signatures{
        grid-template-columns:repeat(2,1fr);
    }

}

@media(max-width:560px){

    .rtw-official-v1-basic,
    .rtw-official-v1-checks.vertical,
    .rtw-official-v1-period,
    .rtw-official-v1-signatures{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   RTW ASSESSMENT FORM V3
   ========================================================== */

.rtw-assess-v3-page{
    max-width:1150px;
    margin:auto;
}


.rtw-assess-v3-hero{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;

    margin-bottom:12px;
    padding:20px 23px;

    border:1px solid #d7e5e5;
    border-radius:15px;

    background:linear-gradient(
        110deg,
        #fff,
        #f3faf8
    );
}


.rtw-assess-v3-hero h1{
    margin:0;
    color:#295963;
    font-size:27px;
}


.rtw-assess-v3-hero p{
    margin:4px 0 0;
    color:#819196;
    font-size:9px;
}


.rtw-assess-v3-actions{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
}


.rtw-assess-v3-actions a{
    display:flex;
    align-items:center;

    min-height:35px;
    padding:0 10px;

    border:1px solid #c3d7d5;
    border-radius:7px;

    background:#fff;
    color:#4c7374;

    font-size:8px;
    font-weight:900;
    text-decoration:none;
}


.rtw-assess-v3-actions a.primary{
    border-color:#267f78;
    background:#267f78;
    color:#fff;
}


/* rule assist */

.rtw-rule-v3{
    margin-bottom:12px !important;

    border-left:4px solid #b88937 !important;

    background:#fffdfa !important;
}


.rtw-rule-v3-head span{
    color:#a47120;
    font-size:7px;
    font-weight:900;
}


.rtw-rule-v3-head h2{
    margin:2px 0 0;
    color:#5f5b4e;
    font-size:15px;
}


.rtw-rule-v3-head p{
    margin:3px 0 9px;
    color:#89877f;
    font-size:8px;
}


.rtw-rule-v3-operation{
    display:grid;
    grid-template-columns:1fr auto;
    gap:7px;
    align-items:end;
}


.rtw-rule-v3-operation label{
    display:grid;
    gap:4px;

    color:#676f6e;
    font-size:8px;
    font-weight:800;
}


.rtw-rule-v3-result{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:6px;

    margin-top:9px;
}


.rtw-rule-v3-result > div{
    display:grid;

    padding:8px;

    border:1px solid #e7dfcd;
    border-radius:7px;

    background:#fff;
}


.rtw-rule-v3-result span{
    color:#918875;
    font-size:7px;
}


.rtw-rule-v3-result strong{
    margin-top:2px;

    color:#5e625d;
    font-size:8px;
    line-height:1.55;
}


.rtw-rule-v3-result .warning{
    border-color:#e4c68e;
    background:#fff8e9;
}


.rtw-rule-v3-result .warning strong{
    color:#8c601d;
}


.rtw-rule-v3-note,
.rtw-rule-v3-empty{
    margin-top:8px;
    padding:8px 10px;

    border-radius:7px;

    background:#faf8f2;
    color:#6f706a;

    font-size:8px;
    line-height:1.65;

    white-space:pre-wrap;
}


/* form */

.rtw-assess-v3-form{
    display:grid;
    gap:10px;
}


.rtw-assess-v3-section-title{
    display:flex;
    align-items:center;
    gap:8px;

    margin-bottom:10px;
}


.rtw-assess-v3-section-title > span{
    width:30px;
    height:30px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:8px;

    background:#edf7f4;
    color:#277f77;

    font-size:8px;
    font-weight:900;
}


.rtw-assess-v3-section-title h2{
    margin:0 !important;

    color:#365f67;
    font-size:14px !important;
}


.rtw-assess-v3-section-title small{
    color:#889699;
    font-size:7px;
}


.rtw-assess-v3-form label{
    display:grid;
    gap:4px;

    color:#5e767d;
    font-size:8px;
    font-weight:800;
}


.rtw-assess-v3-basic{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:7px;
}


.rtw-assess-v3-check-row,
.rtw-assess-v3-check-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:7px;
}


.rtw-assess-v3-check-row label,
.rtw-assess-v3-check-grid label{
    display:flex;
    align-items:center;
    flex-direction:row;

    gap:7px;

    min-height:36px;
    padding:7px 9px;

    border:1px solid #dfe8e8;
    border-radius:7px;

    background:#fafcfc;
}


.rtw-assess-v3-check-row input,
.rtw-assess-v3-check-grid input{
    width:auto;
}


.rtw-assess-v3-wide{
    margin-top:8px;
}


.rtw-assess-v3-result-row{
    display:grid;

    grid-template-columns:185px 1fr;

    gap:7px;

    margin-bottom:7px;
    padding:8px;

    border:1px solid #dfe8e9;
    border-radius:8px;

    background:#fafcfc;
}


.rtw-assess-v3-result-row.simple{
    grid-template-columns:1fr;
}


.rtw-assess-v3-result-row > label{
    display:flex;
    align-items:flex-start;
    flex-direction:row;

    gap:7px;

    padding-top:6px;

    color:#465f66;

    font-size:9px;
    font-weight:900;
}


.rtw-assess-v3-result-row input{
    width:auto;
}


.rtw-assess-v3-period{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:7px;

    margin-bottom:8px;
}


.rtw-assess-v3-signatures{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:7px;
}


.rtw-assess-v3-submit{
    display:flex;
    justify-content:flex-end;
    gap:7px;

    margin-bottom:25px;
}


.rtw-assess-v3-submit a{
    display:flex;
    align-items:center;

    padding:0 10px;

    color:#647b80;
}


@media(max-width:850px){

    .rtw-assess-v3-hero{
        align-items:flex-start;
        flex-direction:column;
    }

    .rtw-assess-v3-basic,
    .rtw-assess-v3-check-row,
    .rtw-assess-v3-check-grid,
    .rtw-rule-v3-result{
        grid-template-columns:repeat(2,1fr);
    }

}


@media(max-width:600px){

    .rtw-assess-v3-basic,
    .rtw-assess-v3-check-row,
    .rtw-assess-v3-check-grid,
    .rtw-rule-v3-result,
    .rtw-assess-v3-period,
    .rtw-assess-v3-signatures,
    .rtw-rule-v3-operation{
        grid-template-columns:1fr;
    }

    .rtw-assess-v3-result-row{
        grid-template-columns:1fr;
    }

}



/* ==========================================================
   RTW FORM DOCUMENTS V1
   ========================================================== */

.rtw-doc-v1-page,
.rtw-consent-v1-page{
    max-width:1100px;
    margin:auto;
}


.rtw-doc-v1-toolbar{
    display:flex;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:6px;

    margin-bottom:10px;
}


.rtw-doc-v1-toolbar a{
    display:flex;
    align-items:center;

    min-height:34px;
    padding:0 10px;

    border:1px solid #c3d7d6;
    border-radius:7px;

    background:#fff;
    color:#537476;

    font-size:8px;
    font-weight:900;
    text-decoration:none;
}


.rtw-doc-v1-toolbar a.primary{
    border-color:#27827a;
    background:#27827a;
    color:#fff;
}


.rtw-doc-v1-title{
    margin-bottom:12px;
    padding:18px 22px;

    border:1px solid #d7e5e5;
    border-radius:14px;

    background:#f8fbfa;

    text-align:center;
}


.rtw-doc-v1-title span{
    color:#27847b;
    font-size:8px;
    font-weight:900;
}


.rtw-doc-v1-title h1{
    margin:3px 0 0;

    color:#315c64;
    font-size:25px;
}


.rtw-doc-v1-form{
    display:grid;
    gap:10px;
}


.rtw-doc-v1-basic{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
}


.rtw-doc-v1-form label,
.rtw-consent-v1-form label{
    display:grid;
    gap:4px;

    color:#5e767d;

    font-size:8px;
    font-weight:800;
}


/* review */

.rtw-review-table-v1{
    display:grid;
    gap:1px;

    border:1px solid #d9e3e3;
    background:#d9e3e3;
}


.rtw-review-table-v1 .head,
.rtw-review-table-v1 .row{
    display:grid;

    grid-template-columns:
        1.25fr .55fr 1fr;

    gap:1px;
}


.rtw-review-table-v1 .head > span{
    padding:7px;

    background:#eef5f4;

    color:#49676e;

    font-size:8px;
    font-weight:900;
}


.rtw-review-table-v1 .row > *{
    border:0 !important;
    border-radius:0 !important;

    background:#fff !important;
}


.rtw-doc-v1-submit{
    display:flex;
    justify-content:flex-end;
    gap:7px;

    margin-bottom:25px;
}


.rtw-doc-v1-submit a{
    display:flex;
    align-items:center;

    padding:0 10px;

    color:#647b80;
}


/* consent */

.rtw-consent-v1-intro{
    margin:0;

    color:#526c72;

    font-size:10px;
    line-height:1.9;
}


.rtw-consent-v1-intro strong{
    color:#295d63;
    font-size:11px;
}


.rtw-consent-v1-options{
    display:grid;
    gap:8px;
}


.rtw-consent-v1-row{
    display:grid;

    grid-template-columns:
        190px 1fr;

    gap:8px;

    padding:8px;

    border:1px solid #dfe8e8;
    border-radius:8px;

    background:#fafcfc;
}


.rtw-consent-v1-row > label{
    display:flex;
    flex-direction:row;
    align-items:flex-start;

    gap:7px;

    padding-top:6px;

    color:#456168;

    font-size:9px;
    font-weight:900;
}


.rtw-consent-v1-row input[type="checkbox"]{
    width:auto;
}


.rtw-consent-v1-confirm{
    display:flex !important;
    flex-direction:row !important;
    align-items:center;

    gap:8px !important;

    padding:9px;

    border:1px solid #cfe1dc;
    border-radius:8px;

    background:#f5faf8;
}


.rtw-consent-v1-confirm input{
    width:auto;
}


.rtw-consent-v1-sign{
    display:grid;

    grid-template-columns:1fr 1fr;

    gap:10px;

    margin-top:12px;
}


@media(max-width:750px){

    .rtw-doc-v1-basic,
    .rtw-consent-v1-sign{
        grid-template-columns:1fr;
    }

    .rtw-review-table-v1 .head,
    .rtw-review-table-v1 .row{
        grid-template-columns:1fr;
    }

    .rtw-review-table-v1 .head{
        display:none;
    }

    .rtw-consent-v1-row{
        grid-template-columns:1fr;
    }

}