/*
    SIP client portal styling — client_portal (6).html's own <style> block, scoped to .sip-portal.

    Generated by prefixing every selector in the template's stylesheet with the scope root, so the
    values are the template's verbatim rather than reinterpreted: :root and body both map to
    .sip-portal, which is why the custom properties and the page background land on that element.

    Deliberately separate from wwwroot/css/modern-ui.css: that file is shared with Data Connectors,
    Data Sources and Smart Reports, so SIP's palette and typography must not go in it. Nothing here
    matches outside .sip-portal.

    This is a PRUNED subset, not the template's stylesheet verbatim: the 99 rules that could never
    match were removed once the list pages, tables, pagination and repeat-lists became MudBlazor
    components. Re-scoping the template afresh would bring them all back, so prune again rather than
    regenerating wholesale.

    Palette: navy #1E2F97, purple #4600B8, card #F5F7FC, border #DEE2F2, page #F7F8FC;
    Calibri body, Cambria headings.
*/
.sip-portal {
    --navy:#1E2F97; --purple:#4600B8; --gray:#555B6E; --green:#1C8A55; --red:#C0392B; --amber:#B8790B;
    --card:#F5F7FC; --border:#DEE2F2;
  }
.sip-portal * {box-sizing:border-box;}
.sip-portal {
    margin:0;font-family:Calibri,'Segoe UI',Arial,sans-serif;background:#F7F8FC;color:var(--navy);
    -webkit-font-smoothing:antialiased;
  }
.sip-portal h1, .sip-portal h2, .sip-portal h3, .sip-portal h4 {font-family:Cambria,Georgia,serif;margin:0;}
.sip-portal .wrap {max-width:980px;margin:0 auto;padding:34px 24px 90px;}
.sip-portal .btn-secondary {
    padding:9px 16px;border-radius:8px;border:1px solid var(--border);background:#fff;color:var(--navy);
    font-size:13px;font-weight:700;cursor:pointer;
  }
