@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700;800;900&family=Open+Sans:wght@400;600;700;800&display=swap');
:root{
  --ink:#1d1a17;--muted:#6f675d;--line:#e6d9c4;--gold:#caa86a;--gold2:#f5e8c9;
  --paper:#fffdf8;--cream:#faf3e6;--soft:#f4ead8;--coffee:#4b3526;--coffee2:#7a5737;
  --green:#1f7a3f;--red:#8a1738;--blue:#24385d;--shadow:0 22px 60px rgba(75,53,38,.12)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"Open Sans",Arial,sans-serif;background:linear-gradient(180deg,#fffdf8 0%,#faf3e6 52%,#fffaf0 100%);color:var(--ink);letter-spacing:.01em}a{color:inherit}.hp-field{position:absolute;left:-9999px;top:-9999px;height:1px;width:1px;opacity:0}
h1,h2,h3,.qp-brand h1,.qp-topbar h2,.card b{font-family:"Montserrat","Open Sans",Arial,sans-serif;letter-spacing:.025em}.qp-layout{min-height:100vh}.qp-sidebar{position:fixed;inset:0 auto 0 0;width:286px;background:linear-gradient(180deg,#fffdf8,#f6ead3);color:var(--ink);padding:18px 16px;z-index:30;box-shadow:14px 0 42px rgba(75,53,38,.13);overflow:auto;border-right:1px solid var(--line)}.qp-sidebar:before{content:"";position:fixed;left:0;top:0;width:286px;height:8px;background:linear-gradient(90deg,var(--gold),#ead7a9,var(--coffee2));z-index:31}.qp-brand{display:flex;gap:12px;align-items:center;padding:12px 8px 18px;border-bottom:1px solid var(--line);margin-bottom:14px}.qp-logo{width:52px;height:52px;border-radius:50%;background:#fff;border:1px solid #d8c39b;color:var(--coffee);display:grid;place-items:center;font-size:25px;box-shadow:0 10px 25px rgba(75,53,38,.12)}.qp-brand h1{margin:0;font-size:21px;color:#161410}.qp-sub{font-size:10px;font-weight:1000;letter-spacing:.16em;color:#7a5737;margin-top:4px}.login-sub{color:#8a6a1d}.qp-user{font-size:12px;color:var(--muted);font-weight:800;margin:12px 8px 18px;line-height:1.42;background:#fff;border:1px solid var(--line);border-radius:18px;padding:12px}.qp-user b{color:var(--coffee)}.qp-nav{display:grid;gap:9px}.qp-nav a{display:flex;align-items:center;gap:10px;text-decoration:none;border-radius:18px;padding:10px 12px;font-size:14px;font-weight:1000;color:#3d3025;border:1px solid transparent;background:transparent}.qp-nav a.active{background:#fff;border-color:#d8bd7a;color:#4b3526;box-shadow:0 12px 26px rgba(75,53,38,.08)}.qp-nav a:hover{background:#fff8eb;border-color:#ead7a9}.qp-nav .logout{margin-top:12px;background:#8a1738;color:white;border-color:#8a1738}.qp-nav .logout:hover{background:#74112f;color:white}.nav-ico,.btn-ico,.icon,.head-ico,.status-ico{display:inline-block;transition:transform .18s ease,filter .18s ease}.qp-nav a:hover .nav-ico,.btn:hover .btn-ico,.card:hover .icon,.status-badge:hover .status-ico,button:hover .btn-ico{transform:scale(1.14) rotate(-7deg)}.qp-topbar{margin-left:286px;min-height:80px;background:rgba(255,253,248,.96);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 26px}.qp-topbar h2{margin:0;font-size:25px;color:#171511}.qp-topbar p{margin:5px 0 0;color:var(--muted);font-weight:800}.qp-main{margin-left:286px;padding:26px;background:linear-gradient(135deg,#fffdf8,#f3e5c8);min-height:calc(100vh - 80px)}.panel,.card{background:rgba(255,253,248,.98);border:1px solid var(--line);border-radius:26px;padding:20px;margin-bottom:18px;box-shadow:var(--shadow)}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.card{min-height:146px;text-decoration:none;color:inherit;position:relative;overflow:hidden}.card:after{content:"";position:absolute;right:-36px;top:-42px;width:118px;height:118px;border-radius:50%;background:#f3dfad66}.card .icon{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:21px;background:#fff4d9;color:var(--coffee);border:1px solid #e2c790;margin-bottom:12px;position:relative;z-index:1}.card small{color:var(--muted);font-weight:1000;text-transform:uppercase;letter-spacing:.07em}.card b{display:block;font-size:27px;margin-top:7px;color:#171511}.muted{color:var(--muted);font-weight:800}.note{padding:14px 16px;border-radius:18px;background:#fff8e9;border:1px solid #ead7a9;font-weight:800;line-height:1.45}.grid{display:grid;grid-template-columns:420px minmax(0,1fr);gap:18px;align-items:start}.table-wrap{overflow:auto;border-radius:20px;border:1px solid var(--line);background:#fffdf8}table{width:100%;border-collapse:collapse;min-width:900px}th{background:linear-gradient(135deg,#4b3526,#7a5737);color:#fff8e8;text-align:left;font-size:12px;padding:13px;text-transform:uppercase;letter-spacing:.07em}td{padding:12px 13px;border-bottom:1px solid #f1dfb5;font-size:14px}tr:hover td{background:#fff8e9}.badge,.status-badge{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border-radius:999px;font-weight:1000;font-size:12px}.badge{background:#fff1cd;color:#5c3e20;border:1px solid #e5ca84}.okb,.available{background:#e6f7ec;color:#166534}.low{background:#fef3c7;color:#92400e}.out,.cancelled,.unavailable{background:#fee2e2;color:#991b1b}.pending{background:#fff1cd;color:#795328}.confirmed{background:#f5e8c9;color:#5c3e20}.occupied,.checked_in{background:#eee4d0;color:#4b3526}.completed{background:#dcfce7;color:#166534}.maintenance{background:#f8e3e6;color:#8a1738}.cleaning{background:#e5f2ef;color:#286052}.reserved{background:#fff1cd;color:#795328}label{font-size:12px;font-weight:1000;color:#61574c;display:block;margin:10px 0 6px;text-transform:uppercase;letter-spacing:.055em}input,select,textarea{width:100%;border-radius:16px;border:1px solid #d7c291;background:#fffdf8;padding:12px 13px;font-weight:800;font-size:14px;color:#1f2937}input:focus,select:focus,textarea:focus{outline:2px solid #f2db9d;border-color:#caa86a}textarea{min-height:96px;resize:vertical}.btn,button{border:0;border-radius:999px;background:linear-gradient(135deg,var(--coffee2),var(--coffee));color:#fff8e8;font-weight:1000;padding:8px 11px;font-size:12px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:7px;box-shadow:0 12px 24px rgba(75,53,38,.18)}.btn.light,button.light{background:#fff8e9;color:#4b3526;border:1px solid #dec483;box-shadow:none}.btn.red,button.red{background:#8a1738;color:white}.actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:14px}.msg{padding:12px 14px;border-radius:16px;margin-bottom:14px;font-weight:900}.msg.ok{background:#dcfce7;color:#166534;border:1px solid #86efac}.msg.err{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}.topline{display:flex;justify-content:space-between;gap:12px;align-items:end;flex-wrap:wrap;margin-bottom:12px}.search{display:flex;gap:10px;align-items:end;min-width:320px}.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}.stat{background:#fff8e9;border:1px solid #ead7a9;border-radius:20px;padding:15px}.stat b{display:block;font-size:23px;color:#171511;font-family:"Montserrat","Open Sans",Arial,sans-serif}.stat small{font-weight:1000;color:var(--muted);text-transform:uppercase}.modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(75,53,38,.55);z-index:99;padding:18px}.modal.open{display:flex}.modal-box{width:min(820px,100%);max-height:92vh;overflow:auto;background:#fffdf8;border:1px solid #d6ad58;border-top:5px solid var(--gold);border-radius:28px;padding:22px;box-shadow:0 30px 90px #0005}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:10px}.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 10%,#fff4d9,#faf3e6 48%,#fffdf8)}.login-card{width:min(480px,100%);background:#fffdf8;border:1px solid #ead7a9;border-radius:30px;padding:32px;box-shadow:0 25px 70px rgba(75,53,38,.18)}.login-card h1{font-size:28px;margin:0 0 4px}.login-card input{height:50px;margin:7px 0 14px}.login-card button{width:100%;justify-content:center;height:48px}.brand-mini{display:flex;gap:12px;align-items:center;margin-bottom:20px}.brand-mini .qp-logo{flex:0 0 auto}.public-wrap{width:min(1120px,100%);margin:auto;padding:24px}.public-link{word-break:break-all}.form-panel{position:sticky;top:96px}.table-wrap table tbody tr td:first-child b{letter-spacing:.02em}.status-badge{box-shadow:inset 0 0 0 1px #ffffff6b}input[type="checkbox"]{width:auto;height:auto;margin-right:8px}.form-inline{display:inline-flex;gap:8px;align-items:center}@media(max-width:1100px){.grid{grid-template-columns:1fr}.qp-sidebar{width:250px}.qp-sidebar:before{width:250px}.qp-topbar,.qp-main{margin-left:250px}}@media(max-width:820px){.qp-sidebar{position:static;width:auto;border-radius:0}.qp-sidebar:before{display:none}.qp-topbar,.qp-main{margin-left:0}.qp-topbar{position:static;display:block}.qp-nav{grid-template-columns:repeat(2,1fr)}.qp-main{padding:14px}.search{width:100%;min-width:0;display:grid}.cards{grid-template-columns:1fr}.qp-brand h1{font-size:18px}.two-col{grid-template-columns:1fr}.form-panel{position:static}.btn,button{font-size:12px;padding:8px 10px}}@media(max-width:520px){.qp-nav{grid-template-columns:1fr}.actions{display:grid}.btn,button{justify-content:center}table{min-width:780px}.qp-topbar h2{font-size:21px}.panel,.card{border-radius:22px;padding:16px}}@media print{.qp-sidebar,.qp-topbar,.actions,.search,.form-panel{display:none!important}.qp-main{margin:0;padding:0}.panel,.card{box-shadow:none}}


/* V141 compact backend tables and responsive modal polish */
.kpi-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:16px}.kpi-mini{background:#fff8e9;border:1px solid #ead7a9;border-radius:18px;padding:12px}.kpi-mini small{display:block;color:var(--muted);font-weight:1000;text-transform:uppercase;font-size:10px;letter-spacing:.07em}.kpi-mini b{display:block;font-family:"Montserrat","Open Sans",Arial,sans-serif;font-size:22px;margin-top:4px}.compact-table table{min-width:720px}.compact-table th,.compact-table td{padding:10px 12px}.cell-title{font-weight:1000;color:#191713}.cell-sub{display:block;color:var(--muted);font-size:12px;font-weight:800;margin-top:3px}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.detail-box{border:1px solid var(--line);background:#fff8e9;border-radius:18px;padding:13px;min-width:0}.detail-box small{display:block;color:var(--muted);font-weight:1000;text-transform:uppercase;font-size:10px;letter-spacing:.07em;margin-bottom:4px}.detail-box b,.detail-box span{word-break:break-word}.modal-box.modal-wide{width:min(1040px,100%)}.modal-box.modal-mid{width:min(760px,100%)}.table-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.table-actions form{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin:0}.table-actions select{width:auto;min-width:136px;padding:8px 10px;border-radius:999px;font-size:12px}.page-intro{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.page-intro h2{margin:0}.page-intro p{margin:6px 0 0}.btn.slim,button.slim{padding:7px 10px;font-size:11px}.modal .actions{position:sticky;bottom:-22px;background:linear-gradient(180deg,rgba(255,253,248,.72),#fffdf8);padding-top:12px}.qp-main .panel{overflow:hidden}@media(max-width:760px){.detail-grid{grid-template-columns:1fr}.modal{align-items:flex-start;padding:10px}.modal-box{max-height:94vh;border-radius:22px;padding:16px}.compact-table table{min-width:660px}.table-actions select{min-width:120px}.page-intro{display:block}.topline{align-items:stretch}.topline .actions,.topline form.search{width:100%}.table-actions{display:grid;grid-template-columns:1fr}.table-actions .btn,.table-actions button,.table-actions select{width:100%;justify-content:center}.kpi-strip{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.kpi-strip{grid-template-columns:1fr}.compact-table table{min-width:600px}.qp-main{padding:12px}.qp-topbar{padding:14px}.modal-box h2{font-size:20px}}


/* V142 JS pagination/search polish */
.js-table-controls{display:grid;grid-template-columns:minmax(220px,1.4fr) repeat(2,minmax(150px,.8fr)) auto auto;gap:10px;align-items:end}.js-table-controls button,.js-table-controls .btn{white-space:nowrap}.qp-js-pager{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 2px 0;margin-top:12px;border-top:1px solid #ead7a9}.qp-page-info,.qp-page-count{font-weight:1000;color:#4b3526}.qp-page-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.qp-page-size{width:auto;min-width:112px;border-radius:999px;padding:8px 12px;font-size:12px}button:disabled{opacity:.45;cursor:not-allowed}.table-wrap table tbody tr[hidden]{display:none!important}.compact-table table{table-layout:auto}.compact-table td,.compact-table th{vertical-align:middle}.inventory-table table,.rooms-table table{min-width:760px}@media(max-width:900px){.js-table-controls{grid-template-columns:1fr 1fr}.js-table-controls div:first-child{grid-column:1/-1}.qp-js-pager{align-items:stretch;flex-direction:column}.qp-page-actions{justify-content:space-between}}@media(max-width:560px){.js-table-controls{grid-template-columns:1fr}.qp-page-actions{display:grid;grid-template-columns:1fr;gap:8px}.qp-page-size{width:100%}.inventory-table table,.rooms-table table{min-width:680px}}

/* V145 typography standard: Montserrat headings, Open Sans body */
body, input, select, textarea, button, .btn, table, td, th, label, p, a, small, span, div{font-family:"Open Sans",Arial,Helvetica,sans-serif}
h1,h2,h3,h4,h5,h6,.brand b,.qp-brand h1,.qp-topbar h2,.card b,.room-top b,.product-card b,.section-heading h2,.contact-feature-card h2,.contact-note-panel h2,.contact-action-panel h2,.public-room h3,.hotel-hero h1,.hero-copy h1,.page-hero h1{font-family:"Montserrat","Open Sans",Arial,sans-serif}
.receipt-paper,.receipt-paper *{font-family:"Courier New",monospace}

/* V146 smaller system typography */
body{font-size:14px}.qp-main h1,.qp-main h2,.qp-main h3,.backend-title{letter-spacing:.01em}.qp-btn,.btn,.backend-btn{font-size:12.5px}.qp-table th,.qp-table td,table th,table td{font-size:13px}.modal,.qp-modal{font-size:13.5px}


/* V148 professional backend dashboard reporting */
.dashboard-reporting .panel{overflow:hidden}.report-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;background:linear-gradient(135deg,#fffdf8,#fff6e4);border-top:4px solid var(--gold)}.eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid #e4c780;background:#fff7e4;color:#6f4d28;border-radius:999px;padding:6px 10px;font-size:10px;font-weight:1000;letter-spacing:.16em;text-transform:uppercase}.report-hero h2,.chart-panel h2{margin:10px 0 6px}.hero-metrics{display:grid;grid-template-columns:repeat(3,minmax(130px,1fr));gap:10px;min-width:min(520px,100%)}.hero-metrics div,.report-kpi{border:1px solid #ead7a9;background:#fff;border-radius:22px;padding:14px;box-shadow:0 12px 28px rgba(75,53,38,.07)}.hero-metrics small,.report-kpi small{display:block;color:var(--muted);font-size:10px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase}.hero-metrics b,.report-kpi b{display:block;margin-top:6px;font-family:"Montserrat","Open Sans",Arial,sans-serif;font-size:22px;color:#171511}.report-kpis{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:14px;margin-bottom:18px}.report-kpi{text-decoration:none;display:grid;gap:4px;min-height:118px}.report-kpi span{width:38px;height:38px;border:1px solid #ead7a9;border-radius:50%;display:grid;place-items:center;background:#fff8e9;transition:transform .18s ease}.report-kpi:hover span{transform:scale(1.12) rotate(-7deg)}.report-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.chart-wide{grid-column:1/-1}.chart-head{display:flex;align-items:start;justify-content:space-between;gap:12px;margin-bottom:14px}.bar-chart{display:grid;gap:12px}.bar-row{display:grid;grid-template-columns:minmax(150px,.9fr) minmax(180px,1.4fr) auto;gap:12px;align-items:center;border:1px solid #f0dfb6;background:#fffaf0;border-radius:18px;padding:11px 12px}.bar-meta b,.vbar-label b{display:block;font-family:"Montserrat","Open Sans",Arial,sans-serif;color:#1d1a17;font-size:13px}.bar-meta small,.vbar-label small{display:block;color:var(--muted);font-weight:800;font-size:11px;margin-top:2px}.bar-row strong,.vbar-value{font-family:"Montserrat","Open Sans",Arial,sans-serif;font-size:13px;color:#4b3526;white-space:nowrap;text-align:right}.bar-row progress,.vbar-row progress{width:100%;height:16px;border:0;border-radius:999px;overflow:hidden;background:#f0e2bf}.bar-row progress::-webkit-progress-bar,.vbar-row progress::-webkit-progress-bar{background:#f0e2bf;border-radius:999px}.bar-row progress::-webkit-progress-value,.vbar-row progress::-webkit-progress-value{background:linear-gradient(90deg,#b8873b,#d8b568,#7a5737);border-radius:999px}.bar-row progress::-moz-progress-bar,.vbar-row progress::-moz-progress-bar{background:linear-gradient(90deg,#b8873b,#d8b568,#7a5737);border-radius:999px}.vertical-chart{gap:10px}.vbar-row{display:grid;grid-template-columns:120px minmax(220px,1fr) 115px;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #f1dfb5}.vbar-row:last-child{border-bottom:0}.compact-bars .bar-row{grid-template-columns:minmax(120px,.8fr) minmax(160px,1.5fr) 52px}@media(max-width:1100px){.report-grid{grid-template-columns:1fr}.report-kpis{grid-template-columns:repeat(2,1fr)}.report-hero{display:block}.hero-metrics{margin-top:14px}}@media(max-width:700px){.hero-metrics,.report-kpis{grid-template-columns:1fr}.bar-row,.compact-bars .bar-row{grid-template-columns:1fr}.bar-row strong{text-align:left}.vbar-row{grid-template-columns:1fr}.vbar-value{text-align:left}.chart-head{display:block}.chart-head .btn{margin-top:10px}.dashboard-reporting .panel{padding:16px}}

/* V149: dashboard sales performance chart like executive report card */
.sales-performance-card{background:#fff;border-radius:30px;border:1px solid #ece7dc;box-shadow:0 28px 70px rgba(22,22,30,.10);padding:28px 32px}.perf-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:22px}.perf-head h2{font-size:34px;letter-spacing:.03em;margin:8px 0 4px;color:#111827}.growth-badge{display:grid;grid-template-columns:48px auto;gap:10px;align-items:center;background:#f4f0ff;border:1px solid #e9ddff;border-radius:24px;padding:12px 16px;min-width:170px}.growth-badge span{grid-row:1/3;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:#ebe5ff;color:#5b48d7;font-size:24px;font-weight:1000}.growth-badge b{font-size:24px;color:#4f3fd1;font-family:"Montserrat","Open Sans",Arial,sans-serif}.growth-badge small{color:#6b7280;font-weight:900}.perf-chart-wrap{display:grid;grid-template-columns:78px 1fr;gap:18px;min-height:360px}.perf-y-axis{display:flex;flex-direction:column;justify-content:space-between;text-align:right;color:#667085;font-weight:900;font-size:13px;padding:8px 0 48px}.perf-chart{position:relative;display:grid;grid-template-columns:repeat(7,minmax(70px,1fr));gap:22px;align-items:end;border-left:1px solid #d8dee8;border-bottom:1px solid #d8dee8;padding:18px 14px 0;background:repeating-linear-gradient(to bottom,transparent 0,transparent 72px,#e7eaf2 73px,#e7eaf2 74px)}.perf-day{height:320px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:8px;min-width:0}.perf-value{font-family:"Montserrat","Open Sans",Arial,sans-serif;font-weight:1000;color:#4438ca;font-size:13px;white-space:nowrap}.perf-bar-track{height:230px;width:62px;display:flex;align-items:flex-end;justify-content:center}.perf-bar{display:block;width:62px;min-height:8px;border-radius:12px 12px 3px 3px;background:linear-gradient(180deg,#7662ff,#4f46e5);box-shadow:0 14px 30px rgba(79,70,229,.26)}.perf-day b{font-family:"Open Sans",Arial,sans-serif;font-size:13px;color:#344054}.perf-day small{font-size:11px;color:#667085;font-weight:800}.perf-summary-strip{margin-top:24px;display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:#f7f7fc;border:1px solid #eeeef8;border-radius:22px;padding:16px 18px;box-shadow:inset 0 1px 0 #fff}.perf-summary-strip div{display:grid;grid-template-columns:42px 1fr;gap:6px 12px;align-items:center;padding:4px 20px;border-right:1px solid #dedfec}.perf-summary-strip div:last-child{border-right:0}.perf-summary-strip span{grid-row:1/3;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:#ece9ff;color:#5b48d7;font-weight:1000;font-size:20px}.perf-summary-strip b{font-size:19px;color:#111827;font-family:"Montserrat","Open Sans",Arial,sans-serif}.perf-summary-strip small{grid-column:2;color:#667085;font-weight:900}.perf-h-5{height:5%}.perf-h-10{height:10%}.perf-h-15{height:15%}.perf-h-20{height:20%}.perf-h-25{height:25%}.perf-h-30{height:30%}.perf-h-35{height:35%}.perf-h-40{height:40%}.perf-h-45{height:45%}.perf-h-50{height:50%}.perf-h-55{height:55%}.perf-h-60{height:60%}.perf-h-65{height:65%}.perf-h-70{height:70%}.perf-h-75{height:75%}.perf-h-80{height:80%}.perf-h-85{height:85%}.perf-h-90{height:90%}.perf-h-95{height:95%}.perf-h-100{height:100%}@media(max-width:1000px){.perf-chart{gap:12px;overflow-x:auto;grid-template-columns:repeat(7,86px)}.perf-summary-strip{grid-template-columns:repeat(2,1fr)}.perf-summary-strip div:nth-child(2){border-right:0}.perf-summary-strip div:nth-child(-n+2){border-bottom:1px solid #dedfec;padding-bottom:14px}.perf-summary-strip div:nth-child(n+3){padding-top:14px}}@media(max-width:620px){.sales-performance-card{padding:18px;border-radius:24px}.perf-head{display:block}.growth-badge{margin-top:12px}.perf-head h2{font-size:24px}.perf-chart-wrap{grid-template-columns:1fr}.perf-y-axis{display:none}.perf-summary-strip{grid-template-columns:1fr}.perf-summary-strip div{border-right:0!important;border-bottom:1px solid #dedfec!important;padding:12px 4px!important}.perf-summary-strip div:last-child{border-bottom:0!important}.perf-chart{grid-template-columns:repeat(7,74px)}}

/* V150 dashboard chart safety and stronger reporting display */
.sales-performance-card{min-height:620px}.perf-chart-wrap{min-height:395px}.perf-chart{min-height:330px}.perf-day{height:335px}.perf-bar-track{height:245px}.perf-bar{opacity:1!important;display:block!important}.perf-h-5{height:5%!important}.perf-h-10{height:10%!important}.perf-h-15{height:15%!important}.perf-h-20{height:20%!important}.perf-h-25{height:25%!important}.perf-h-30{height:30%!important}.perf-h-35{height:35%!important}.perf-h-40{height:40%!important}.perf-h-45{height:45%!important}.perf-h-50{height:50%!important}.perf-h-55{height:55%!important}.perf-h-60{height:60%!important}.perf-h-65{height:65%!important}.perf-h-70{height:70%!important}.perf-h-75{height:75%!important}.perf-h-80{height:80%!important}.perf-h-85{height:85%!important}.perf-h-90{height:90%!important}.perf-h-95{height:95%!important}.perf-h-100{height:100%!important}
.perf-chart:after{content:"";position:absolute;inset:18px 14px 48px 14px;pointer-events:none;background:repeating-linear-gradient(to bottom,transparent 0,transparent 72px,rgba(82,93,121,.16) 73px,rgba(82,93,121,.16) 74px)}.perf-day{position:relative;z-index:2}.growth-badge,.perf-summary-strip span{background:#f4ead8;color:#7a5737}.growth-badge b{color:#7a5737}.perf-bar{background:linear-gradient(180deg,#d8b568,#a77935 55%,#6f4d28);box-shadow:0 16px 32px rgba(167,121,53,.28)}
@media(max-width:620px){.sales-performance-card{min-height:auto}.perf-chart{overflow-x:auto}}

/* V151: secured optional room photo upload */
.room-cell{display:flex;align-items:center;gap:10px;min-width:0}.room-thumb{width:44px;height:44px;border-radius:14px;object-fit:cover;border:1px solid var(--line);background:#fff8e9;box-shadow:0 8px 18px rgba(75,53,38,.08)}.room-modal-photo{width:100%;max-height:330px;object-fit:cover;border-radius:24px;border:1px solid var(--line);background:#fff8e9;margin:4px 0 18px;box-shadow:0 18px 40px rgba(75,53,38,.10)}.current-photo{display:flex;align-items:center;gap:10px;margin-top:8px;background:#fff8e9;border:1px solid var(--line);border-radius:16px;padding:8px}.current-photo img{width:64px;height:48px;object-fit:cover;border-radius:12px}.current-photo span{font-size:12px;color:#6f675d;font-weight:800}@media(max-width:620px){.room-cell{gap:8px}.room-thumb{width:38px;height:38px;border-radius:12px}.room-modal-photo{max-height:240px;border-radius:18px}}

/* V151 secure optional upload previews */
.backend-photo-preview,.room-modal-photo{width:100%;max-height:260px;object-fit:cover;border-radius:20px;border:1px solid var(--line);background:#fff8ee;box-shadow:0 12px 28px rgba(75,53,38,.10)}
.media-detail{grid-column:1/-1;padding:10px}.room-cell{display:flex;align-items:center;gap:10px}.room-thumb{width:46px;height:46px;border-radius:14px;object-fit:cover;border:1px solid var(--line);background:#fff8ee}.current-photo,.upload-current{display:flex;align-items:center;gap:12px;margin-top:10px;padding:10px;border:1px solid var(--line);border-radius:16px;background:#fffaf0}.current-photo img,.upload-current img{width:74px;height:74px;object-fit:cover;border-radius:14px}.field-help{display:block;margin-top:6px;color:var(--muted);font-size:11px;font-weight:800}
@media(max-width:720px){.room-cell{align-items:flex-start}.room-thumb{width:42px;height:42px}.backend-photo-preview,.room-modal-photo{max-height:210px}}


/* V152: unified website button theme */
button,.btn,.action-btn,.submit-btn,input[type="submit"],.table-actions a,.table-actions button{
  background:linear-gradient(135deg,#7a5737,#4b3526)!important;
  color:#fff8e8!important;
  border:1px solid rgba(202,168,106,.6)!important;
  border-radius:999px!important;
  box-shadow:0 10px 22px rgba(75,53,38,.14)!important;
}
button.secondary,.btn.secondary,.ghost-btn,.filter-btn{
  background:#fff5df!important;
  color:#4b3526!important;
  border:1px solid #e2c790!important;
}
button:hover,.btn:hover,.action-btn:hover{transform:none!important;filter:saturate(1.05)}
button span:first-child,.btn span:first-child{display:inline-block;transition:transform .16s ease}
button:hover span:first-child,.btn:hover span:first-child{transform:scale(1.13) rotate(-7deg)}

/* V153: unified website button palette across secured backend */
button,.btn,.qp-btn,.action-btn,a.btn,input[type="submit"],.pager button,.modal button{border-radius:999px!important;border:1px solid #d6ad58!important;background:#fff6e4!important;color:#4b3526!important;font-family:"Open Sans",Arial,sans-serif!important;font-weight:900!important;box-shadow:0 10px 22px rgba(75,53,38,.08)!important;transition:background .16s ease,border-color .16s ease!important}button:hover,.btn:hover,.qp-btn:hover,.action-btn:hover,a.btn:hover,input[type="submit"]:hover,.pager button:hover{background:#fff1cf!important;border-color:#caa86a!important;transform:none!important}.sidebar a.active,.sidebar .active,button.primary,.btn.primary,.qp-btn.primary,input[type="submit"]{background:linear-gradient(135deg,#7a5737,#4b3526)!important;color:#fff8e8!important;border-color:#caa86a!important}.btn-danger,.danger,button.danger{background:#fff6e4!important;color:#4b3526!important;border-color:#d6ad58!important}


/* V156 room type photo manager */
.room-photo-thumb{width:74px!important;height:56px!important;border-radius:14px;object-fit:cover}.room-photo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}.room-photo-grid figure{margin:0;background:#fff8e9;border:1px solid var(--line);border-radius:18px;padding:8px}.room-photo-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px}.room-photo-grid figcaption{font-size:12px;color:var(--muted);font-weight:800;margin-top:6px}


/* V160 colored icon polish across secured backend */
.nav-ico,.btn-ico,.icon,.head-ico,.status-ico,.qp-logo,.card .icon,.modal-head h2::before,.qp-topbar h2::before,label::before,.panel h2::before,.topline h2::before,.table-actions a::before,.table-actions button::before{display:inline-grid;place-items:center;vertical-align:middle;transition:transform .18s ease,filter .18s ease,box-shadow .18s ease}.nav-ico,.btn-ico,.icon,.head-ico,.status-ico{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#fff1cf,#ffe5a8);border:1px solid #e2c790;box-shadow:0 8px 16px rgba(75,53,38,.08)}.qp-nav a:nth-child(2n) .nav-ico{background:linear-gradient(135deg,#e8f3ff,#cfe5ff)}.qp-nav a:nth-child(3n) .nav-ico{background:linear-gradient(135deg,#eaffef,#c7f3d1)}.qp-nav a:nth-child(4n) .nav-ico{background:linear-gradient(135deg,#fff0f5,#ffd3e3)}.btn-ico{width:24px;height:24px;font-size:13px}.card .icon{width:50px;height:50px}.qp-logo:hover,.qp-nav a:hover .nav-ico,button:hover .btn-ico,.btn:hover .btn-ico,.card:hover .icon,.status-badge:hover .status-ico,.modal-head:hover h2::before,.topline:hover h2::before,.panel:hover h2::before{transform:scale(1.13) rotate(-7deg);filter:saturate(1.15)}.qp-topbar h2::before{content:"📌";width:38px;height:38px;margin-right:10px;border-radius:50%;background:#fff1cf;border:1px solid #e2c790;font-size:18px}.panel h2::before,.topline h2::before,.modal-head h2::before{content:"✨";width:34px;height:34px;margin-right:8px;border-radius:50%;background:#fff4dc;border:1px solid #ead7a9;font-size:16px}label::before{content:"◆";color:#caa86a;margin-right:6px;font-size:10px}.qp-nav a,.btn,button,.card,.badge,.status-badge,a{transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease}.qp-nav a:hover,.btn:hover,button:hover,.card:hover{transform:translateY(-1px)!important}



/* Integrated HR Payroll */
.payroll-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}.payroll-tabs a{background:#fff;border:1px solid #e5e7eb;padding:10px 14px;border-radius:12px;text-decoration:none;color:#172033;font-weight:800}.payroll-tabs a.active,.payroll-tabs a:hover{background:#172033;color:#fff}.payroll-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.payroll-card{background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:18px;box-shadow:0 8px 22px rgba(17,24,39,.05);margin-bottom:16px}.payroll-kpi small{color:#6b7280;font-weight:800}.payroll-kpi b{display:block;font-size:24px;margin-top:7px}.payroll-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.payroll-form label{font-weight:800;font-size:13px}.payroll-form input,.payroll-form select,.payroll-form textarea{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid #e5e7eb;border-radius:12px;background:#fff}.payroll-form textarea{min-height:70px}.payroll-alert{padding:12px 14px;border-radius:14px;margin:12px 0;border:1px solid #bbf7d0;background:#ecfdf5;color:#065f46;font-weight:700}.payroll-alert.err{background:#fef2f2;color:#991b1b;border-color:#fecaca}.payroll-actions{display:flex;gap:8px;flex-wrap:wrap}.badge.success{background:#dcfce7;color:#166534}.badge.danger{background:#fee2e2;color:#991b1b}.employee-login-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top left,#fff3c4,#f6f7fb 45%,#e9eefb);font-family:Arial,Helvetica,sans-serif}.employee-login-card{width:min(430px,92vw);background:#fff;border:1px solid #e5e7eb;border-radius:24px;padding:28px;box-shadow:0 24px 60px rgba(17,24,39,.12)}.employee-login-card input{width:100%;box-sizing:border-box;padding:13px;border:1px solid #e5e7eb;border-radius:12px;margin:7px 0 12px}.employee-portal{min-height:100vh;background:#f6f7fb;padding:24px;font-family:Arial,Helvetica,sans-serif}.employee-wrap{max-width:1100px;margin:0 auto}@media(max-width:900px){.payroll-grid,.payroll-form{grid-template-columns:1fr}.payroll-card table{display:block;overflow:auto}}


/* V161 payroll modal integration */
.payroll-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}.payroll-toolbar h2{margin:0}.payroll-modal{position:fixed;inset:0;z-index:9999;background:rgba(21,17,12,.58);display:none;align-items:center;justify-content:center;padding:18px}.payroll-modal.is-open{display:flex}.payroll-modal-card{width:min(1120px,96vw);max-height:92vh;overflow:auto;background:#fffdf8;border:1px solid #dfc182;border-radius:26px;box-shadow:0 30px 100px rgba(0,0,0,.28);padding:24px}.payroll-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.payroll-modal-head h2{margin:0}.payroll-modal-close{border:1px solid #ead7a9;background:#fff8e9;border-radius:999px;width:42px;height:42px;font-weight:1000;cursor:pointer}.payroll-modal-close:hover{transform:scale(1.08) rotate(8deg)}.payroll-modal .payroll-form{margin-top:4px}.payroll-modal-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:16px}.payroll-check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.payroll-check{border:1px solid #ead7a9;background:#fffaf0;border-radius:18px;padding:14px}.payroll-check b{display:block;font-family:"Montserrat","Open Sans",Arial,sans-serif}.payroll-check small{display:block;color:var(--muted);font-weight:900;margin-top:4px}.payroll-check.ok{border-color:#cfe7ce}.payroll-check.bad{border-color:#efb9b9;background:#fff5f5}.payroll-code{font-family:"Courier New",monospace;background:#fff;border:1px solid #ead7a9;border-radius:14px;padding:12px;overflow:auto;white-space:pre-wrap}@media(max-width:760px){.payroll-modal{align-items:flex-start;padding:10px}.payroll-modal-card{padding:16px;border-radius:20px;max-height:95vh}.payroll-modal-actions .btn,.payroll-modal-actions button{width:100%;justify-content:center}}


/* Premium payroll checkbox controls */
.payroll-modal .qp-check-tile{
  min-height:52px;
  display:flex;
  align-items:center;
  gap:12px;
  margin:10px 0 0;
  padding:12px 14px;
  border:1px solid #ead7a9;
  border-radius:18px;
  background:linear-gradient(135deg,#fffaf0,#fffdf8);
  box-shadow:0 10px 22px rgba(75,53,38,.06);
  cursor:pointer;
  user-select:none;
  text-transform:none;
  letter-spacing:0;
}
.payroll-modal .qp-check-tile:hover{
  border-color:#d6ad58;
  background:linear-gradient(135deg,#fff4d9,#fffdf8);
}
.payroll-modal .qp-check-tile input[type="checkbox"]{
  position:absolute;
  opacity:0;
  width:1px;
  height:1px;
  margin:0;
  pointer-events:none;
}
.payroll-modal .qp-check-box{
  width:24px;
  height:24px;
  flex:0 0 24px;
  border-radius:8px;
  border:2px solid #d6ad58;
  background:#fffdf8;
  display:grid;
  place-items:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 6px 14px rgba(75,53,38,.10);
  transition:all .16s ease;
}
.payroll-modal .qp-check-box::after{
  content:"";
  width:7px;
  height:12px;
  border:solid #fff8e8;
  border-width:0 3px 3px 0;
  transform:rotate(45deg) scale(0);
  margin-top:-2px;
  transition:transform .14s ease;
}
.payroll-modal .qp-check-tile input[type="checkbox"]:checked + .qp-check-box{
  border-color:#7a5737;
  background:linear-gradient(135deg,#d6ad58,#7a5737);
}
.payroll-modal .qp-check-tile input[type="checkbox"]:checked + .qp-check-box::after{
  transform:rotate(45deg) scale(1);
}
.payroll-modal .qp-check-tile input[type="checkbox"]:focus-visible + .qp-check-box{
  outline:3px solid #f2db9d;
  outline-offset:3px;
}
.payroll-modal .qp-check-text{
  color:#4b3526;
  font-size:12px;
  font-weight:1000;
  letter-spacing:.06em;
  text-transform:uppercase;
  line-height:1.25;
}


/* V202 employee portal responsive tabs + security-safe external styles */
html,body{max-width:100%;overflow-x:hidden}.employee-portal{min-height:100vh!important;background:linear-gradient(135deg,#f7f8fc,#fffaf0)!important;padding:clamp(12px,2.8vw,28px)!important;font-family:"Open Sans",Arial,sans-serif!important}.employee-wrap{width:min(1160px,100%)!important;margin:0 auto!important}.employee-portal .panel{border-radius:clamp(18px,2.4vw,28px)!important;padding:clamp(16px,2.4vw,24px)!important}.employee-portal .topline{align-items:center!important}.employee-position-title{font-size:18px!important;line-height:1.25!important}.employee-login-submit{width:100%!important;justify-content:center!important}
.employee-tabs{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important;margin:18px 0!important;padding:12px!important;border:1px solid #ead7a9!important;border-radius:24px!important;background:rgba(255,253,248,.92)!important;box-shadow:0 20px 55px rgba(75,53,38,.10)!important}.employee-tabs .employee-tab{min-height:58px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;text-align:center!important;text-decoration:none!important;border:1px solid #ead7a9!important;background:linear-gradient(135deg,#fffdf8,#fff6e4)!important;color:#4b3526!important;border-radius:18px!important;padding:12px 14px!important;font-family:"Montserrat","Open Sans",Arial,sans-serif!important;font-size:13px!important;font-weight:900!important;letter-spacing:.01em!important;line-height:1.15!important;box-shadow:0 10px 24px rgba(75,53,38,.06)!important;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease!important}.employee-tabs .employee-tab:hover{transform:translateY(-2px)!important;border-color:#d6ad58!important;background:linear-gradient(135deg,#fff6dc,#fffdf8)!important;box-shadow:0 16px 32px rgba(75,53,38,.12)!important}.employee-tabs .employee-tab.active{background:linear-gradient(135deg,#24385d,#0b1b38)!important;color:#fff8e8!important;border-color:#caa86a!important;box-shadow:0 18px 38px rgba(11,27,56,.18)!important}.employee-tabs .tab-ico{width:32px!important;height:32px!important;min-width:32px!important;display:inline-grid!important;place-items:center!important;border-radius:50%!important;background:linear-gradient(135deg,#fff1cf,#ffe6ad)!important;border:1px solid #e2c790!important;color:#7a5737!important;font-size:15px!important;box-shadow:0 8px 16px rgba(75,53,38,.08)!important}.employee-tabs .employee-tab.active .tab-ico{background:#fffdf8!important;color:#7a5737!important}.employee-module-title{display:flex!important;align-items:center!important;gap:10px!important;margin:0 0 8px!important}.employee-module-title .btn-ico{width:40px!important;height:40px!important}.payroll-span-all{grid-column:1/-1!important}.employee-empty{padding:18px!important;color:#6c6258!important;font-weight:800!important}.employee-portal .payroll-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}.employee-portal .payroll-card{min-width:0!important}.employee-portal .table-wrap{width:100%!important;overflow:auto!important;-webkit-overflow-scrolling:touch!important}.employee-portal .table-wrap table{min-width:760px!important}.employee-portal input,.employee-portal select,.employee-portal textarea{font-size:16px!important}.employee-portal .payroll-modal-card{width:min(980px,96vw)!important}.employee-portal .payroll-form{grid-template-columns:repeat(3,minmax(0,1fr))!important}.payroll-tabs{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;gap:10px!important}.payroll-tabs a{text-align:center!important;white-space:normal!important}
@media(max-width:1100px){.employee-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important}.employee-portal .payroll-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.employee-portal .payroll-form{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:760px){.employee-portal{padding:10px!important}.employee-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;padding:10px!important;border-radius:20px!important}.employee-tabs .employee-tab{min-height:54px!important;padding:10px 8px!important;font-size:12px!important}.employee-tabs .tab-ico{width:28px!important;height:28px!important;min-width:28px!important;font-size:13px!important}.employee-portal .topline{display:grid!important;grid-template-columns:1fr!important;align-items:start!important}.employee-portal .payroll-actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important}.employee-portal .btn,.employee-portal button{width:100%!important;justify-content:center!important}.employee-portal .payroll-grid{grid-template-columns:1fr!important}.employee-portal .payroll-form{grid-template-columns:1fr!important}.payroll-span-all{grid-column:auto!important}.employee-portal .payroll-modal{align-items:flex-start!important;padding:8px!important}.employee-portal .payroll-modal-card{border-radius:20px!important;padding:16px!important;max-height:94vh!important}.employee-portal .payroll-modal-actions{display:grid!important;grid-template-columns:1fr!important}}
@media(max-width:430px){.employee-tabs{grid-template-columns:1fr!important}.employee-tabs .employee-tab{justify-content:flex-start!important;text-align:left!important}.employee-portal .panel{padding:14px!important}.employee-portal h2{font-size:20px!important}.employee-portal .payroll-kpi b{font-size:20px!important}.employee-portal .table-wrap table{min-width:650px!important}}
@media print{.employee-tabs,.employee-portal .btn,.employee-portal button,.payroll-modal{display:none!important}.employee-portal{background:#fff!important;padding:0!important}.employee-portal .panel,.employee-portal .payroll-card{box-shadow:none!important}}

/* V202 employee login no inline CSS */
.employee-login-icon{font-size:44px!important}.employee-login-note{margin-top:14px!important}

/* V203 professional employee payroll portal polish */
.employee-portal{
  background:
    radial-gradient(circle at 15% 0%, rgba(202,168,106,.18), transparent 32%),
    linear-gradient(180deg,#f8f9fc 0%,#fffdf8 48%,#f8f3ea 100%)!important;
  color:#151515!important;
}
.employee-wrap{width:min(1180px,calc(100vw - 34px))!important}
.employee-portal .panel{
  background:rgba(255,255,255,.94)!important;
  border:1px solid rgba(214,190,145,.72)!important;
  box-shadow:0 18px 48px rgba(31,42,68,.08), 0 1px 0 rgba(255,255,255,.88) inset!important;
}
.employee-portal > .employee-wrap > .panel:first-child{
  position:relative!important;
  overflow:hidden!important;
  background:linear-gradient(135deg,#ffffff 0%,#fffaf0 100%)!important;
  border-top:4px solid #caa86a!important;
}
.employee-portal > .employee-wrap > .panel:first-child:after{
  content:"";position:absolute;right:-70px;top:-90px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,rgba(202,168,106,.18),transparent 68%);pointer-events:none;
}
.employee-portal .eyebrow{
  display:inline-flex!important;align-items:center!important;gap:8px!important;
  min-height:28px!important;padding:6px 12px!important;border-radius:999px!important;
  background:#fff8e9!important;border:1px solid #d6ad58!important;color:#5b4028!important;
  font:900 10px/1 "Montserrat","Open Sans",Arial,sans-serif!important;letter-spacing:.16em!important;
}
.employee-portal h2{
  color:#101828!important;letter-spacing:-.01em!important;font-weight:900!important;
}
.employee-portal .muted{color:#5f6673!important;font-weight:800!important}
.employee-tabs{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:10px!important;margin:20px 0!important;padding:8px!important;
  border:1px solid rgba(214,190,145,.72)!important;border-radius:22px!important;
  background:rgba(255,255,255,.78)!important;backdrop-filter:blur(14px)!important;
  box-shadow:0 16px 40px rgba(31,42,68,.08)!important;
}
.employee-tabs .employee-tab{
  min-height:62px!important;justify-content:flex-start!important;gap:12px!important;
  padding:11px 13px!important;border-radius:16px!important;
  background:linear-gradient(180deg,#fff 0%,#fffaf0 100%)!important;
  border:1px solid rgba(214,190,145,.82)!important;color:#2b3445!important;
  box-shadow:none!important;text-align:left!important;
}
.employee-tabs .employee-tab:hover{
  transform:translateY(-1px)!important;background:#fff!important;
  border-color:#caa86a!important;box-shadow:0 12px 26px rgba(31,42,68,.09)!important;
}
.employee-tabs .employee-tab.active{
  background:linear-gradient(135deg,#172033,#24385d)!important;color:#fff!important;
  border-color:#172033!important;box-shadow:0 14px 30px rgba(23,32,51,.18)!important;
}
.employee-tabs .tab-ico{
  width:38px!important;height:38px!important;min-width:38px!important;border-radius:14px!important;
  background:#f8f2e7!important;border:1px solid #dfc182!important;color:#5b4028!important;
  font-size:11px!important;font-weight:1000!important;letter-spacing:.08em!important;
  box-shadow:none!important;
}
.employee-tabs .employee-tab.active .tab-ico{
  background:rgba(255,255,255,.14)!important;border-color:rgba(255,255,255,.35)!important;color:#fff8e8!important;
}
.employee-tabs .tab-label{display:block!important;white-space:normal!important;line-height:1.15!important}
.employee-portal .payroll-card{
  background:#fff!important;border:1px solid #e8edf4!important;border-radius:18px!important;
  box-shadow:0 10px 24px rgba(31,42,68,.06)!important;
}
.employee-portal .payroll-kpi small{color:#667085!important;letter-spacing:.02em!important}
.employee-portal .payroll-kpi b{color:#101828!important;font-size:clamp(20px,2vw,26px)!important}
.employee-portal .btn,.employee-portal button{
  min-height:42px!important;border-radius:14px!important;font-weight:900!important;
  box-shadow:0 10px 22px rgba(75,53,38,.10)!important;
}
.employee-portal .btn.light,.employee-portal button.light{
  background:#fff!important;border:1px solid #d6ad58!important;color:#4b3526!important;
}
.employee-portal .table-wrap{border-radius:18px!important;border-color:#e4d2ad!important;background:#fff!important}
.employee-portal th{background:#172033!important;color:#fff!important;font-size:11px!important;letter-spacing:.08em!important}
.employee-portal td{background:#fff!important;border-bottom:1px solid #edf0f4!important;color:#2b3445!important}
.employee-portal tr:hover td{background:#fffaf0!important}
.employee-module-title .btn-ico,.employee-portal .btn-ico{
  box-shadow:none!important;border-color:#dfc182!important;background:#fff8e9!important;
}
@media(max-width:980px){
  .employee-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .employee-wrap{width:min(100%,calc(100vw - 22px))!important}
}
@media(max-width:640px){
  .employee-tabs{grid-template-columns:1fr!important;padding:8px!important;gap:8px!important}
  .employee-tabs .employee-tab{min-height:54px!important;border-radius:14px!important;padding:10px 12px!important}
  .employee-tabs .tab-ico{width:34px!important;height:34px!important;min-width:34px!important;border-radius:12px!important}
  .employee-portal > .employee-wrap > .panel:first-child{border-top-width:3px!important}
}
@media(max-width:430px){
  .employee-wrap{width:100%!important}
  .employee-portal{padding:8px!important}
  .employee-portal .panel{border-radius:18px!important}
}

/* V204 custom yes/no confirmation modal for payroll actions */
.payroll-confirm-modal{
  position:fixed!important;inset:0!important;z-index:99999!important;
  display:none!important;align-items:center!important;justify-content:center!important;
  padding:18px!important;background:rgba(16,24,40,.62)!important;
  backdrop-filter:blur(8px)!important;
}
.payroll-confirm-modal.is-open{display:flex!important}
.payroll-confirm-card{
  width:min(460px,calc(100vw - 28px))!important;
  background:linear-gradient(135deg,#fff 0%,#fffaf0 100%)!important;
  border:1px solid #d6ad58!important;border-radius:24px!important;
  box-shadow:0 28px 80px rgba(16,24,40,.28),0 1px 0 rgba(255,255,255,.9) inset!important;
  padding:26px!important;text-align:center!important;color:#101828!important;
  animation:qpConfirmIn .16s ease-out!important;
}
.payroll-confirm-icon{
  width:58px!important;height:58px!important;margin:0 auto 14px!important;border-radius:18px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  background:#fff4da!important;border:1px solid #d6ad58!important;color:#6b421f!important;
  font-size:25px!important;font-weight:1000!important;box-shadow:0 10px 24px rgba(202,168,106,.20)!important;
}
.payroll-confirm-content h2{
  margin:0 0 8px!important;font-size:22px!important;font-weight:1000!important;letter-spacing:-.02em!important;color:#101828!important;
}
.payroll-confirm-content p{
  margin:0!important;color:#5f6673!important;font-size:14px!important;font-weight:800!important;line-height:1.55!important;
}
.payroll-confirm-actions{
  display:flex!important;gap:10px!important;justify-content:center!important;align-items:center!important;margin-top:22px!important;
}
.payroll-confirm-actions .btn{
  min-width:118px!important;justify-content:center!important;border-radius:14px!important;
}
.payroll-confirm-actions .btn.light{
  background:#fff!important;color:#4b3526!important;border:1px solid #d6ad58!important;
}
@keyframes qpConfirmIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:430px){
  .payroll-confirm-card{padding:22px 18px!important;border-radius:20px!important}
  .payroll-confirm-actions{flex-direction:column-reverse!important}
  .payroll-confirm-actions .btn{width:100%!important}
}

/* VFINAL payroll unified professional tabs + theme table colors */
:root{
  --qp-navy:#14233f;
  --qp-navy-2:#20375f;
  --qp-gold:#caa86a;
  --qp-gold-soft:#f7ecd1;
  --qp-cream:#fffaf0;
  --qp-coffee:#4b3526;
}

/* Same professional tab system for Backend Payroll and Employee Portal */
.payroll-tabs,
.employee-tabs{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr))!important;
  gap:12px!important;
  margin:18px 0 20px!important;
  padding:12px!important;
  border:1px solid var(--qp-gold)!important;
  border-radius:24px!important;
  background:linear-gradient(135deg,rgba(255,253,248,.98),rgba(255,246,228,.96))!important;
  box-shadow:0 18px 48px rgba(75,53,38,.10)!important;
}

.payroll-tabs a,
.employee-tabs .employee-tab{
  min-height:58px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  padding:12px 14px!important;
  border-radius:18px!important;
  border:1px solid #dfc58f!important;
  background:linear-gradient(135deg,#fffdf8,#fff3d9)!important;
  color:var(--qp-coffee)!important;
  text-align:center!important;
  text-decoration:none!important;
  font-family:"Montserrat","Open Sans",Arial,sans-serif!important;
  font-size:13px!important;
  font-weight:900!important;
  letter-spacing:.015em!important;
  line-height:1.15!important;
  box-shadow:0 8px 20px rgba(75,53,38,.06)!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease,color .18s ease!important;
}

.payroll-tabs a:hover,
.employee-tabs .employee-tab:hover{
  transform:translateY(-2px)!important;
  border-color:var(--qp-gold)!important;
  background:linear-gradient(135deg,#fff8e9,#fffdf8)!important;
  color:var(--qp-coffee)!important;
  box-shadow:0 14px 30px rgba(75,53,38,.12)!important;
}

.payroll-tabs a.active,
.employee-tabs .employee-tab.active{
  background:linear-gradient(135deg,var(--qp-navy-2),var(--qp-navy))!important;
  color:#fff8e8!important;
  border-color:var(--qp-gold)!important;
  box-shadow:0 16px 36px rgba(20,35,63,.22)!important;
}

.employee-tabs .tab-ico{
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  display:inline-grid!important;
  place-items:center!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,#fff7e3,#f7e4b5)!important;
  border:1px solid #d8bd7a!important;
  color:#6b4c2d!important;
  font-size:11px!important;
  font-weight:1000!important;
  letter-spacing:.04em!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 8px 16px rgba(75,53,38,.08)!important;
}

.employee-tabs .employee-tab.active .tab-ico{
  background:linear-gradient(135deg,#fffdf8,#f5e8c9)!important;
  border-color:#ead7a9!important;
  color:var(--qp-navy)!important;
}

.employee-tabs .tab-label{display:block!important;white-space:normal!important;line-height:1.15!important}

/* Unified payroll tables: same theme as buttons/tabs */
.table-wrap{
  border:1px solid #dfc58f!important;
  border-radius:22px!important;
  background:#fffdf8!important;
  box-shadow:0 10px 28px rgba(75,53,38,.06)!important;
}

.table-wrap table,
.payroll-card table{
  width:100%!important;
  border-collapse:separate!important;
  border-spacing:0!important;
  background:#fffdf8!important;
}

.table-wrap th,
.payroll-card th{
  background:linear-gradient(135deg,var(--qp-navy-2),var(--qp-navy))!important;
  color:#fff8e8!important;
  border-bottom:3px solid var(--qp-gold)!important;
  padding:14px 16px!important;
  font-family:"Montserrat","Open Sans",Arial,sans-serif!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}

.table-wrap th:first-child,
.payroll-card th:first-child{border-top-left-radius:18px!important}
.table-wrap th:last-child,
.payroll-card th:last-child{border-top-right-radius:18px!important}

.table-wrap td,
.payroll-card td{
  background:#fffdf8!important;
  color:#1d1a17!important;
  border-bottom:1px solid #f0dfbd!important;
  padding:13px 16px!important;
  font-size:14px!important;
  vertical-align:middle!important;
}

.table-wrap tr:nth-child(even) td,
.payroll-card tr:nth-child(even) td{background:#fff8eb!important}

.table-wrap tr:hover td,
.payroll-card tr:hover td{background:#f7ecd1!important}

.table-wrap tbody tr:last-child td,
.payroll-card tbody tr:last-child td{border-bottom:0!important}

.badge,
.status-badge{
  border:1px solid #dfc58f!important;
  background:#fff1cd!important;
  color:#5c3e20!important;
}
.badge.success,.status-badge.success{background:#e6f7ec!important;color:#166534!important;border-color:#86efac!important}
.badge.danger,.status-badge.danger{background:#fee2e2!important;color:#991b1b!important;border-color:#fecaca!important}

@media(max-width:900px){
  .payroll-tabs,.employee-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding:10px!important;gap:10px!important}
  .payroll-tabs a,.employee-tabs .employee-tab{min-height:54px!important;font-size:12px!important;border-radius:16px!important;padding:10px!important}
}
@media(max-width:520px){
  .payroll-tabs,.employee-tabs{grid-template-columns:1fr!important;border-radius:20px!important}
  .payroll-tabs a,.employee-tabs .employee-tab{justify-content:flex-start!important;text-align:left!important}
  .table-wrap th,.payroll-card th{padding:12px!important;font-size:11px!important}
  .table-wrap td,.payroll-card td{padding:12px!important;font-size:13px!important}
}

/* VFINAL2 remove dark blue: payroll/employee tabs + tables follow Quatro Pasos gold/coffee theme */
:root{
  --qp-navy:#4b3526!important;
  --qp-navy-2:#7a5737!important;
  --qp-tab-active-1:#caa86a!important;
  --qp-tab-active-2:#7a5737!important;
  --qp-tab-active-3:#4b3526!important;
}
.payroll-tabs a.active,
.payroll-tabs a.active:hover,
.employee-tabs .employee-tab.active,
.employee-tabs .employee-tab.active:hover{
  background:linear-gradient(135deg,var(--qp-tab-active-1) 0%,var(--qp-tab-active-2) 52%,var(--qp-tab-active-3) 100%)!important;
  color:#fffaf0!important;
  border-color:#d6ad58!important;
  box-shadow:0 16px 34px rgba(75,53,38,.24)!important;
}
.payroll-tabs a:hover,
.employee-tabs .employee-tab:hover{
  background:linear-gradient(135deg,#fff8e9,#f7ecd1)!important;
  color:#4b3526!important;
  border-color:#caa86a!important;
}
.employee-tabs .employee-tab.active .tab-ico{
  background:linear-gradient(135deg,#fffaf0,#f5e8c9)!important;
  border-color:#ead7a9!important;
  color:#4b3526!important;
}
.table-wrap th,
.payroll-card th,
.employee-portal th{
  background:linear-gradient(135deg,#caa86a 0%,#7a5737 55%,#4b3526 100%)!important;
  color:#fffaf0!important;
  border-bottom:3px solid #ead7a9!important;
}
.table-wrap tr:hover td,
.payroll-card tr:hover td,
.employee-portal tr:hover td{
  background:#f5e8c9!important;
}
.qp-nav a.active,
.qp-nav a:hover{
  background:linear-gradient(135deg,#fffdf8,#fff1cd)!important;
  border-color:#caa86a!important;
  color:#4b3526!important;
}
.btn:not(.red),button:not(.red),
.employee-portal .btn:not(.red),.employee-portal button:not(.red){
  background:linear-gradient(135deg,#fff8e9,#f5e8c9)!important;
  color:#4b3526!important;
  border:1px solid #caa86a!important;
  box-shadow:0 12px 24px rgba(75,53,38,.12)!important;
}
.btn:not(.red):hover,button:not(.red):hover,
.employee-portal .btn:not(.red):hover,.employee-portal button:not(.red):hover{
  background:linear-gradient(135deg,#caa86a,#7a5737)!important;
  color:#fffaf0!important;
  border-color:#caa86a!important;
}
.btn.red,button.red{background:#8a1738!important;color:#fff!important;border-color:#8a1738!important}

/* VFINAL3 LIGHT THEME ALIGNMENT - entire backend/payroll/employee portal */
:root{
  --qp-light-gold:#f7ecd1!important;
  --qp-soft-gold:#f1dfb5!important;
  --qp-mid-gold:#d6ad58!important;
  --qp-text-coffee:#4b3526!important;
  --qp-soft-coffee:#7a5737!important;
  --qp-cream:#fffdf8!important;
  --qp-cream-2:#fff8e9!important;
}

/* Remove heavy/dark active blocks; keep Quatro Pasos gold/cream theme */
.payroll-tabs a.active,
.payroll-tabs a.active:hover,
.employee-tabs .employee-tab.active,
.employee-tabs .employee-tab.active:hover,
.product-filter-buttons button.active{
  background:linear-gradient(135deg,#fffdf8 0%,#fff1cd 48%,#ead7a9 100%)!important;
  color:var(--qp-text-coffee)!important;
  border:1px solid var(--qp-mid-gold)!important;
  box-shadow:0 12px 26px rgba(75,53,38,.12)!important;
}

.payroll-tabs a,
.employee-tabs .employee-tab{
  background:linear-gradient(135deg,#fffdf8,#fff8e9)!important;
  color:var(--qp-text-coffee)!important;
  border:1px solid #dec483!important;
  box-shadow:0 10px 24px rgba(75,53,38,.06)!important;
}

.payroll-tabs a:hover,
.employee-tabs .employee-tab:hover{
  background:linear-gradient(135deg,#fff8e9,#f7ecd1)!important;
  color:var(--qp-text-coffee)!important;
  border-color:var(--qp-mid-gold)!important;
  box-shadow:0 14px 28px rgba(75,53,38,.10)!important;
}

.employee-tabs .employee-tab .tab-ico,
.employee-tabs .employee-tab.active .tab-ico{
  background:#fff8e9!important;
  color:#7a5737!important;
  border:1px solid #dec483!important;
}

/* Light table theme across entire system */
table thead th,
.table-wrap th,
.payroll-card th,
.employee-portal th{
  background:linear-gradient(135deg,#fff6df 0%,#ead7a9 55%,#d6ad58 100%)!important;
  color:var(--qp-text-coffee)!important;
  border-bottom:2px solid #caa86a!important;
  text-shadow:none!important;
}

table tbody td,
.table-wrap td,
.payroll-card td,
.employee-portal td{
  background:#fffdf8!important;
  color:#1d1a17!important;
  border-bottom:1px solid #f1dfb5!important;
}

table tbody tr:nth-child(even) td,
.table-wrap tr:nth-child(even) td,
.payroll-card tr:nth-child(even) td,
.employee-portal tr:nth-child(even) td{
  background:#fff8e9!important;
}

table tbody tr:hover td,
.table-wrap tr:hover td,
.payroll-card tr:hover td,
.employee-portal tr:hover td{
  background:#f7ecd1!important;
}

/* Buttons: lighter by default, stronger only on hover */
.btn:not(.red),button:not(.red),
.employee-portal .btn:not(.red),.employee-portal button:not(.red){
  background:linear-gradient(135deg,#fffdf8,#fff1cd)!important;
  color:var(--qp-text-coffee)!important;
  border:1px solid #d6ad58!important;
  box-shadow:0 10px 22px rgba(75,53,38,.08)!important;
}
.btn:not(.red):hover,button:not(.red):hover,
.employee-portal .btn:not(.red):hover,.employee-portal button:not(.red):hover{
  background:linear-gradient(135deg,#f7ecd1,#d6ad58)!important;
  color:var(--qp-text-coffee)!important;
  border-color:#caa86a!important;
}

/* Sidebar active/hover light theme */
.qp-nav a.active,
.qp-nav a:hover{
  background:linear-gradient(135deg,#fffdf8,#fff1cd)!important;
  border-color:#d6ad58!important;
  color:var(--qp-text-coffee)!important;
  box-shadow:0 10px 22px rgba(75,53,38,.08)!important;
}

/* KPI/cards/panels lighter and consistent */
.panel,.card,.stat,.kpi-mini,.payroll-card,.employee-portal .panel{
  background:rgba(255,253,248,.98)!important;
  border-color:#ead7a9!important;
}

.badge,.status-badge{
  background:#fff1cd!important;
  color:var(--qp-text-coffee)!important;
  border-color:#dec483!important;
}

/* Modal confirmation follows same light theme */
.qp-confirm-box,.modal-box{
  background:#fffdf8!important;
  border-color:#d6ad58!important;
}
.qp-confirm-yes{
  background:linear-gradient(135deg,#fff1cd,#d6ad58)!important;
  color:#4b3526!important;
}

/* Auto pagination - entire backend/payroll/HR tables */
.table-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:12px 0 4px;padding:10px 12px;border:1px solid rgba(194,145,61,.28);border-radius:16px;background:rgba(255,248,235,.72)}
.table-pager-info{font-size:13px;font-weight:800;color:#7a5733;letter-spacing:.02em}
.table-pager-nav{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.table-page-btn{border:1px solid rgba(194,145,61,.42);background:#fffaf0;color:#5e3a1c;border-radius:999px;padding:7px 12px;font-weight:900;cursor:pointer;transition:.18s ease}
.table-page-btn:hover:not(:disabled),.table-page-btn.active{background:linear-gradient(135deg,#d7b15f,#9a602c);color:#fff;border-color:#bb8738;box-shadow:0 8px 18px rgba(154,96,44,.18)}
.table-page-btn:disabled{opacity:.45;cursor:not-allowed}.table-page-dots{padding:0 4px;color:#8a6a42;font-weight:900}
@media(max-width:720px){.table-pager{align-items:flex-start}.table-pager-info{width:100%}.table-page-btn{padding:8px 10px;font-size:12px}}

/* V206 detailed payslip modal/list update */
.payslip-modal-card{width:min(1120px,96vw)!important;max-height:94vh!important;overflow:auto!important}.payslip-sheet{background:#fffdf8;border:1px solid #ead7a9;border-radius:22px;padding:18px;box-shadow:0 16px 42px rgba(75,53,38,.08)}.payslip-sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px}.payslip-sheet-head h2{margin:10px 0 6px}.payslip-net-box{min-width:190px;border:1px solid #d8bd7a;background:linear-gradient(135deg,#fff8e9,#f4e1b2);border-radius:18px;padding:14px;text-align:right}.payslip-net-box small{display:block;color:#6f675d;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.payslip-net-box b{display:block;font-size:25px;color:#4b3526;margin:4px 0}.payslip-net-box span{display:inline-flex;border-radius:999px;background:#fffdf8;border:1px solid #d8bd7a;color:#4b3526;padding:5px 10px;font-weight:900;font-size:12px}.payslip-info-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;margin-bottom:12px}.payslip-info-grid .payroll-card{margin-bottom:0!important}.payslip-info-grid .payroll-kpi b{font-size:16px!important;line-height:1.25!important;word-break:break-word}.payslip-breakdown-wrap table{min-width:760px}.payslip-breakdown-table th{background:linear-gradient(135deg,#dcbf76,#f1dfad)!important;color:#3d3025!important}.payslip-breakdown-table tr:last-child td{background:#fff8e9;font-size:16px}.payroll-modal.is-open.payslip-view-modal{align-items:flex-start}.payroll-modal.is-open.payslip-view-modal .payroll-modal-card{margin-top:20px;margin-bottom:20px}@media(max-width:980px){.payslip-info-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.payslip-sheet-head{display:grid}.payslip-net-box{text-align:left;width:100%}}@media(max-width:620px){.payslip-info-grid{grid-template-columns:1fr!important}.payslip-sheet{padding:12px;border-radius:18px}.payslip-modal-card{width:98vw!important;padding:12px!important}.payslip-sheet-head h2{font-size:21px!important}.payslip-net-box b{font-size:22px}}
@media print{body:has(.payroll-modal.is-printing){background:#fff!important}.payroll-modal.is-printing{position:static!important;display:block!important;background:#fff!important;padding:0!important;overflow:visible!important}.payroll-modal.is-printing .payroll-modal-card{width:100%!important;max-height:none!important;overflow:visible!important;border:0!important;box-shadow:none!important;padding:0!important}.payroll-modal.is-printing .payslip-print-hide,.payroll-modal.is-printing .payroll-modal-head,.payroll-modal.is-printing .payroll-modal-actions{display:none!important}.payroll-modal.is-printing .payslip-sheet{border:1px solid #ddd!important;box-shadow:none!important}.payroll-modal:not(.is-printing),.qp-sidebar,.qp-topbar,.payroll-tabs,.employee-tabs,.employee-wrap> .panel:first-child,.payroll-alert{display:none!important}.qp-main,.employee-portal,.employee-wrap{margin:0!important;padding:0!important;width:100%!important;background:#fff!important}.panel{box-shadow:none!important}}

/* V207 HR 201 files, employee photos, requirements, and employment actions */
.payroll-modal-card.wide{width:min(1180px,96vw)!important;max-height:92vh;overflow:auto}.payroll-form .span-2{grid-column:span 2}.payroll-form .span-3{grid-column:1/-1}.employee-cell{display:flex;align-items:center;gap:12px;min-width:220px}.employee-avatar{width:48px;height:48px;border-radius:16px;object-fit:cover;border:1px solid #d7b15f;background:#fff8e9;box-shadow:0 8px 18px rgba(75,53,38,.10);display:inline-flex;align-items:center;justify-content:center;font-weight:900;color:#7a5733}.employee-avatar.large{width:72px;height:72px;border-radius:22px}.employee-avatar.placeholder{font-size:22px}.mini-link{font-weight:900;color:#7a5733;text-decoration:none;border-bottom:1px solid #d7b15f}.employee-summary{display:flex;gap:14px;align-items:center;margin:14px 0 18px;padding:14px;border:1px solid #ead7a9;border-radius:18px;background:#fffaf0}.requirement-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:12px 0 18px}.req-card{border:1px solid #ead7a9;background:#fffdf8;border-radius:16px;padding:12px;display:flex;justify-content:space-between;gap:10px;align-items:center}.req-card.ok{background:#f0fff4;border-color:#a9dfbf}.req-card.missing{background:#fff8e9;border-color:#e5c077}.req-card b{font-size:13px}.req-card span{font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.payroll-filter{display:flex;gap:12px;align-items:end;margin:12px 0 16px}.payroll-filter label{display:grid;gap:7px;font-weight:900;color:#6f675d;text-transform:uppercase;letter-spacing:.06em;font-size:12px}.payroll-filter select{min-width:280px;border:1px solid #e1e6ef;border-radius:14px;padding:12px 14px;font-weight:800;background:#fff}.badge.warn{background:#fff1cd!important;color:#7a5733!important;border-color:#dec483!important}.badge.danger{background:#fff0f0!important;color:#9b1c1c!important;border-color:#ffc9c9!important}.badge.success{background:#edfff5!important;color:#166534!important;border-color:#bce7ce!important}@media(max-width:760px){.payroll-form .span-2,.payroll-form .span-3{grid-column:1/-1}.employee-cell{min-width:190px}.payroll-filter{display:block}.payroll-filter select{min-width:0;width:100%}.employee-summary{align-items:flex-start}.payroll-modal-card.wide{width:98vw!important;padding:14px!important}}

/* V208 entire system table search + lighter non-glare tables/buttons */
.global-table-search{
  display:grid!important;
  grid-template-columns:minmax(280px,1fr) auto!important;
  gap:12px!important;
  align-items:end!important;
  margin:14px 0 14px!important;
  padding:16px!important;
  border:1px solid #ead7a9!important;
  border-radius:22px!important;
  background:#fffaf0!important;
  box-shadow:none!important;
}
.global-table-search label{margin:0!important;display:grid!important;gap:7px!important}
.global-table-search label span{
  color:#6b5638!important;
  font-family:"Montserrat","Open Sans",Arial,sans-serif!important;
  font-size:11px!important;
  font-weight:1000!important;
  text-transform:uppercase!important;
  letter-spacing:.08em!important;
}
.global-table-search input[type="search"]{
  min-height:48px!important;
  border-radius:16px!important;
  border:1px solid #d6ad58!important;
  background:#fffdf8!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85)!important;
  color:#1d1a17!important;
}
.global-table-search input[type="search"]:focus{outline:2px solid #f1dfb5!important;border-color:#caa86a!important}
.global-table-search .table-search-reset{height:48px!important;align-self:end!important;min-width:130px!important}

/* Remove heavy glare from all table headers; keep theme flat and readable */
table thead th,
.table-wrap th,
.payroll-card th,
.employee-portal th,
.payslip-breakdown-table th{
  background:#f1dfb5!important;
  color:#4b3526!important;
  border-bottom:1px solid #caa86a!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
.table-wrap,
.payroll-card .table-wrap{
  box-shadow:none!important;
  border-color:#ead7a9!important;
  background:#fffdf8!important;
}
table tbody td,
.table-wrap td,
.payroll-card td,
.employee-portal td{
  background:#fffdf8!important;
  border-bottom:1px solid #ead7a9!important;
}
table tbody tr:nth-child(even) td,
.table-wrap tr:nth-child(even) td,
.payroll-card tr:nth-child(even) td,
.employee-portal tr:nth-child(even) td{background:#fffaf0!important}
table tbody tr:hover td,
.table-wrap tr:hover td,
.payroll-card tr:hover td,
.employee-portal tr:hover td{background:#fff4dc!important}

/* Buttons: less glare, lighter hover, still same Quatro Pasos theme */
.btn:not(.red),button:not(.red),
.employee-portal .btn:not(.red),.employee-portal button:not(.red){
  background:#fff8e9!important;
  color:#4b3526!important;
  border:1px solid #d6ad58!important;
  box-shadow:0 6px 14px rgba(75,53,38,.06)!important;
}
.btn:not(.red):hover,button:not(.red):hover,
.employee-portal .btn:not(.red):hover,.employee-portal button:not(.red):hover{
  background:#f7ecd1!important;
  color:#4b3526!important;
  border-color:#caa86a!important;
  box-shadow:0 8px 18px rgba(75,53,38,.08)!important;
}
.payroll-tabs a.active,.employee-tabs .employee-tab.active,
.product-filter-buttons button.active{
  background:#f3e2b9!important;
  color:#4b3526!important;
  border-color:#caa86a!important;
  box-shadow:0 8px 18px rgba(75,53,38,.08)!important;
}
.payroll-tabs a:hover,.employee-tabs .employee-tab:hover{
  background:#fff4dc!important;
  box-shadow:0 8px 18px rgba(75,53,38,.07)!important;
}
.table-page-btn:hover:not(:disabled),.table-page-btn.active{
  background:#f3e2b9!important;
  color:#4b3526!important;
  border-color:#caa86a!important;
  box-shadow:none!important;
}

/* Employee table performance: no real photos in rows; photo loads only in View modal */
.employee-avatar.table-initials{
  background:#fff1cd!important;
  color:#6b4524!important;
  font-size:14px!important;
  box-shadow:none!important;
}
.employee-view-grid{
  display:grid!important;
  grid-template-columns:180px minmax(0,1fr)!important;
  gap:18px!important;
  align-items:start!important;
  margin-top:14px!important;
}
.employee-view-photo{
  min-height:180px!important;
  border:1px solid #ead7a9!important;
  border-radius:22px!important;
  background:#fffaf0!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
}
.employee-view-photo img{
  width:100%!important;
  height:180px!important;
  object-fit:cover!important;
  display:block!important;
}
.employee-view-photo .employee-avatar.large{
  width:104px!important;
  height:104px!important;
  font-size:30px!important;
  box-shadow:none!important;
}
.employee-view-details .payroll-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
@media(max-width:980px){.employee-view-grid{grid-template-columns:1fr!important}.employee-view-photo{min-height:140px!important}.employee-view-photo img{height:220px!important}.employee-view-details .payroll-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:720px){.global-table-search{grid-template-columns:1fr!important;padding:12px!important}.global-table-search .table-search-reset{width:100%!important}.employee-view-details .payroll-grid{grid-template-columns:1fr!important}}


/* V245 global elegant checkbox + cleaner HR dashboard */
input[type="checkbox"]{
  appearance:none!important;
  -webkit-appearance:none!important;
  width:22px!important;
  height:22px!important;
  min-width:22px!important;
  margin:0 9px 0 0!important;
  vertical-align:middle!important;
  border:2px solid #d6b46e!important;
  border-radius:8px!important;
  background:linear-gradient(135deg,#fffdf8,#fff6e6)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 5px 14px rgba(117,80,38,.08)!important;
  cursor:pointer!important;
  position:relative!important;
  transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease!important;
}
input[type="checkbox"]:hover{
  border-color:#b58a3b!important;
  background:linear-gradient(135deg,#fff7df,#fffdf8)!important;
  transform:translateY(-1px)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 8px 18px rgba(117,80,38,.12)!important;
}
input[type="checkbox"]:checked{
  border-color:#8a5b2e!important;
  background:linear-gradient(135deg,#f1d890,#a87538)!important;
}
input[type="checkbox"]:checked::after{
  content:""!important;
  position:absolute!important;
  left:6px!important;
  top:2px!important;
  width:6px!important;
  height:12px!important;
  border:solid #fffaf0!important;
  border-width:0 3px 3px 0!important;
  transform:rotate(45deg)!important;
}
input[type="checkbox"]:focus-visible{
  outline:3px solid rgba(214,180,110,.35)!important;
  outline-offset:3px!important;
}
label:has(input[type="checkbox"]),
.pretty-check,
.qp-check-tile{
  display:inline-flex!important;
  align-items:center!important;
  gap:10px!important;
  width:auto!important;
  min-height:42px!important;
  padding:8px 12px!important;
  border:1px solid rgba(214,180,110,.45)!important;
  border-radius:16px!important;
  background:rgba(255,250,240,.72)!important;
  color:#4b3526!important;
  font-weight:1000!important;
  letter-spacing:.04em!important;
  text-transform:uppercase!important;
  box-shadow:0 8px 18px rgba(117,80,38,.05)!important;
}
label:has(input[type="checkbox"]):hover,
.pretty-check:hover,
.qp-check-tile:hover{
  border-color:#d6ad58!important;
  background:#fff8e9!important;
}
.pretty-check span:not(.qp-check-box){display:none!important;}
.payroll-modal .qp-check-tile input[type="checkbox"]{
  appearance:none!important;
  -webkit-appearance:none!important;
  position:relative!important;
  opacity:1!important;
  width:22px!important;
  height:22px!important;
  pointer-events:auto!important;
}
.payroll-modal .qp-check-box{display:none!important;}
.payroll-modal .qp-check-text{font-size:12px!important;color:#4b3526!important;}
.table-wrap th,
table th{
  background:#ead291!important;
  color:#4b3526!important;
  box-shadow:none!important;
  border-bottom:1px solid #cda85b!important;
}
.table-wrap tr:hover td{background:#fff8ea!important;}
.btn,button{
  box-shadow:0 8px 18px rgba(117,80,38,.08)!important;
}
.btn:hover,button:hover{
  box-shadow:0 10px 22px rgba(117,80,38,.11)!important;
}
.payroll-tabs a.active,
.employee-tabs .employee-tab.active{
  background:linear-gradient(135deg,#efd996,#b9873f)!important;
  color:#3b2819!important;
  border-color:#b9873f!important;
  box-shadow:0 12px 26px rgba(117,80,38,.12)!important;
}

/* VFINAL UI polish: uniform light theme, compact tabs, cleaner tables, PDF-only payslip print */
:root{
  --qp-soft-bg:#fffdf8;
  --qp-soft-panel:#fffaf0;
  --qp-soft-gold:#f6e7bd;
  --qp-soft-gold-2:#eed79f;
  --qp-soft-border:#d6ad58;
  --qp-soft-text:#4b3526;
}
/* All primary/active/hover buttons and links follow the light Save Attendance color */
.btn,button,
.btn.light,button.light,
.qp-nav a.active,
.qp-nav a:hover,
.payroll-tabs a,
.payroll-tabs a.active,
.employee-tabs .employee-tab,
.employee-tabs .employee-tab.active,
.employee-tabs a,
.employee-tabs a.active{
  background:linear-gradient(135deg,#fffdf8 0%,#fff7e8 58%,#f6e7bd 100%)!important;
  color:var(--qp-soft-text)!important;
  border:1px solid var(--qp-soft-border)!important;
  box-shadow:0 8px 18px rgba(133,94,42,.08)!important;
  text-shadow:none!important;
}
.btn:hover,button:hover,
.btn.light:hover,button.light:hover,
.qp-nav a:hover,
.payroll-tabs a:hover,
.employee-tabs .employee-tab:hover,
.employee-tabs a:hover{
  background:linear-gradient(135deg,#fffefa 0%,#fff9ee 70%,#f9edcc 100%)!important;
  border-color:#caa86a!important;
  color:#3d3025!important;
  box-shadow:0 9px 18px rgba(133,94,42,.10)!important;
}
.payroll-tabs a.active,
.employee-tabs .employee-tab.active,
.employee-tabs a.active{
  background:linear-gradient(135deg,#fff8e9 0%,#f8eac5 100%)!important;
  color:#4b3526!important;
  border-color:#caa86a!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.55),0 8px 18px rgba(133,94,42,.10)!important;
}
/* Payroll/HR module tabs: 50% smaller footprint */
.payroll-tabs,
.employee-tabs{
  gap:7px!important;
  padding:10px!important;
  border-radius:18px!important;
}
.payroll-tabs a,
.employee-tabs .employee-tab,
.employee-tabs a{
  min-height:36px!important;
  padding:8px 12px!important;
  border-radius:14px!important;
  font-size:12px!important;
  line-height:1.15!important;
  gap:7px!important;
}
.employee-tabs .tab-ico,
.payroll-tabs .tab-ico{
  width:24px!important;
  height:24px!important;
  min-width:24px!important;
  font-size:11px!important;
  background:#fffaf0!important;
  border-color:#dec483!important;
}
/* Tables: remove glare, 60% lighter, only 5% darker than background */
.table-wrap,
.payroll-card .table-wrap{
  background:#fffdf8!important;
  border-color:#eadbb7!important;
  box-shadow:none!important;
}
table thead th,
.table-wrap th,
.payroll-card th{
  background:#f8ecd0!important;
  color:#4b3526!important;
  border-bottom:1px solid #dfc486!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
table tbody td,
.table-wrap td,
.payroll-card td{
  background:#fffdf8!important;
  border-bottom:1px solid #f1e2bf!important;
}
table tbody tr:nth-child(even) td,
.table-wrap tr:nth-child(even) td,
.payroll-card tr:nth-child(even) td{
  background:#fcf6ea!important;
}
table tbody tr:hover td,
.table-wrap tr:hover td,
.payroll-card tr:hover td{
  background:#fff9ee!important;
}
.global-table-search,
.table-pager{
  background:#fffdf8!important;
  border-color:#eadbb7!important;
  box-shadow:none!important;
}
.global-table-search input,
.global-table-search select{
  background:#fffefa!important;
  border-color:#d9bd7f!important;
}
.table-page-btn,
.table-page-btn.active{
  background:#fffaf0!important;
  color:#4b3526!important;
  border-color:#dec483!important;
  box-shadow:none!important;
}
.table-page-btn.active{
  background:#f8eac5!important;
}
/* Keep print/PDF clean: do not print UI tools accidentally */
@media print{
  .global-table-search,.table-pager,.table-search-reset,.payslip-print-hide{display:none!important}
  .payslip-sheet table tbody tr{display:table-row!important}
  .payslip-sheet{font-size:12px!important;color:#24180f!important;background:#fff!important}
}

/* VFINAL BUTTON/TABLE/PAYSLIP PRINT POLISH - single light theme everywhere */
:root{
  --qp-btn-bg-1:#fffdf8;
  --qp-btn-bg-2:#fff8e9;
  --qp-btn-bg-3:#f9edcc;
  --qp-btn-border:#d7b15f;
  --qp-btn-text:#4b3526;
  --qp-table-head:#fbf3df;
  --qp-table-row:#fffdf8;
  --qp-table-alt:#fef9ee;
  --qp-table-hover:#fffaf0;
}
/* Force every clickable control to use the SAME light Save Attendance/Approve Overtime color */
.btn,
a.btn,
button,
input[type="submit"],
input[type="button"],
.qp-nav a,
.qp-nav a.active,
.qp-nav a:hover,
.payroll-tabs a,
.payroll-tabs a.active,
.payroll-tabs a:hover,
.employee-tabs .employee-tab,
.employee-tabs .employee-tab.active,
.employee-tabs .employee-tab:hover,
.employee-tabs a,
.employee-tabs a.active,
.employee-tabs a:hover,
.table-page-btn,
.table-page-btn.active,
.table-search-reset,
.badge.action,
.mini-link{
  background:linear-gradient(135deg,var(--qp-btn-bg-1) 0%,var(--qp-btn-bg-2) 72%,var(--qp-btn-bg-3) 100%)!important;
  color:var(--qp-btn-text)!important;
  border:1px solid var(--qp-btn-border)!important;
  box-shadow:0 7px 16px rgba(117,80,38,.07)!important;
  text-shadow:none!important;
  outline:none!important;
}
.btn:hover,
a.btn:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.qp-nav a:hover,
.payroll-tabs a:hover,
.employee-tabs .employee-tab:hover,
.employee-tabs a:hover,
.table-page-btn:hover,
.table-search-reset:hover,
.mini-link:hover{
  background:linear-gradient(135deg,#fffefa 0%,#fffaf1 78%,#fbf1d6 100%)!important;
  color:#3d3025!important;
  border-color:#caa86a!important;
  box-shadow:0 8px 17px rgba(117,80,38,.09)!important;
  transform:translateY(-1px)!important;
}
.payroll-tabs a.active,
.employee-tabs .employee-tab.active,
.employee-tabs a.active,
.qp-nav a.active,
.table-page-btn.active{
  background:linear-gradient(135deg,var(--qp-btn-bg-1) 0%,var(--qp-btn-bg-2) 72%,var(--qp-btn-bg-3) 100%)!important;
  color:var(--qp-btn-text)!important;
  border-color:var(--qp-btn-border)!important;
  box-shadow:inset 0 0 0 1px rgba(215,177,95,.24),0 7px 16px rgba(117,80,38,.07)!important;
}
.payroll-tabs a.active::after,
.employee-tabs .employee-tab.active::after,
.employee-tabs a.active::after{
  content:""!important;
  position:absolute!important;
  left:14px!important;
  right:14px!important;
  bottom:6px!important;
  height:2px!important;
  border-radius:999px!important;
  background:#d7b15f!important;
  opacity:.65!important;
}
.payroll-tabs a,
.employee-tabs .employee-tab,
.employee-tabs a{position:relative!important;}
/* Compact HR/Payroll tab buttons */
.payroll-tabs{gap:6px!important;padding:8px!important;border-radius:16px!important;}
.payroll-tabs a,
.employee-tabs .employee-tab,
.employee-tabs a{
  min-height:32px!important;
  padding:7px 10px!important;
  border-radius:13px!important;
  font-size:11.5px!important;
  line-height:1.1!important;
}
.employee-tabs .tab-ico,.payroll-tabs .tab-ico{width:22px!important;height:22px!important;min-width:22px!important;font-size:10px!important;}
/* Tables are 60% lighter and almost same as background */
.table-wrap,
.payroll-card .table-wrap{background:#fffdf8!important;border-color:#f0dfb9!important;box-shadow:none!important;}
table thead th,
.table-wrap th,
.payroll-card th{
  background:var(--qp-table-head)!important;
  color:#4b3526!important;
  border-color:#ead8ad!important;
  border-bottom:1px solid #ddc58b!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
table tbody td,
.table-wrap td,
.payroll-card td{background:var(--qp-table-row)!important;border-color:#f0dfb9!important;}
table tbody tr:nth-child(even) td,
.table-wrap tr:nth-child(even) td,
.payroll-card tr:nth-child(even) td{background:var(--qp-table-alt)!important;}
table tbody tr:hover td,
.table-wrap tr:hover td,
.payroll-card tr:hover td{background:var(--qp-table-hover)!important;}
/* Cleaner PDF/print payslip only */
@media print{
  body *{visibility:hidden!important;}
  body.print-payslip-active .payslip-print-root,
  body.print-payslip-active .payslip-print-root *{visibility:visible!important;}
  body.print-payslip-active .payslip-print-root{position:absolute!important;left:0!important;top:0!important;width:100%!important;background:#fff!important;}
  .global-table-search,.table-pager,.table-search-reset,.payslip-print-hide,button,.btn{display:none!important;}
}

/* VFINAL_HALF_BOND_PAYSLIP: light tables/buttons + compact tabs */
:root{
  --qp-btn-bg:#fff8e8;
  --qp-btn-bg-hover:#fff3d3;
  --qp-btn-border:#d8b86b;
  --qp-btn-text:#4b3526;
  --qp-table-head:#f7edcf;
  --qp-table-border:#ead7a9;
}
.btn,a.btn,button.btn,.payroll-tabs a,.employee-tabs a,.qp-sidebar a,.table-page-btn,.payroll-modal-actions .btn{
  background:var(--qp-btn-bg)!important;
  border-color:var(--qp-btn-border)!important;
  color:var(--qp-btn-text)!important;
  box-shadow:0 8px 18px rgba(156,113,44,.06)!important;
  background-image:none!important;
}
.btn:hover,a.btn:hover,button.btn:hover,.payroll-tabs a:hover,.employee-tabs a:hover,.qp-sidebar a:hover,.table-page-btn:hover,
.payroll-tabs a.active,.employee-tabs a.active,.qp-sidebar a.active,.table-page-btn.active{
  background:var(--qp-btn-bg-hover)!important;
  color:var(--qp-btn-text)!important;
  box-shadow:0 10px 22px rgba(156,113,44,.08)!important;
}
.payroll-tabs,.employee-tabs{gap:8px!important;padding:10px!important}
.payroll-tabs a,.employee-tabs a{min-height:34px!important;padding:8px 14px!important;font-size:13px!important;border-radius:14px!important;line-height:1.1!important}
.payroll-tabs a .tab-ico,.employee-tabs a .tab-ico{width:28px!important;height:28px!important;font-size:11px!important;background:#fffaf0!important;color:#75512d!important;border-color:#d8b86b!important}
table th,.table-wrap table th,.payslip-breakdown-table th{
  background:var(--qp-table-head)!important;
  color:#4b3526!important;
  background-image:none!important;
  border-color:var(--qp-table-border)!important;
}
table td,.table-wrap table td{border-color:#f0dfb1!important}

/* FINAL_PATCH_REAL_PDF_UNIFORM_SMALL_TABS_NO_UNDERLINE */
:root{
  --qp-final-btn-bg:#fff8e8;
  --qp-final-btn-hover:#fff3d3;
  --qp-final-border:#d8b86b;
  --qp-final-text:#4b3526;
  --qp-final-table-head:#fcf7ea;
  --qp-final-table-alt:#fffaf0;
}
.btn,a.btn,button,button.btn,input[type="submit"],input[type="button"],
.qp-nav a,.qp-nav a.active,.qp-nav a:hover,
.payroll-tabs a,.payroll-tabs a.active,.payroll-tabs a:hover,
.employee-tabs a,.employee-tabs a.active,.employee-tabs a:hover,
.employee-tabs .employee-tab,.employee-tabs .employee-tab.active,.employee-tabs .employee-tab:hover,
.table-page-btn,.table-page-btn.active,.table-search-reset,.mini-link{
  background:var(--qp-final-btn-bg)!important;
  background-image:none!important;
  border:1px solid var(--qp-final-border)!important;
  color:var(--qp-final-text)!important;
  box-shadow:0 6px 14px rgba(156,113,44,.045)!important;
  text-shadow:none!important;
}
.btn:hover,a.btn:hover,button:hover,button.btn:hover,input[type="submit"]:hover,input[type="button"]:hover,
.qp-nav a:hover,.payroll-tabs a:hover,.employee-tabs a:hover,.employee-tabs .employee-tab:hover,
.table-page-btn:hover,.table-search-reset:hover,.mini-link:hover{
  background:var(--qp-final-btn-hover)!important;
  border-color:var(--qp-final-border)!important;
  color:var(--qp-final-text)!important;
  box-shadow:0 7px 15px rgba(156,113,44,.055)!important;
  transform:none!important;
}
.payroll-tabs a.active,.employee-tabs a.active,.employee-tabs .employee-tab.active,.qp-nav a.active,.table-page-btn.active{
  background:var(--qp-final-btn-bg)!important;
  border-color:var(--qp-final-border)!important;
  box-shadow:inset 0 0 0 1px rgba(216,184,107,.16),0 6px 14px rgba(156,113,44,.045)!important;
}
.payroll-tabs a.active::after,.employee-tabs a.active::after,.employee-tabs .employee-tab.active::after{display:none!important;content:none!important;}
.payroll-tabs,.employee-tabs{
  gap:6px!important;
  padding:8px!important;
  border-radius:15px!important;
  align-items:center!important;
}
.payroll-tabs a,.employee-tabs a,.employee-tabs .employee-tab{
  min-height:30px!important;
  height:auto!important;
  padding:6px 11px!important;
  border-radius:12px!important;
  font-size:11.5px!important;
  line-height:1.05!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.employee-tabs .tab-ico,.payroll-tabs .tab-ico{
  width:21px!important;height:21px!important;min-width:21px!important;font-size:9.5px!important;
  background:#fffaf0!important;border-color:var(--qp-final-border)!important;color:var(--qp-final-text)!important;
}
.table-wrap table th,table thead th,.payroll-card th,.payslip-breakdown-table th{
  background:var(--qp-final-table-head)!important;
  background-image:none!important;
  color:var(--qp-final-text)!important;
  border-color:#f0dfb8!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
.table-wrap table td,table tbody td,.payroll-card td{background:#fffdf8!important;border-color:#f2e4c5!important;}
.table-wrap table tr:nth-child(even) td,table tbody tr:nth-child(even) td{background:var(--qp-final-table-alt)!important;}
.table-wrap table tr:hover td,table tbody tr:hover td{background:#fff8e9!important;}
/* PDF button is an actual server-generated PDF link; hide old print helpers if any remain. */
[data-print-payslip]{display:none!important;}

/* FINAL_PATCH_SIDEBAR_ACTIVE_VISIBLE_ONLY
   Active sidebar item must be obvious and different from normal/hover items. */
.qp-sidebar .qp-nav a{
  position:relative!important;
  background:#fff8e8!important;
  background-image:none!important;
  color:#4b3526!important;
  border:1px solid #d8b86b!important;
  box-shadow:0 6px 14px rgba(156,113,44,.045)!important;
}
.qp-sidebar .qp-nav a:hover:not(.active){
  background:#fff3d3!important;
  background-image:none!important;
  color:#4b3526!important;
  border-color:#caa86a!important;
  box-shadow:0 8px 18px rgba(156,113,44,.08)!important;
}
.qp-sidebar .qp-nav a.active,
.qp-sidebar .qp-nav a.active:hover{
  background:linear-gradient(135deg,#7a5737 0%,#4b3526 100%)!important;
  color:#fffaf0!important;
  border-color:#d6ad58!important;
  box-shadow:0 14px 28px rgba(75,53,38,.22)!important;
  transform:none!important;
}
.qp-sidebar .qp-nav a.active::before{
  content:""!important;
  position:absolute!important;
  left:-1px!important;
  top:9px!important;
  bottom:9px!important;
  width:5px!important;
  border-radius:999px!important;
  background:#f6d886!important;
}
.qp-sidebar .qp-nav a.active .nav-ico{
  background:#fff8e8!important;
  color:#4b3526!important;
  border:1px solid #ead7a9!important;
  box-shadow:0 6px 14px rgba(0,0,0,.10)!important;
}
.qp-sidebar .qp-nav a .nav-ico{
  width:28px!important;
  height:28px!important;
  min-width:28px!important;
  display:inline-grid!important;
  place-items:center!important;
  border-radius:999px!important;
}


/* FINAL_PATCH_ROOM_PHOTOS_SIDEBAR_UNIFORM
   Room Photos must use exactly the same sidebar pill style as every other menu item. */
.qp-sidebar .qp-nav a[href="backend_room_photos.php"],
.qp-sidebar .qp-nav a[href="backend_room_photos.php"]:hover:not(.active){
  background:#fff8e8!important;
  background-image:none!important;
  color:#4b3526!important;
  border:1px solid #d8b86b!important;
  box-shadow:0 6px 14px rgba(156,113,44,.045)!important;
}
.qp-sidebar .qp-nav a[href="backend_room_photos.php"]:hover:not(.active){
  background:#fff3d3!important;
  border-color:#caa86a!important;
  box-shadow:0 8px 18px rgba(156,113,44,.08)!important;
}
.qp-sidebar .qp-nav a[href="backend_room_photos.php"].active,
.qp-sidebar .qp-nav a[href="backend_room_photos.php"].active:hover{
  background:linear-gradient(135deg,#7a5737 0%,#4b3526 100%)!important;
  color:#fffaf0!important;
  border-color:#d6ad58!important;
  box-shadow:0 14px 28px rgba(75,53,38,.22)!important;
}

/* V204 Room Photos: show all records with one filter control set */
#roomPhotosPanel.room-photos-show-all > .qp-js-pager{display:none!important;}

/* V212 unified backend pagination: one Inventory-style pager per main table */
.unified-table-pager{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:12px!important;
  margin:12px 0 0!important;
  padding:10px 12px!important;
  border:1px solid #ead7a9!important;
  border-radius:16px!important;
  background:#fffdf8!important;
  box-shadow:none!important;
}
.unified-table-pager .qp-page-info,
.unified-table-pager .qp-page-count{
  font-weight:900!important;
  color:#4b3526!important;
  white-space:nowrap;
}
.unified-table-pager .qp-page-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
.unified-table-pager .qp-page-size{
  min-width:112px!important;
  width:auto!important;
  height:40px!important;
  padding:7px 34px 7px 12px!important;
  border-radius:999px!important;
}
@media(max-width:720px){
  .unified-table-pager{align-items:stretch!important;flex-direction:column!important}
  .unified-table-pager .qp-page-actions{justify-content:space-between!important}
}
@media print{
  .unified-table-pager{display:none!important}
}

.year-filter-input{max-width:110px!important}
.full-span{grid-column:1/-1}


/* GOOGLE_AUTHENTICATOR_MFA_ENROLLMENT */
.mfa-enroll-panel{margin:0 0 16px;padding:16px;border:1px solid #d8bd7a;border-radius:20px;background:#fff8e9;text-align:left}
.mfa-enroll-panel h2{margin:0 0 10px;font-size:19px;color:#2f241b}
.mfa-steps{margin:0 0 14px;padding-left:21px;color:#4b3526;font-size:13px;font-weight:800;line-height:1.55}
.mfa-qrcode{width:216px;min-height:216px;margin:12px auto;padding:10px;display:grid;place-items:center;background:#fff;border:1px solid #d7c291;border-radius:16px;color:#7a5737;text-align:center;font-size:12px;font-weight:900}
.mfa-qrcode img,.mfa-qrcode canvas{display:block;max-width:196px;height:auto!important}
.mfa-manual-key{display:grid;gap:8px;margin-top:12px;color:#61574c;font-size:12px;font-weight:900}
.mfa-manual-key code{display:block;padding:10px;border:1px dashed #b68d43;border-radius:12px;background:#fff;word-break:break-all;letter-spacing:.08em;color:#2f241b;text-align:center}
.mfa-copy-button{width:auto!important;height:auto!important;justify-self:center;padding:8px 13px!important}
.mfa-copy-status{min-height:18px;text-align:center;color:#166534}
.mfa-warning{margin:12px 0 0;padding:10px;border-radius:12px;background:#fee2e2;color:#991b1b;font-size:12px;font-weight:900;line-height:1.45}
.mfa-copy-helper{position:fixed!important;left:-9999px!important;top:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
@media(max-width:520px){.mfa-qrcode{width:206px;min-height:206px}.mfa-qrcode img,.mfa-qrcode canvas{max-width:186px}}

/* V225 numbered pagination for every backend table */
.unified-table-pager .qp-page-numbers{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
}
.unified-table-pager .qp-page-number{
  min-width:38px!important;
  height:38px!important;
  padding:0 11px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid #dec483!important;
  border-radius:999px!important;
  background:#fffaf0!important;
  color:#4b3526!important;
  font-weight:900!important;
  line-height:1!important;
  cursor:pointer!important;
  box-shadow:none!important;
}
.unified-table-pager .qp-page-number:hover:not(.active){
  background:#fff1cd!important;
  border-color:#c69a45!important;
}
.unified-table-pager .qp-page-number.active{
  background:linear-gradient(135deg,#7a5737,#4b3526)!important;
  color:#fff!important;
  border-color:#7a5737!important;
}
.unified-table-pager .qp-page-ellipsis{
  min-width:22px!important;
  text-align:center!important;
  color:#7a5733!important;
  font-weight:900!important;
}
@media(max-width:900px){
  .unified-table-pager .qp-page-actions{
    justify-content:center!important;
  }
  .unified-table-pager .qp-page-numbers{
    order:3!important;
    width:100%!important;
  }
}


/* V227 partial content refresh: the secured shell stays in place. */
.qp-main.qp-partial-loading{opacity:.58;pointer-events:none;transition:opacity .14s ease}
.qp-main[aria-busy="true"]{cursor:progress}
.qp-ajax-error{position:sticky;top:12px;z-index:40}