/* Lares UI kit — shared screen styles for the management portal */
@media screen {
:root{--ui-green:#00845b;--ui-green-hover:#006e4b;--ui-green-soft:#e8f3ed;--ui-ink:#20332a;--ui-muted:#738078;--ui-line:#dfe7e2;--ui-bg:#f4f7f5;--ui-surface:#fff;--ui-terracotta:#a0523d;--ui-terracotta-soft:#faeee9;--ui-warning:#99672f;--ui-warning-soft:#f8f0e4;--ui-decision:#314c60;--ui-radius:8px;--ui-panel-radius:12px;--ui-space:8px;--green:var(--ui-green);--green-dark:var(--ui-green-hover);--green-soft:var(--ui-green-soft);--green-soft-2:#f2f7f4;--ink:var(--ui-ink);--muted:var(--ui-muted);--line:var(--ui-line);--bg:var(--ui-bg);--danger:var(--ui-terracotta);--danger-bg:var(--ui-terracotta-soft);--warn:var(--ui-warning);--warn-bg:var(--ui-warning-soft);--ok:var(--ui-green);--ok-bg:var(--ui-green-soft);--shadow:0 4px 18px rgba(32,51,42,.035);}
body,button,input,select,textarea{font-family:'DM Sans','Segoe UI',Arial,sans-serif;}
body{background:var(--ui-bg);color:var(--ui-ink);}
.app .card{border:1px solid var(--ui-line);border-radius:var(--ui-panel-radius);box-shadow:var(--shadow);background:var(--ui-surface);}
.app .btn,dialog .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:9px 13px!important;border:1px solid var(--ui-line);border-radius:var(--ui-radius)!important;font-size:12px!important;font-weight:600;line-height:1.35;text-decoration:none;box-shadow:none;cursor:pointer;vertical-align:middle;}
.app .btn.primary,dialog .btn.primary{background:var(--ui-green)!important;border-color:var(--ui-green)!important;color:white!important;}
.app .btn.secondary,dialog .btn.secondary{background:#fff!important;border-color:var(--ui-line)!important;color:#40554a!important;}
.app .btn.primary:hover,dialog .btn.primary:hover{background:var(--ui-green-hover)!important;}
.app .btn.secondary:hover,dialog .btn.secondary:hover{background:#f2f6f3!important;}
.app .btn:disabled,dialog .btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;}
.app :is(button,a,input,select,textarea):focus-visible,dialog :is(button,a,input,select,textarea):focus-visible{outline:2px solid #62b995;outline-offset:3px;}
.app :is(input[type=text],input[type=search],input[type=number],input[type=date],input[type=password],select),dialog :is(input[type=text],input[type=number],input[type=date],input[type=password],select){height:40px;min-height:40px;border:1px solid #d9e3dc;border-radius:var(--ui-radius);background:#fff;color:var(--ui-ink);padding:9px 11px;font-size:13px;line-height:1.4;box-shadow:none;}
.app input::placeholder,.app textarea::placeholder{color:#8a958e;}
.app textarea,dialog textarea{border:1px solid #d9e3dc;border-radius:var(--ui-radius);padding:10px 12px;background:#fff;color:var(--ui-ink);font-size:12px;line-height:1.6;}
.app label.field,.app .bonus-toolbar>label,.app .paid-client-picker>label,.app .bonus-picker>label{font-size:12px;font-weight:500;color:#67776d;}
.app .helper,.app .fileline,.app .bonus-heading p{font-size:12px;line-height:1.5;color:var(--ui-muted);}
.app :is(#bonusPortal,#paidPortal,#clientPortal){padding:24px;}
.app .bonus-heading{align-items:center;gap:16px;margin-bottom:20px;}
.app .bonus-heading h2{font-size:21px!important;font-weight:600;line-height:1.3;margin:0 0 5px!important;color:var(--ui-ink);}
.app .bonus-heading p{margin:0!important;}
.app .bonus-toolbar{gap:12px;align-items:flex-end;}
.app .bonus-payment .bonus-toolbar{align-items:start;}
.app .bonus-toolbar>label{display:flex;flex-direction:column;gap:6px;}
.app .bonus-toolbar .search-wrap{min-width:0;}
.app #clientPortal .paid-client-picker{flex:1;max-width:520px;}
.app .bonus-builder{gap:14px;align-items:start;}
.app .bonus-picker>label{display:block;margin-bottom:6px;}
.app #bonusAdd{margin-top:24px;}
.app :is(.suggestions,.bonus-matches){border:1px solid var(--ui-line);border-radius:10px;box-shadow:0 8px 24px rgba(32,51,42,.08);}
.app :is(.suggestion,.bonus-match){padding:11px 13px;border-bottom:1px solid #edf1ee;}
.app :is(.suggestion,.bonus-match) strong{font-size:12px;font-weight:600;line-height:1.45;}
.app :is(.suggestion,.bonus-match) :is(span,small){font-size:11px;line-height:1.5;}
.app .bonus-selection{background:#f4f8f5;border:1px solid #deebe2;border-radius:8px;padding:10px;}
.app .bonus-selection strong{font-size:12px;}
.app .bonus-selection small{font-size:11px;line-height:1.5;}
.app .bonus-selection [data-clear-selection]{align-self:start;min-height:28px;padding:4px 8px!important;}
/* Segmented navigation: same component in every canvas */
.app :is(.bonus-subnav,.client-view-switch,.tabs){display:flex;align-items:center;flex-wrap:wrap;gap:4px;width:fit-content;padding:4px!important;background:#f0f4f2;border:1px solid #e2e9e4;border-radius:10px;margin-bottom:18px;}
.app .tabs{margin:16px 20px 0;position:static;}
.app :is(.bonus-subnav,.client-view-switch) .btn,.app .tabs .tab{min-height:34px;padding:8px 13px!important;background:transparent!important;border:1px solid transparent!important;border-radius:7px!important;color:#6a796f!important;font-size:12px!important;font-weight:500;line-height:1.35;box-shadow:none;}
.app :is(.bonus-subnav,.client-view-switch) .btn[aria-pressed=true],.app .tabs .tab.active{background:#fff!important;border:1px solid #d8e7dd!important;color:var(--ui-green)!important;font-weight:600;box-shadow:0 1px 3px rgba(32,51,42,.05);}
.app .tabs .tab:after{display:none!important;}
/* Sidebar keeps its own navigation hierarchy */
.app .management-menu .btn.secondary{justify-content:flex-start;background:transparent!important;border:0!important;color:#607167!important;box-shadow:none;min-height:48px;padding:12px 11px!important;font-size:13px!important;}
.app .management-menu .btn[aria-pressed=true]{background:var(--ui-green-soft)!important;color:var(--ui-green)!important;box-shadow:inset 0 0 0 1px #d6e8de;}
.app .management-menu .btn.secondary:hover{background:#eef4f0!important;}
.app .nav-collapsed .management-menu .btn.secondary{justify-content:center;padding:12px 0!important;}
/* Table and status language */
.app .table-scroll{border-radius:9px;border:1px solid var(--ui-line);}
.app .table-scroll table{font-size:12px;border:0;width:100%;}
.app .table-scroll th{background:#f5f8f6;color:#64756b;font-size:11px;font-weight:600;line-height:1.5;padding:10px 12px;letter-spacing:0;text-transform:none;}
.app .table-scroll td{padding:11px 12px;line-height:1.5;border-bottom:1px solid #e8eee9;}
.app .table-scroll td.num,.app .table-scroll th.num{text-align:right;font-variant-numeric:tabular-nums;}
.app .bonus-work-table td strong{font-size:12px;}
.app .bonus-work-table>tbody>tr:not(.bonus-detail-row)>td{vertical-align:top;}
.app .bonus-row-actions{display:flex;gap:6px;flex-wrap:wrap;align-items:flex-start;}
.app .bonus-row-actions .btn{min-height:30px;font-size:11px!important;padding:6px 9px!important;}
.app :is(.bonus-status,.search-contract-status,.paid-resolved-status,.payment-overdue-status){font-size:10px!important;font-weight:600;line-height:1.5;border-radius:5px;padding:3px 7px;}
.app :is(.bonus-status,.search-contract-status){color:var(--ui-green)!important;background:var(--ui-green-soft);}
.app :is(.bonus-status.fail,.paid-resolved-status,.search-contract-status.resolved,.payment-overdue-status){color:var(--ui-terracotta)!important;background:var(--ui-terracotta-soft);}
.app .bonus-status.review{color:var(--ui-warning)!important;background:var(--ui-warning-soft);}
.app .bonus-economics{gap:8px;background:transparent;border-color:var(--ui-line);border-radius:8px;}
.app .bonus-economics>div{border-radius:7px;background:#f5f8f6;padding:10px 12px;font-size:11px;color:#76847b;}
.app .bonus-economics strong{font-size:14px;color:var(--ui-ink);}
.app .bonus-detail-row .bonus-check strong{color:var(--ui-green);}
.app .bonus-detail-row .bonus-check.needs-review strong{color:var(--ui-warning);}
.app .bonus-detail-row .bonus-payment .btn.primary{background:var(--ui-decision)!important;border-color:var(--ui-decision)!important;color:#fff!important;}
.app .bonus-detail-row .bonus-payment .btn.primary:hover{background:#243c4e!important;}
.app .client-report-section h3{font-size:15px;}
.app .client-contract h4{font-size:13px;}
.app .client-facts{gap:12px;}
.app .client-facts strong{font-size:14px;}
.app .notice,.app .bonus-notes{border:1px solid var(--ui-line);border-radius:8px;font-size:12px;line-height:1.6;background:#f5f8f6;color:#5e7065;padding:11px 13px;}
.app .empty{font-size:13px;line-height:1.5;color:var(--ui-muted);}
/* Document actions are stacked, including the generated WhatsApp link */
.app .generate-box{display:flex;flex-direction:column;gap:10px;}
.app .generate-box>.btn{width:100%;margin:0!important;}
.app #sendClientFeedback:empty{display:none;}
.app #sendClientFeedback .btn{display:flex;width:100%;margin:0 0 8px;padding:10px 12px!important;white-space:normal;text-align:center;}
.app dialog,dialog.paid-report-dialog{border:1px solid var(--ui-line);border-radius:14px;box-shadow:0 18px 60px rgba(20,40,30,.18);font-size:13px;}
.app dialog::backdrop,dialog.paid-report-dialog::backdrop{background:rgba(25,45,35,.35);}
.app dialog h3{font-size:17px;line-height:1.4;}
.app dialog .bonus-toolbar{margin-top:16px;}
@media(max-width:900px){.app .management-menu .btn.secondary{font-size:12px!important;min-height:36px;}.app .management-menu .btn[aria-pressed=true]{border-bottom:0!important;}.app .nav-collapsed .management-menu .btn.secondary{justify-content:flex-start;padding:12px 11px!important;}}
@media(max-width:650px){.app :is(#bonusPortal,#paidPortal,#clientPortal){padding:16px;}.app .bonus-heading h2{font-size:19px!important;}.app :is(.bonus-subnav,.client-view-switch){width:100%;}.app :is(.bonus-subnav,.client-view-switch) .btn{flex:1;padding:8px 9px!important;font-size:11px!important;}.app .tabs{max-width:calc(100% - 32px);margin:14px 16px 0;}.app #bonusAdd{margin-top:0;}.app .bonus-row-actions{gap:4px;}.app .bonus-payment .bonus-toolbar{grid-template-columns:1fr;}}
}