.sip-portal .btn-secondary:hover {background:var(--card);border-color:var(--navy);}
@media print {
.sip-portal .no-print {display:none !important;}
.sip-portal {background:#fff;}
}
.sip-portal /* Quote header info panels — MudPaper has no token for a tinted card with an accent
  edge, so this supplies just that; everything else (grid, layout, chips) is MudBlazor components
  and its own utility classes. */
  .qhi-panel {background:var(--card);border:1px solid var(--border);border-radius:8px;}
.sip-portal .qhi-panel-source {border-left:3px solid var(--navy);}
.sip-portal .qhi-panel-quote {border-left:3px solid var(--purple);}
.sip-portal /* Left tab nav, matching entry-nav in the broker's quote entry tool */
  .entry-layout {display:flex;gap:24px;align-items:flex-start;}
.sip-portal .entry-nav {
    width:250px;flex-shrink:0;
    border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#fff;
  }
.sip-portal .entry-nav-section + .entry-nav-section {border-top:1px solid var(--border);}
.sip-portal .entry-nav-main {
    display:flex;align-items:center;justify-content:space-between;gap:8px;
    padding:13px 16px;font-size:13.5px;font-weight:700;color:var(--navy);
    background:var(--card);cursor:pointer;user-select:none;
  }
.sip-portal .entry-nav-main.active {background:var(--navy);color:#fff;}
.sip-portal .entry-nav-main .n {
    font-size:10.5px;font-weight:700;color:var(--gray);background:#fff;
    border:1px solid var(--border);padding:1px 7px;border-radius:20px;
  }
.sip-portal .entry-nav-main.active .n {background:rgba(255,255,255,.18);color:#fff;border-color:transparent;}
.sip-portal .entry-nav-subs {padding:6px 0;}
.sip-portal .entry-nav-sub {
    display:flex;align-items:center;justify-content:space-between;gap:8px;
    padding:9px 16px 9px 24px;font-size:12.5px;font-weight:600;color:var(--gray);
    cursor:pointer;border-left:3px solid transparent;
  }
.sip-portal .entry-nav-sub:hover {background:var(--card);}
.sip-portal .entry-nav-sub.active {color:var(--purple);background:#EDEBFB;border-left-color:var(--purple);font-weight:700;}
.sip-portal .entry-nav-sub .n {font-size:10px;color:#9AA2C4;font-weight:700;}
.sip-portal .entry-content {flex:1;min-width:0;}
@media (max-width:800px) {
.sip-portal .entry-layout {flex-direction:column;}
.sip-portal .entry-nav {width:100%;}
}
.sip-portal /* Field grid + inputs, matching the entry form's field-row/field-grid */
  .subgroup-heading {
    display:flex;align-items:center;gap:10px;font-size:11.5px;font-weight:bold;letter-spacing:.6px;
    text-transform:uppercase;color:var(--purple);background:var(--card);border:1px solid var(--border);
    padding:9px 16px;border-radius:8px;margin:0 0 14px;
  }
.sip-portal .subgroup-heading .n {
    background:#fff;border:1px solid var(--border);color:var(--gray);font-weight:700;font-size:10.5px;
    padding:1px 8px;border-radius:20px;text-transform:none;letter-spacing:normal;
  }
.sip-portal .field-grid {display:grid;grid-template-columns:1fr 1fr;gap:0 20px;}
.sip-portal .field-row {margin-bottom:16px;}
.sip-portal .field-row.wide {grid-column:span 2;}
@media (max-width:700px) {
.sip-portal .field-grid {grid-template-columns:1fr;}
.sip-portal .field-row.wide {grid-column:span 1;}
}
.sip-portal .qm-repairs-subhead {
    grid-column:1 / -1;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;
    color:var(--purple);background:var(--card);border:1px solid var(--border);border-radius:8px;
    padding:7px 12px;margin:2px 0 8px;
  }
.sip-portal .qm-wall-pct-row {
    grid-column:1 / -1;display:flex !important;align-items:center;justify-content:space-between;
    gap:14px;margin-bottom:10px;
  }
.sip-portal .qm-wall-pct-row .field-label {margin-bottom:0;flex:1;min-width:0;}
.sip-portal .qm-wall-pct-row .readonly-field {flex-shrink:0;width:auto;}
.sip-portal .percent-wrap {position:relative;width:100px;flex-shrink:0;}
.sip-portal .percent-wrap input, .sip-portal .field-row .percent-wrap input[type=text] {width:100%;padding-right:26px;text-align:right;}
.sip-portal .percent-wrap .percent-sign {
    position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#9AA2C4;font-size:13px;pointer-events:none;
  }
.sip-portal .qm-wall-pct-total {
    grid-column:1 / -1;display:flex;justify-content:space-between;align-items:center;
    padding:10px 14px;margin-top:2px;border-radius:8px;background:var(--card);border:1px solid var(--border);
    font-size:13px;font-weight:700;color:var(--navy);
  }
.sip-portal .qm-wall-pct-total.over {background:#FDECEA;border-color:#F3C7C4;color:var(--red);}
.sip-portal label.field-label {display:block;font-size:12.5px;font-weight:700;color:var(--navy);margin-bottom:6px;}
.sip-portal .req {color:var(--red);}
.sip-portal .field-row input[type=text], .sip-portal .field-row select {
    width:100%;padding:9px 11px;border-radius:8px;border:1px solid var(--border);
    font-size:13.5px;font-family:inherit;color:var(--navy);background:#fff;
  }
.sip-portal .field-row input[type=text]:focus, .sip-portal .field-row select:focus {outline:none;border-color:var(--purple);}
.sip-portal .yn-group {display:flex;gap:8px;}
.sip-portal .yn-btn {
    flex:1;padding:9px 0;border-radius:8px;font-size:13px;font-weight:700;cursor:pointer;
    border:1px solid var(--border);background:#fff;color:var(--gray);
  }
.sip-portal .yn-btn.active {background:var(--navy);color:#fff;border-color:var(--navy);}
.sip-portal .pill-group {display:flex;flex-wrap:wrap;gap:6px;}
.sip-portal .pill {
    padding:6px 12px;border-radius:20px;font-size:12.5px;font-weight:600;cursor:pointer;
    border:1px solid var(--border);background:#fff;color:var(--gray);
  }
.sip-portal .pill.active {background:#EDEBFB;color:var(--purple);border-color:var(--purple);}
.sip-portal .currency-wrap {position:relative;}
.sip-portal .currency-wrap .dollar {position:absolute;left:11px;top:50%;transform:translateY(-50%);color:#9AA2C4;font-size:13px;}
.sip-portal .currency-wrap input, .sip-portal .field-row .currency-wrap input[type=text] {padding-left:24px;}
.sip-portal .readonly-field {
    padding:9px 11px;border-radius:8px;border:1px solid var(--border);background:#F3F5FA;
    font-size:13.5px;color:var(--navy);font-weight:700;
  }
.sip-portal .readonly-empty {color:#9AA2C4;font-weight:600;font-style:italic;}
.sip-portal .readonly-tag {
    font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;color:var(--gray);
    background:#EEF0F6;border:1px solid var(--border);padding:1px 7px;border-radius:20px;margin-left:4px;
  }
.sip-portal .readonly-option-list {display:flex;flex-wrap:wrap;gap:6px;}
.sip-portal .readonly-option {
    font-size:11.5px;font-weight:600;padding:4px 11px;border-radius:20px;
    background:#F3F5FA;border:1px solid var(--border);color:#9AA2C4;
  }
.sip-portal .readonly-option.checked {
    background:#EDEBFB;border-color:var(--purple);color:var(--purple);font-weight:700;
  }

/*
    Additions beyond the template's own stylesheet. The template has no hint class: these two carry
    the percentage-tier guidance under "Catastrophe Sum Insured" and "Loss of Rent", which the app
    shows and client_portal (6).html does not. Values reuse the template's tokens so they sit in the
    same visual language.
*/
.sip-portal .hint { font-size:11.5px; color:var(--gray); margin-top:5px; }
.sip-portal .hint-warn { color:var(--red); font-weight:700; }
.sip-portal .field-benefit-list { margin:8px 0 0; padding-left:20px; font-size:13px; color:var(--gray); list-style:disc outside; }
.sip-portal .field-benefit-list li { margin:2px 0; list-style:disc outside; display:list-item; }

.sip-portal .sip-busy-bar {position:sticky;top:0;z-index:20;height:4px;margin:-8px 0 8px;}
.sip-portal .entry-nav-main.has-missing {color:var(--red);}
.sip-portal .entry-nav-main .n-missing {background:var(--red) !important;color:#fff !important;}
.sip-portal .entry-nav-sub .n-missing {color:var(--red) !important;}
.sip-portal .field-row.field-missing {border-radius:8px;box-shadow:inset 3px 0 0 var(--red);padding-left:11px;background:#FDF3F2;}
.sip-portal .field-row.field-missing input[type=text], .sip-portal .field-row.field-missing input[type=date], .sip-portal .field-row.field-missing input[type=number], .sip-portal .field-row.field-missing select, .sip-portal .field-row.field-missing textarea {border-color:var(--red);}
.sip-portal .field-missing-tag {margin-left:8px;padding:1px 7px;border-radius:9px;background:var(--red);color:#fff;font-size:11px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;}
@media (min-width:600px) {.sip-portal .sip-claim-description {min-width:240px;} .sip-portal .sip-claim-policy {min-width:160px;}}

.sip-portal .mud-placeholder-extended { font-weight : 400 }
