/* JOB MONEY Studio | unified desktop operations cockpit.
   Desktop presents the SAME workflow as mobile: pipeline -> decisions -> queues -> deep panels.
   All controls keep their original data-of actions and server authorization. */
.of-desktop-cockpit{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(250px,.82fr);gap:15px 18px;align-items:start;max-width:1420px;margin:0 auto;color:#19334c}
.of-desktop-cockpit>*{min-width:0}
.of-desktop-cockpit h2,.of-desktop-cockpit h3,.of-desktop-cockpit p{margin-top:0}
.of-desk-workflow{grid-column:1/-1;display:flex;flex-direction:column;gap:13px;background:#fff;border:1px solid #dce6ee;border-radius:16px;padding:17px 20px;box-shadow:0 3px 14px #15304909}
.of-desk-flow-title{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.of-desk-flow-title strong{font-size:15px;font-weight:900;color:#1e3952;letter-spacing:-.025em}
.of-desk-flow-title span{font-size:11px;color:#7891a4}
.of-desk-flow-steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.of-desk-step{background:#f4f7fa;min-width:0;padding:11px 7px 11px 10px;border:1px solid #e2eaf0;border-radius:10px;color:#31536b;display:flex;align-items:center;gap:7px;text-align:left;cursor:pointer;min-height:50px}
.of-desk-step:first-child{background:#edf5f5;border-color:#cbe3e2}
.of-desk-step:nth-child(3){background:#fff3e8;border-color:#f6dcc9}
.of-desk-step b{display:grid;place-items:center;width:23px;height:23px;flex:0 0 23px;border-radius:7px;background:#fff;color:#bc6a35;font-size:11px}
.of-desk-step span{font-size:10px;line-height:1.32;flex:1;min-width:0;font-weight:800;overflow-wrap:break-word}
.of-desk-step svg{width:11px;height:11px;flex-shrink:0;color:#97acbd}
.of-desk-step:hover,.of-desk-step:focus-visible{border-color:#dc945d;box-shadow:0 0 0 2px #f6dcc922}
.of-desktop-cockpit .of-mob-hero{grid-column:1/-1;display:grid;grid-template-columns:minmax(245px,.9fr) minmax(450px,1.65fr);align-items:center;column-gap:24px;row-gap:6px;background:#172e47;border:1px solid #223f5c;box-shadow:0 8px 20px #12283c12;border-radius:16px;color:#fff;padding:19px 20px 12px}
.of-desktop-cockpit .of-mob-hero-top{grid-column:1;grid-row:1;display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:space-between}
.of-desktop-cockpit .of-mob-kicker{font-weight:850;letter-spacing:.09em;font-size:9px;color:#ffc69b}
.of-desktop-cockpit .of-mob-online{color:#aad6c1;font-size:10px;display:flex;align-items:center;gap:6px}
.of-desktop-cockpit .of-mob-online i{width:7px;height:7px;background:#3bc290;border-radius:50%;box-shadow:0 0 0 3px #3bc29024}
.of-desktop-cockpit .of-mob-hero h2{grid-column:1;grid-row:2;font-size:23px;font-weight:900;line-height:1.12;color:#fff;letter-spacing:-.04em;margin:5px 0!important}
.of-desktop-cockpit .of-mob-hero>p{grid-column:1;grid-row:3;font-size:11px;line-height:1.65;color:#c6d7e6;margin:0 0 3px}
.of-desktop-cockpit .of-mob-metrics{grid-column:2;grid-row:1/4;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.of-desktop-cockpit .of-mob-metric{background:#fff;color:#23405b;padding:14px 12px;display:flex;flex-direction:column;justify-content:center;gap:9px;min-height:91px;border-radius:11px;min-width:0}
.of-desktop-cockpit .of-mob-metric-accent{background:#ffe8d4}
.of-desktop-cockpit .of-mob-metric strong{font-size:28px;font-weight:900;letter-spacing:-.04em;line-height:1;color:#1b3852;font-variant-numeric:tabular-nums}
.of-desktop-cockpit .of-mob-metric-accent strong{color:#b45e2e}
.of-desktop-cockpit .of-mob-metric span{font-size:10px;color:#6e8293;line-height:1.4;font-weight:800}
.of-desktop-cockpit .of-mob-hero-foot{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 0 0;margin:5px 0 0;border-top:1px solid #ffffff20;color:#bfd0de;font-size:10px}
.of-desktop-cockpit .of-mob-hero-foot button{background:transparent;border:0;color:#f1b489;display:flex;align-items:center;gap:5px;font-size:11px;font-weight:850;padding:5px 2px;cursor:pointer}
.of-desktop-cockpit .of-mob-action-board{grid-column:1;grid-row:auto;background:#fff;border:1px solid #dce5ed;border-radius:16px;padding:17px 18px 9px;box-shadow:0 3px 14px #15304909;min-width:0}
.of-desktop-cockpit .of-mob-heading{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding-bottom:8px}
.of-desktop-cockpit .of-mob-heading h2{font-size:17px;color:#1c3852;margin:0;font-weight:900;letter-spacing:-.025em}
.of-desktop-cockpit .of-mob-heading span{font-size:10px;color:#8396a6}
.of-desktop-cockpit .of-mob-task{display:grid;grid-template-columns:30px minmax(0,1fr) auto auto;gap:10px;align-items:center;min-height:62px;padding:10px 2px;border-top:1px solid #e9eff3}
.of-desktop-cockpit .of-mob-task-icon{width:29px;height:29px;border-radius:9px;background:#edf3f7;color:#385e78;font-weight:900;font-size:12px;display:grid;place-items:center}
.of-desktop-cockpit .of-mob-task.important .of-mob-task-icon{background:#fcece2;color:#ad602e}
.of-desktop-cockpit .of-mob-task-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.of-desktop-cockpit .of-mob-task-text strong{font-size:12px;color:#29465f;font-weight:850}
.of-desktop-cockpit .of-mob-task-text small{font-size:10px;color:#8393a2;line-height:1.4}
.of-desktop-cockpit .of-mob-task-number{font-size:17px;font-weight:900;color:#234964;font-variant-numeric:tabular-nums}
.of-desktop-cockpit .of-mob-row-btn{display:flex;align-items:center;justify-content:center;gap:4px;text-decoration:none;background:#fff;border:1px solid #dde7ee;color:#2c5570;padding:8px 9px;border-radius:9px;font-size:11px;font-weight:850;min-height:35px;cursor:pointer;white-space:nowrap}
.of-desktop-cockpit .of-mob-row-btn:hover{background:#edf3f7;border-color:#adc5d6}
.of-desktop-cockpit .of-mob-alert{font-size:11px;color:#b2532c;background:#fff2e9;padding:9px;border-radius:9px;margin:8px 0}
.of-desktop-cockpit .of-mob-shortcuts{grid-column:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(69px,1fr);gap:9px;height:100%}
.of-desktop-cockpit .of-mob-shortcut{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;text-align:center;padding:10px;border-radius:12px;border:1px solid #dce6ef;background:#fff;color:#264762;font-size:11px;font-weight:850;min-width:0;text-decoration:none;cursor:pointer}
.of-desktop-cockpit .of-mob-shortcut svg{color:#b56b3e}
.of-desktop-cockpit .of-mob-shortcut.primary{background:#eef6f7;border-color:#d1e7e7}
.of-desktop-cockpit .of-mob-shortcut:hover{border-color:#b1cbd9;box-shadow:0 2px 10px #1636520b}
.of-desktop-cockpit .of-mob-section{grid-column:1/-1;min-width:0;background:#fff;border:1px solid #dde6ee;border-radius:16px;overflow:hidden;box-shadow:0 2px 12px #16324a07;scroll-margin-top:18px}
.of-desktop-cockpit .of-mob-section>summary{display:flex;align-items:center;justify-content:space-between;gap:13px;padding:14px 18px;min-height:61px;cursor:pointer;list-style:none}
.of-desktop-cockpit .of-mob-section>summary::-webkit-details-marker{display:none}
.of-desktop-cockpit .of-mob-section>summary>span:first-child{display:flex;flex-direction:column;gap:4px;min-width:0}
.of-desktop-cockpit .of-mob-section>summary strong{font-size:16px;font-weight:900;color:#183850;letter-spacing:-.025em}
.of-desktop-cockpit .of-mob-section>summary small{font-size:11px;color:#8194a6}
.of-desktop-cockpit .of-mob-caret{width:32px;height:32px;flex:0 0 32px;display:grid;place-items:center;background:#f0f5f9;border-radius:9px;color:#4f718b}
.of-desktop-cockpit .of-mob-section[open]>.of-mob-section-body{border-top:1px solid #e9eff3}
.of-desktop-cockpit .of-mob-section[open] .of-mob-caret svg{transform:rotate(180deg)}
.of-desktop-cockpit .of-mob-section-body{padding:18px}
.of-desktop-cockpit .of-mob-queue-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:12px}
.of-desktop-cockpit .of-mob-queue-head p{font-size:11px;color:#6c8496;line-height:1.55;max-width:490px;margin:0}
.of-desktop-cockpit .of-mob-queue-actions{display:flex;gap:8px;align-items:center;flex-shrink:0}
.of-desktop-cockpit .of-mob-action{display:inline-flex;align-items:center;justify-content:center;gap:7px;background:#16334f;color:#fff;border:0;border-radius:10px;padding:10px 14px;font-size:11px;font-weight:850;text-decoration:none;cursor:pointer;min-height:39px}
.of-desktop-cockpit .of-mob-quiet{display:inline-flex;align-items:center;gap:5px;background:transparent;color:#5c7a92;border:0;min-height:35px;font-size:11px;font-weight:800;cursor:pointer}
.of-desktop-cockpit #ofMobileQueue .of-mob-section-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.of-desktop-cockpit .of-mob-queue-head,.of-desktop-cockpit #ofMobileFullQueue,.of-desktop-cockpit .of-mob-empty{grid-column:1/-1}
.of-desktop-cockpit .of-mob-candidate{min-width:0;border:1px solid #e2eaf0;border-radius:12px;padding:13px 14px;background:#fff}
.of-desktop-cockpit .of-mob-candidate>div{display:flex;align-items:center;justify-content:space-between;gap:10px}
.of-desktop-cockpit .of-mob-status{font-size:9px;color:#a55a24;background:#fff2e6;border-radius:5px;padding:5px 7px;font-weight:850}
.of-desktop-cockpit .of-mob-source{font-size:10px;color:#8194a6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:50%}
.of-desktop-cockpit .of-mob-candidate h3{font-size:14px;color:#193e5a;margin:10px 0 6px;font-weight:900;overflow-wrap:anywhere}
.of-desktop-cockpit .of-mob-candidate p{font-size:10px;color:#7c8d9c;line-height:1.5;margin:0 0 9px}
.of-desktop-cockpit .of-mob-candidate-action{display:flex;gap:6px;align-items:center;color:#a65b2b;font-size:11px;font-weight:850;border:0;border-top:1px solid #ebf0f4;padding:10px 0 0;background:transparent;cursor:pointer;width:100%;text-align:left}
.of-desktop-cockpit #ofMobileFullQueue .of-pipeline{margin:0;padding:0;border:0;box-shadow:none}
.of-desktop-cockpit #ofMobileFullQueue .of-pipeline .of-head-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.of-desktop-cockpit #ofMobileFullQueue .of-pipeline .of-jobs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.of-desktop-cockpit .of-mobile-status-filter{display:none}
.of-desktop-cockpit #ofMobileTeam .of-office{margin:0}
.of-desktop-cockpit #ofMobileTeam .of-office-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.of-desktop-cockpit .of-mob-money-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:610px;margin-bottom:13px}
.of-desktop-cockpit .of-mob-money-grid>div{background:#f0f7f5;border-radius:11px;display:flex;flex-direction:column;gap:5px;padding:14px}
.of-desktop-cockpit .of-mob-money-grid small{font-size:11px;color:#607e73}
.of-desktop-cockpit .of-mob-money-grid strong{font-size:19px;color:#0d7a5e;font-weight:900}
.of-desktop-cockpit .of-mob-help,.of-desktop-cockpit .of-mob-proposal p,.of-desktop-cockpit .of-mob-empty{font-size:12px;color:#73899b;line-height:1.65;margin-bottom:12px}
.of-desktop-cockpit .of-mob-subsection{border:1px solid #e1e9ef;border-radius:12px;margin:10px 0;background:#fff}
.of-desktop-cockpit .of-mob-subsection>summary{display:flex;align-items:center;justify-content:space-between;gap:8px;list-style:none;padding:13px 16px;cursor:pointer;color:#264d69;font-size:12px;font-weight:850}
.of-desktop-cockpit .of-mob-subsection>summary::-webkit-details-marker{display:none}
.of-desktop-cockpit .of-mob-subsection[open]>summary{border-bottom:1px solid #e7edf3}
.of-desktop-cockpit .of-mob-subsection[open]>summary svg{transform:rotate(180deg)}
.of-desktop-cockpit .of-mob-subsection-content{padding:16px}
.of-desktop-cockpit .of-mob-subsection-content .of-fin-table-wrap{max-width:100%;overflow-x:auto}
.of-desktop-cockpit .of-mob-subsection-content .of-fin-table{min-width:680px}
.of-desktop-cockpit .of-mob-footer{grid-column:1/-1;border-top:1px solid #e1e9ee;padding:14px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:9px;color:#8498a9;font-size:11px}
.of-desktop-cockpit .of-mob-footer button{display:flex;align-items:center;gap:5px;border:0;background:transparent;color:#2d6586;font-weight:800;cursor:pointer}
.of-desktop-cockpit .of-mob-footer p{flex-basis:100%;font-size:10px;margin:0;color:#97a7b4}
.of-desktop-cockpit .of-mob-proposal{display:flex;align-items:center;justify-content:space-between;gap:15px}
.of-desktop-cockpit .of-mob-proposal>p{max-width:600px;margin:0}
@media(min-width:761px) {
 .v2-layout:has(.of-desktop-cockpit) .main{max-width:1490px;padding:18px 23px 75px}
 .v2-layout:has(.of-desktop-cockpit) .topbar{margin:0 0 15px}
 .v2-layout:has(.of-desktop-cockpit) .topbar h1{font-size:25px}
 .v2-layout:has(.of-desktop-cockpit) .topbar p{font-size:11px;line-height:1.5}
 .v2-layout:has(.of-desktop-cockpit) .topbar .eyebrow{display:none}
}
@media(min-width:761px) and (max-width:1160px){
 .of-desktop-cockpit{grid-template-columns:minmax(0,1.2fr) minmax(205px,.8fr);gap:12px}
 .of-desk-flow-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
 .of-desktop-cockpit .of-mob-hero{grid-template-columns:1fr;gap:12px}
 .of-desktop-cockpit .of-mob-hero-top,.of-desktop-cockpit .of-mob-hero h2,.of-desktop-cockpit .of-mob-hero>p,.of-desktop-cockpit .of-mob-metrics,.of-desktop-cockpit .of-mob-hero-foot{grid-column:1;grid-row:auto}
 .of-desktop-cockpit .of-mob-action-board{grid-column:1}
 .of-desktop-cockpit .of-mob-shortcuts{grid-column:2}
 .of-desktop-cockpit #ofMobileFullQueue .of-pipeline .of-jobs{grid-template-columns:1fr}
}
@media(min-width:761px) and (max-width:940px){
 .of-desktop-cockpit{grid-template-columns:1fr}
 .of-desktop-cockpit .of-mob-action-board,.of-desktop-cockpit .of-mob-shortcuts{grid-column:1}
 .of-desktop-cockpit .of-mob-shortcuts{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:80px}
 .of-desktop-cockpit .of-mob-queue-head{flex-wrap:wrap}
 .of-desktop-cockpit .of-mob-hero .of-mob-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* JOB MONEY: overview only; sources and 330 work seats live on /tac-nhan */
.of-overview-only .of-overview-note{background:#fff;border:1px solid #dce6ee;border-radius:15px;padding:18px 21px;margin-top:14px;margin-bottom:14px}
.of-overview-only .of-overview-note h2{font-size:18px;color:#193b55;margin:0 0 6px}
.of-overview-only .of-overview-note p{font-size:12px;color:#688196;line-height:1.65;margin:0 0 17px}
.of-office-main-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.of-office-action{display:flex;gap:12px;align-items:center;min-width:0;border:1px solid #dbe5ee;border-radius:12px;padding:18px 15px;text-decoration:none!important;color:#22455f;background:#f8fafc}
.of-office-action>span{flex:1;min-width:0;display:block}
.of-office-action strong{display:block;font-size:13px;line-height:1.4}
.of-office-action small{display:block;font-size:11px;color:#7890a3;line-height:1.5;margin-top:4px}
.of-office-action:hover{border-color:#d18b55;background:#fff9f3}
.of-office-action-primary{background:#ebf5f6;border-color:#b8dce2}
.of-overview-only #ofMobileTeam{margin:14px 0}
.of-overview-only .of-people-board{padding:0}
.of-overview-only .of-team-section{margin:0}
.of-overview-only .of-mob-footer{line-height:1.7;padding:12px 4px}
@media(max-width:760px){.of-office-main-links{grid-template-columns:1fr}.of-overview-only .of-overview-note{padding:17px}.of-office-action{padding:14px 12px}}

/* Overview card occupies entire desktop grid, eliminating the right-side dead space. */
@media(min-width:761px){
 .of-desktop-cockpit.of-overview-only .of-overview-note{
   grid-column:1/-1;
   display:grid;
   grid-template-columns:minmax(245px,.72fr) minmax(0,1.6fr);
   align-items:center;
   column-gap:clamp(18px,3vw,40px);
   padding:21px 25px;
 }
 .of-desktop-cockpit.of-overview-only .of-overview-note>div{min-width:0}
 .of-desktop-cockpit.of-overview-only .of-overview-note p{margin-bottom:0}
 .of-desktop-cockpit.of-overview-only .of-office-main-links{min-width:0}
 .of-desktop-cockpit.of-overview-only .of-office-action{min-height:94px}
 .of-desktop-cockpit.of-overview-only #ofMobileTeam,
 .of-desktop-cockpit.of-overview-only #ofMobileFinance{grid-column:1/-1}
}
@media(min-width:761px) and (max-width:1050px){
 .of-desktop-cockpit.of-overview-only .of-overview-note{grid-template-columns:1fr;row-gap:16px}
 .of-desktop-cockpit.of-overview-only .of-office-action{min-height:76px}
}
@media(max-width:760px){
 .of-overview-only .of-overview-note{display:block;width:100%}
 .of-overview-only .of-office-main-links{grid-template-columns:1fr}
}

/* Customer-order-first workspace. Active orders are actual signed client work. */
.of-inbound-panel{grid-column:1/-1;background:#fff;border:1px solid #dce6ef;border-radius:15px;padding:15px 18px;min-width:0;box-shadow:0 3px 12px #172e4708}
.of-inbound-head{display:flex;align-items:center;justify-content:space-between;gap:13px;padding-bottom:10px;border-bottom:1px solid #e5edf3}
.of-inbound-head>div{display:flex;flex-direction:column;gap:5px}
.of-inbound-head strong{font-weight:850;color:#193852;font-size:16px}
.of-inbound-head small{color:#758c9e;font-size:11px}
.of-inbound-head>a{font-size:12px;color:#1c607c;font-weight:780;text-decoration:none}
.of-inbound-empty{margin:15px 0 0;color:#6e8497;line-height:1.6;font-size:12px}
.of-inbound-order{display:flex;justify-content:space-between;align-items:center;gap:15px;border-bottom:1px solid #eef2f6;padding:13px 3px;text-decoration:none;color:#27465e}
.of-inbound-order:last-child{border-bottom:0}
.of-inbound-order>span{display:flex;flex-direction:column;gap:6px;min-width:0}
.of-inbound-order strong{font-size:13px;overflow-wrap:anywhere}
.of-inbound-order small{font-size:11px;color:#71879a}
@media(max-width:760px){.of-inbound-panel{padding:15px}.of-inbound-head{align-items:flex-start}.of-inbound-head>a{white-space:nowrap}}

/* The service office has its own navigation. Do not mix personal Jobbook tabs. */
.jm-studio-workspace .jm-internal-brand{color:#fff;text-decoration:none;line-height:1.3;padding-bottom:22px}
.jm-studio-workspace .jm-internal-brand .brand-symbol{background:#fff;color:#1a334d;position:relative;font-weight:900;font-size:14px}
.jm-studio-workspace .jm-internal-brand small{font-size:9px;color:#f6b88a;font-weight:780;letter-spacing:.035em}
.jm-studio-workspace .sidebar-nav{gap:5px}
.jm-studio-workspace .sidebar-nav .navbtn{min-height:46px;font-size:12px;font-weight:760;line-height:1.3;padding:11px 12px}
.jm-studio-workspace .sidebar-nav .navbtn span{min-width:0}
.jm-studio-workspace .sidebar-nav .navbtn:hover{background:#304960;color:#fff}
.jm-studio-workspace .sidebar-nav .jm-sidebar-client{margin-top:13px;border-top:1px solid #ffffff21;border-radius:0;padding-top:18px}
.jm-studio-workspace .jm-sidebar-signed-in{overflow-wrap:anywhere;font-weight:700;font-size:11px}
.jm-studio-workspace .jm-sidebar-note{color:#9cb1c3;font-size:10px;line-height:1.65;margin:14px 0 0}
.jm-studio-workspace .bottom-nav .bottom-button{display:grid;justify-items:center;align-content:center;gap:4px;text-decoration:none;color:#8491a2}
.jm-studio-workspace .bottom-nav .bottom-button.active{color:#172e47}
.jm-studio-workspace .bottom-nav .bottom-button .underline{margin-top:1px}
@media(max-width:760px){
 .jm-studio-workspace .bottom-inner{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px}
 .jm-studio-workspace .bottom-button{font-size:11px;white-space:nowrap;min-width:0}
 .jm-studio-workspace .bottom-nav .bottom-button>span:nth-child(2){overflow:hidden;text-overflow:ellipsis;max-width:100%}
}