/* Referral review workbench. All rules are limited to this section and its dialogs. */
#referralManagementContainer{container-type:inline-size}
#referralManagementContainer .ref-workbench{--ref-ink:#203b4a;--ref-sub:#526773;--ref-line:#dce5e9;--ref-surface:#fff;--ref-soft:#f5f8fa;--ref-primary:#126d91;--ref-tint:#e7f3f8;color:var(--ref-ink);background:var(--ref-surface);border:1px solid var(--ref-line);border-radius:16px;padding:24px;font-size:calc(1rem * var(--account-font-scale, 1));line-height:1.6}
#referralManagementContainer .ref-workbench *{box-sizing:border-box;min-width:0}
#referralManagementContainer [hidden],#referralDetailModal [hidden]{display:none!important}
#referralManagementContainer .ref-heading{display:flex;justify-content:space-between;align-items:start;gap:16px;flex-wrap:wrap;margin-bottom:20px}
#referralManagementContainer h3{font-size:calc(1.5rem * var(--account-font-scale, 1));line-height:1.4;margin:0 0 6px}
#referralManagementContainer .ref-heading p{color:var(--ref-sub);font-size:calc(.875rem * var(--account-font-scale, 1));margin:0}
#referralManagementContainer .ref-heading-actions{display:flex;gap:8px;flex-wrap:wrap}
#referralManagementContainer .ref-heading-actions .btn{font-size:calc(.875rem * var(--account-font-scale, 1));min-height:44px}
#referralManagementContainer .ref-month-panel{padding:16px;background:var(--ref-soft);border:1px solid var(--ref-line);border-radius:10px;margin-bottom:18px}
#referralManagementContainer h4{margin:0 0 10px;font-size:calc(.875rem * var(--account-font-scale, 1));font-weight:600;color:var(--ref-sub)}
#referralManagementContainer .ref-months,#referralManagementContainer .ref-stats{display:flex;flex-wrap:wrap;gap:8px}
#referralManagementContainer .ref-months button,#referralManagementContainer .ref-stats button{font:inherit;font-size:calc(.9375rem * var(--account-font-scale, 1));color:var(--ref-ink);background:var(--ref-surface);border:1px solid var(--ref-line);border-radius:7px;min-height:44px;padding:9px 14px;cursor:pointer;line-height:1.5}
#referralManagementContainer .ref-months strong{font-weight:500;margin-left:8px}
#referralManagementContainer .ref-stats strong{font-size:calc(1.125rem * var(--account-font-scale, 1));margin-left:8px}
#referralManagementContainer .ref-months button[aria-pressed=true]{background:var(--ref-primary);color:#fff;border-color:var(--ref-primary)}
#referralManagementContainer .ref-stats button[aria-pressed=true]{color:var(--ref-primary);background:var(--ref-tint);border-color:var(--ref-primary)}
#referralManagementContainer .ref-summary{border-top:1px solid var(--ref-line);margin-top:16px;padding-top:14px}
#referralManagementContainer .ref-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end;background:var(--ref-soft);padding:14px;border:1px solid var(--ref-line);border-radius:10px}
#referralManagementContainer .ref-toolbar label{display:grid;gap:5px;color:var(--ref-sub);font-size:calc(.875rem * var(--account-font-scale, 1));margin:0}
#referralManagementContainer .ref-toolbar input,#referralManagementContainer .ref-toolbar select{width:100%;min-width:0;border:1px solid #b9c9d3;border-radius:6px;padding:10px;font:inherit;font-size:calc(1rem * var(--account-font-scale, 1));color:var(--ref-ink);background:#fff;min-height:44px}
#referralManagementContainer .ref-toolbar input{background-image:none}
#referralManagementContainer .ref-result-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:12px 0;font-size:calc(.875rem * var(--account-font-scale, 1));color:var(--ref-sub)}
#referralManagementContainer .ref-text-btn{font:inherit;font-size:calc(.875rem * var(--account-font-scale, 1));line-height:1.5;min-height:40px;padding:5px 0;background:transparent;color:var(--ref-primary);border:0;cursor:pointer;text-align:left}
#referralManagementContainer .ref-list{max-height:560px;overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;scrollbar-width:auto;scrollbar-color:#6e8795 var(--ref-soft);border:1px solid var(--ref-line);border-radius:10px;-webkit-overflow-scrolling:touch;position:relative}
#referralManagementContainer .ref-list::-webkit-scrollbar{width:14px}
#referralManagementContainer .ref-list::-webkit-scrollbar-track{background:var(--ref-soft)}
#referralManagementContainer .ref-list::-webkit-scrollbar-thumb{background:#6e8795;border:3px solid var(--ref-soft);border-radius:8px}
#referralManagementContainer .ref-table{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;min-width:0;font-size:calc(1rem * var(--account-font-scale, 1))}
#referralManagementContainer .ref-table th{position:sticky;top:0;z-index:2;background:#edf3f7;font-size:calc(.875rem * var(--account-font-scale, 1));font-weight:700;color:var(--ref-ink);padding:12px 14px;text-align:left;border-bottom:1px solid var(--ref-line);overflow-wrap:anywhere}
#referralManagementContainer .ref-table th:nth-child(1){width:14%}
#referralManagementContainer .ref-table th:nth-child(2){width:23%}
#referralManagementContainer .ref-table th:nth-child(3){width:15%}
#referralManagementContainer .ref-table th:nth-child(4){width:29%}
#referralManagementContainer .ref-table th:nth-child(5){width:19%}
#referralManagementContainer .ref-table td{padding:18px 14px;vertical-align:top;white-space:normal;border-bottom:1px solid var(--ref-line);overflow-wrap:anywhere;color:var(--ref-ink)}
#referralManagementContainer .ref-table tr:last-child td{border-bottom:0}
#referralManagementContainer .ref-table tbody tr:nth-child(even){background:var(--ref-soft)}
#referralManagementContainer .ref-table tbody tr:hover{background:var(--ref-tint)}
#referralManagementContainer .ref-name{display:block;font-size:calc(1.125rem * var(--account-font-scale, 1));font-weight:700}
#referralManagementContainer .ref-class{display:block;margin-top:4px;color:var(--ref-sub)}
#referralManagementContainer .ref-application>span{display:block}
#referralManagementContainer .ref-secondary{font-size:calc(.875rem * var(--account-font-scale, 1));color:var(--ref-sub)}
#referralManagementContainer .ref-code{font:calc(.875rem * var(--account-font-scale, 1))/1.6 ui-monospace,Consolas,monospace;color:var(--ref-sub);user-select:all;overflow-wrap:anywhere}
#referralManagementContainer .ref-status{display:inline-block;font-size:calc(.875rem * var(--account-font-scale, 1));font-weight:600;background:var(--ref-tint);color:var(--ref-primary);border-radius:6px;padding:5px 8px;line-height:1.5}
#referralManagementContainer .ref-completed{background:#eaf5ee;color:#2e6a54}
#referralManagementContainer .ref-note{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
#referralManagementContainer .ref-clamped{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#referralManagementContainer .ref-row-actions{display:flex;gap:6px;flex-wrap:wrap;align-items:start}
#referralManagementContainer .ref-row-actions .btn{font-size:calc(.875rem * var(--account-font-scale, 1));padding:7px 9px;min-height:40px;line-height:1.5;white-space:normal}
#referralManagementContainer .ref-row-actions .btn-primary{background:var(--ref-primary);border-color:var(--ref-primary);color:#fff}
#referralManagementContainer .ref-more{width:100%}
#referralManagementContainer .ref-more summary{display:inline-block;list-style:none;font-size:calc(.875rem * var(--account-font-scale, 1));border:1px solid var(--ref-line);border-radius:7px;padding:7px 9px;min-height:40px;background:var(--ref-surface);cursor:pointer}
#referralManagementContainer .ref-more summary::-webkit-details-marker{display:none}
#referralManagementContainer .ref-more-options{display:grid;gap:4px;margin-top:6px;padding:6px;border:1px solid var(--ref-line);background:var(--ref-surface);border-radius:7px}
#referralManagementContainer .ref-more-options button{font:inherit;font-size:calc(.875rem * var(--account-font-scale, 1));text-align:left;border:0;background:transparent;color:var(--ref-ink);padding:8px 4px;min-height:40px;cursor:pointer;overflow-wrap:anywhere}
#referralManagementContainer .ref-more-options .ref-danger{color:#aa3030}
#referralManagementContainer .ref-cell-label{display:none!important}
#referralManagementContainer .ref-notice{margin:10px 0;padding:10px 12px;background:#fff4dc;color:#6e4a13;border-radius:8px;font-size:calc(.875rem * var(--account-font-scale, 1))}
#referralManagementContainer .ref-scroll-hint{margin:8px 0;color:var(--ref-sub);font-size:calc(.875rem * var(--account-font-scale, 1));text-align:right}
#referralManagementContainer .ref-empty{text-align:center;padding:32px 16px!important;color:var(--ref-sub)}
#referralManagementContainer .ref-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#referralManagementContainer :is(button,input,select,summary,a):focus-visible,#referralList:focus-visible{outline:3px solid #126d91;outline-offset:3px}
#referralManagementContainer button:disabled{opacity:.6;cursor:wait}
@container (max-width:860px){
 #referralManagementContainer .ref-table thead{display:none}
 #referralManagementContainer .ref-table,#referralManagementContainer .ref-table tbody{display:block}
 #referralManagementContainer .ref-table tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:16px;border-bottom:1px solid var(--ref-line)}
 #referralManagementContainer .ref-table td{display:block;width:auto;padding:0;border:0}
 #referralManagementContainer .ref-person{grid-area:1/1}
 #referralManagementContainer .ref-state-cell{grid-area:1/2}
 #referralManagementContainer .ref-application,#referralManagementContainer .ref-notes,#referralManagementContainer .ref-actions-cell,#referralManagementContainer .ref-empty{grid-column:1/-1}
 #referralManagementContainer .ref-notes{padding-top:10px!important;border-top:1px solid var(--ref-line)!important}
 #referralManagementContainer .ref-cell-label{display:block!important;font-size:calc(.875rem * var(--account-font-scale, 1));color:var(--ref-sub);margin-bottom:5px}
 #referralManagementContainer .ref-more{width:auto;max-width:100%}
 #referralManagementContainer .ref-table tr:last-child{border-bottom:0}
}
@container (max-width:480px){
 #referralManagementContainer .ref-workbench{padding:14px}
 #referralManagementContainer .ref-toolbar{grid-template-columns:1fr}
 #referralManagementContainer .ref-months{display:grid;grid-template-columns:1fr 1fr}
 #referralManagementContainer .ref-months button{padding:8px 6px;font-size:calc(.875rem * var(--account-font-scale, 1))}
 #referralManagementContainer .ref-months strong{margin-left:4px}
 #referralManagementContainer .ref-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
 #referralManagementContainer .ref-stats button{padding:8px 4px;font-size:calc(.875rem * var(--account-font-scale, 1))}
 #referralManagementContainer .ref-stats strong{display:block;margin:2px 0 0;font-size:calc(1.25rem * var(--account-font-scale, 1))}
 #referralManagementContainer .ref-row-actions .btn,#referralManagementContainer .ref-more summary{min-height:44px}
}
/* Existing detail and edit dialogs keep their data and actions. */
:is(#referralDetailModal,#editReferralModal) .modal-card{max-height:calc(100dvh - 24px);display:flex;flex-direction:column;overflow:hidden}
:is(#referralDetailModal,#editReferralModal) .modal-body{min-height:0;overflow-y:auto!important;max-height:none!important;font-size:calc(1rem * var(--account-font-scale, 1));line-height:1.7}
:is(#referralDetailModal,#editReferralModal) .modal-header{flex-shrink:0}
:is(#referralDetailModal,#editReferralModal) :is(input,select,textarea){font-size:calc(1rem * var(--account-font-scale, 1))!important;min-height:44px;max-width:100%}
:is(#referralDetailModal,#editReferralModal) :is(p,span,label,strong,h4){font-size:inherit!important;overflow-wrap:anywhere}
#referralDetailModal .modal-card>div:last-child{flex-shrink:0;flex-wrap:wrap;gap:8px}
#referralDetailModal #refModalContent{overflow-wrap:anywhere}
@media(max-width:600px){
 :is(#referralDetailModal,#editReferralModal){padding:8px!important}
 :is(#referralDetailModal,#editReferralModal) .modal-card{width:100%;max-width:100%!important}
 :is(#referralDetailModal,#editReferralModal) .modal-body{padding:16px!important}
 #referralDetailModal .modal-body [style*="grid-template-columns"],#editReferralModal .form-row{display:grid!important;grid-template-columns:1fr!important}
 #referralDetailModal .modal-title{min-width:0}
}
