/* Shared visual contract. Module styles own layout; these components own appearance. */
@layer ui {
  :root {
    --ui-brand: #850806;
    --ui-brand-hover: #690b09;
    --ui-brand-soft: #f9efeb;
    --ui-text: #302a27;
    --ui-muted: #73675f;
    --ui-hint: #84766b;
    --ui-border: #e4d9d1;
    --ui-control-border: #ccbbb0;
    --ui-page: #f8f7f5;
    --ui-surface: #fff;
    --ui-soft: #f7f3ef;
    --ui-focus: #a64c32;
    --ui-success: #28633c;
    --ui-success-bg: #edf6ef;
    --ui-danger: #a22f24;
    --ui-danger-bg: #fff1ed;
    --ui-radius: 14px;
    --ui-control-radius: 10px;
    --ui-control-height: 48px;
    --ui-font: 'Segoe UI', Arial, sans-serif;
    --wine: var(--ui-brand);
    --text: var(--ui-text);
    --muted: var(--ui-muted);
    --line: var(--ui-border);
    --page: var(--ui-page);
  }
  body { font-family: var(--ui-font); color: var(--ui-text); font-size: 16px; }
  :where(button,input,select,textarea) { font-family: inherit; }
  :where(a,button,input,select,textarea,summary):focus-visible { outline: 3px solid var(--ui-focus); outline-offset: 3px; }
  .ui-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: var(--ui-control-height);
    height: auto;
    border: 1px solid transparent;
    border-radius: var(--ui-control-radius);
    padding: 11px 18px;
    background: transparent;
    color: var(--ui-brand);
    font: 600 16px/1.45 var(--ui-font);
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    vertical-align: middle;
    transition: background-color .15s, border-color .15s, box-shadow .15s;
  }
  .ui-button > svg { width: 19px; height: 19px; flex-shrink: 0; }
  .ui-button--primary { color: white; background: var(--ui-brand); border-color: var(--ui-brand); box-shadow: 0 2px 4px #57190a0a; }
  .ui-button--primary:hover:not(:disabled) { background: var(--ui-brand-hover); border-color: var(--ui-brand-hover); }
  .ui-button--secondary, .ui-button--back { background: white; border-color: var(--ui-control-border); color: var(--ui-brand); box-shadow: none; }
  .ui-button--secondary:hover:not(:disabled), .ui-button--back:hover { background: var(--ui-brand-soft); border-color: #b38b75; }
  .ui-button--back { max-width:100%; white-space:normal; text-align:left; margin-bottom: 24px; font-weight: 500; color: #66574d; padding-inline: 14px 18px; }
  .ui-button--back > svg { transform:none; flex:0 0 18px; color: var(--ui-brand); width: 18px; height: 18px; }
  .ui-button--compact { min-height: 44px; padding: 9px 14px; font-size: 15px; }
  .ui-button--text { color: var(--ui-brand); border-color: transparent; background: transparent; box-shadow: none; padding: 10px 12px; font-size: 15px; font-weight: 500; text-decoration: none; }
  .ui-button--text:hover:not(:disabled) { background: var(--ui-brand-soft); color: var(--ui-brand-hover); }
  .ui-button--danger { color: var(--ui-danger); background: white; border-color: #d9afa5; }
  .ui-button--danger:hover:not(:disabled) { background: var(--ui-danger-bg); border-color: var(--ui-danger); }
  .ui-button--inverse { border-color: #ffffff70; color: white; background: #ffffff0c; box-shadow: none; }
  .ui-button--inverse:hover:not(:disabled) { color: white; background: #ffffff1c; border-color: white; }
  .ui-button:disabled, .ui-button[aria-disabled=true] { opacity: .5; cursor: not-allowed; box-shadow: none; }
  .ui-button[aria-busy=true] { cursor: progress; }
  .ui-button[aria-busy=true]::after { content: ''; width: 15px; height: 15px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: ui-spin .7s linear infinite; flex-shrink: 0; }
  .ui-icon-button { display: inline-grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; min-height: 44px; border: 1px solid transparent; border-radius: 9px; background: transparent; color: var(--ui-muted); padding: 10px; cursor: pointer; }
  .ui-icon-button > svg { width: 20px; height: 20px; }
  .ui-icon-button:hover:not(:disabled) { background: var(--ui-brand-soft); color: var(--ui-brand); }
  .ui-label { display: flex; flex-direction: column; gap: 8px; color: #51443a; font-size: 16px; font-weight: 500; line-height: 1.45; min-width: 0; }
  .ui-control { display: block; width: 100%; min-width: 0; min-height: var(--ui-control-height); height: auto; margin: 0; padding: 11px 14px; border: 1px solid var(--ui-control-border); border-radius: var(--ui-control-radius); background: white; color: var(--ui-text); font: 400 16px/1.5 var(--ui-font); box-sizing: border-box; box-shadow: none; transition: border-color .15s, box-shadow .15s; }
  .ui-control:hover:not(:disabled):not([readonly]) { border-color: #a78570; }
  .ui-control::placeholder { color: var(--ui-muted); opacity: 1; font-size: 15px; }
  .ui-control:focus, .ui-input-shell:focus-within { outline: none; border-color: var(--ui-focus); box-shadow: 0 0 0 3px #a64c321c; }
  .ui-control:disabled, fieldset:disabled .ui-control { background: #f4f1ed; color: #7e7066; cursor: not-allowed; }
  .ui-control[readonly] { background: var(--ui-soft); color: #6c5948; }
  .ui-control[aria-invalid=true], .ui-input-shell:has([aria-invalid=true]) { border-color: var(--ui-danger); box-shadow: 0 0 0 2px #a22f2410; }
  textarea.ui-control { min-height: 104px; resize: vertical; }
  select.ui-control { cursor: pointer; padding-right: 30px; }
  input.ui-control[type=date] { color-scheme: light; }
  input.ui-control[type=date]::-webkit-calendar-picker-indicator { opacity: .65; cursor: pointer; }
  .ui-file,.ui-control[type=file] { display:block; width:100%; min-width:0; min-height:var(--ui-control-height); margin:0; padding:7px; border:1px solid var(--ui-control-border); border-radius:var(--ui-control-radius); background:white; color:var(--ui-muted); font:400 14px/1.5 var(--ui-font); }
  :is(.ui-file,.ui-control[type=file])::file-selector-button { font:500 14px/1.4 var(--ui-font); border:0; border-radius:6px; padding:8px 11px; margin-right:10px; color:var(--ui-brand); background:var(--ui-brand-soft); cursor:pointer; }
  .ui-file-message { display:block; overflow-wrap:anywhere; font-size:14px; font-weight:400; line-height:1.5; color:var(--ui-muted); }
  .ui-file-message:empty { display:none; }
  .ui-file-message[data-tone=error] { color:var(--ui-danger); }
  .ui-input-shell { display: flex; align-items: center; gap: 10px; min-height: var(--ui-control-height); height: var(--ui-control-height); border: 1px solid var(--ui-control-border); border-radius: var(--ui-control-radius); background: white; padding: 0 6px 0 13px; }
  .ui-input-shell > svg { width: 19px; height: 19px; color: var(--ui-hint); flex-shrink: 0; }
  .ui-input-shell .ui-control { height: 100%; min-height: 0; padding: 10px 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
  .ui-input-shell .ui-control:focus { outline: none; box-shadow: none; }
  .ui-toolbar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 16px; background: white; border: 1px solid var(--ui-border); border-radius: 12px; padding: 18px; margin: 0 0 26px; }
  .ui-toolbar > label:first-of-type { flex: 1 1 260px; min-width: 180px; }
  .ui-toolbar > label:not(:first-of-type) { flex: 0 1 220px; min-width: 180px; }
  .ui-toolbar > .ui-button { flex: 0 0 auto; margin: 0; }
  .ui-toolbar .ui-control { margin: 0; }
  .ui-panel { background: var(--ui-surface); border: 1px solid var(--ui-border); border-radius: var(--ui-radius); padding: 26px; box-shadow: 0 2px 10px #41281003; min-width: 0; }
  .pc-form.ui-panel { padding: 0; }
  .ui-panel > h2, .ui-panel > .cs-section-heading > h2, .ui-panel > .wh-section-heading > h2 { font-size: 22px; font-weight: 600; line-height: 1.35; color: var(--ui-text); }
  .ui-heading { display:flex; align-items:center; justify-content:space-between; gap:22px; min-width:0; margin-top:6px; margin-bottom:28px; }
  .ui-heading > div { min-width:0; }
  .ui-heading :is(h1,p,.eyebrow) { overflow-wrap:anywhere; }
  .ui-heading h1 { font: 650 34px/1.2 var(--ui-font); letter-spacing: -.7px; color: var(--ui-text); margin: 9px 0 12px; }
  .ui-heading p { font-size: 17px; line-height: 1.65; color: var(--ui-muted); }
  .eyebrow { color: var(--ui-brand); font-size: 12px; font-weight: 650; letter-spacing: 1.4px; }
  .ui-badge { display: inline-flex; align-items: center; gap: 6px; padding: 7px 11px; border: 1px solid #e8dccc; border-radius: 8px; color: #7f5d37; background: #f9f2e8; font-size: 13px; font-weight: 600; line-height: 1.45; }
  .ui-badge:is(.ready,.received,.is-active), .ui-badge[data-tone=success] { color: var(--ui-success); border-color: #d5e7d8; background: var(--ui-success-bg); }
  .ui-badge:is(.cancelled,.incident), .ui-badge[data-tone=danger] { color: var(--ui-danger); border-color: #ecd1c9; background: var(--ui-danger-bg); }
  .ui-badge[data-tone=neutral], .ui-badge.reserved { color: #6b6259; background: #f2eee9; border-color: #e5dcd3; }
  .ui-notice { display: flex; align-items: flex-start; gap: 12px; padding: 16px 18px; border-radius: 10px; border: 1px solid var(--ui-border); font-size: 16px; line-height: 1.6; }
  .ui-notice--success { color: var(--ui-success); background: var(--ui-success-bg); border-color: #cfe3d3; }
  .ui-notice svg { width: 21px; height: 21px; flex-shrink: 0; margin-top: 2px; }
  .ui-notice p { margin: 4px 0 0; }
  .ui-pagination { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 14px; margin: 24px 0 8px; font-size: 14px; color: var(--ui-muted); }
  .ui-pagination > div { display: flex; gap: 10px; }
  .ui-pagination a { display: inline-flex; justify-content: center; align-items: center; min-height: 44px; padding: 8px 14px; margin: 0; border: 1px solid var(--ui-control-border); border-radius: 9px; background: white; color: var(--ui-brand); font-size: 15px; }
  .ui-pagination a:hover { background: var(--ui-brand-soft); }
  :is(.account-grid,.wh-grid,.pa-grid,.cs-grid,.pc-grid) { align-items: end; }
  :is(.pa-form-actions,.wh-form-actions,.cs-form-actions,.form-actions,.profile-dialog-actions) { gap: 12px; }
  .profile-dialog { border-color: var(--ui-border); border-radius: var(--ui-radius); }
  .profile-dialog .ui-label { font-size: 16px; }
  .ui-control + small, .ui-label > small { font-size: 13px; color: var(--ui-muted); line-height: 1.5; }
  .sidebar .nav-item { font: 500 15px/1.45 var(--ui-font); min-height: 48px; padding: 12px 13px; border-radius: 9px; gap: 12px; }
  .sidebar .nav-item.active { font-weight: 600; background: #ffffff18; color: white; }
  .sidebar .nav-item:hover:not(:disabled):not(.active) { background: #ffffff0e; }
  .sidebar .nav-item:focus-visible { outline-color: #e9bd8b; outline-offset: -2px; }
  .sidebar .nav-item:disabled { opacity: .68; }
  .sidebar .logout { min-height: 44px; font-size: 15px; }
  .sidebar .sidebar-caption { letter-spacing: 1.5px; font-size: 11px; }
  :is(.prealerts-page,.warehouse-page,.consolidations-page,.tariffs-page,.locker-workspace) { max-width: 1280px; margin-inline: auto; color: var(--ui-text); }
  .dashboard-content { padding: 30px 32px 0; }
  .account-page, .dashboard-page { background: var(--ui-page); }
  .dashboard-content > :is(section,div,header,form,nav,p) { max-width: 1280px; margin-inline: auto; }
  .topbar { border-bottom-color: var(--ui-border); }
  .pc-submit .ui-button { box-shadow: none; }
  .pc-page .pc-dropzone > input.ui-file { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; opacity: 0; padding: 0; border: 0; }
  .pc-page .pc-header.ui-heading h1 { font-size: 34px; }
  .pc-page .pc-header.ui-heading > p { font-size: 17px; }
  .pc-submit-actions > .ui-button--text { min-height: 48px; }
  .pc-notes summary { min-height: 44px; align-items: center; }
  .cs-final-total, .locker-pass, .pc-locker-card { border-radius: var(--ui-radius); }
  .auth-page .ui-button--text { min-height: 32px; padding: 4px 6px; font-size: 14px; }
  .auth-page .ui-button--back { margin-bottom: 0; min-height: 44px; font-size: 14px; }
  .auth-page .ui-input-shell { margin-top: 7px; }
  .auth-page .register-password.ui-input-shell { margin-top: 0; }
  .auth-page .google-button { width: 100%; }
  .auth-page .ui-label { font-size: 15px; gap: 6px; }
  .auth-page .register-field .ui-label { font-size: 14px; margin-bottom: 6px; }
  .auth-page .register-field > .ui-control { height: 46px; min-height: 46px; padding-block: 9px; }
  .auth-page .register-password.ui-input-shell { height: 46px; min-height: 46px; }
  .auth-page .register-password .ui-control { height: 100%; min-height: 0; }
  .auth-page .auth-submit { width: 100%; min-height: 48px; }
  .legal-header .ui-button--back { margin: 0; }
  .account-header .ui-button { margin: 0; }
  .account-header nav { gap: 12px; }
  .account-header .ui-button--text { min-height: 44px; }
  .ui-heading .eyebrow { color: var(--ui-brand); font-size: 12px; line-height: 1.5; letter-spacing: 1.4px; }
  .ui-surface { background: white; border: 1px solid var(--ui-border); border-radius: var(--ui-radius); }
  :is(.admin-stats > article,.wh-stats > div,.cs-stats > div) { border-color: var(--ui-border); border-radius: 12px; background: white; }
  :is(.admin-stats > article,.wh-stats > div,.cs-stats > div) > strong { color: var(--ui-brand); font-size: 30px; font-weight: 600; }
  :is(.admin-stats > article,.wh-stats > div,.cs-stats > div) > span { color: var(--ui-muted); font-size: 15px; line-height: 1.5; }
  .profile-dialog { background: white; }
  .ui-error { width: min(600px,calc(100% - 36px)); margin: max(32px,9vh) auto; }
  .ui-error-logo { display: block; width: 94px; height: 94px; object-fit: contain; margin: 0 auto 28px; }
  .ui-error .ui-panel { text-align: center; padding: 40px 28px; }
  .ui-error-code { display: block; color: var(--ui-brand); font-size: 14px; letter-spacing: 2px; font-weight: 600; }
  .ui-error h1 { font-size: 30px; line-height: 1.25; margin: 16px 0; }
  .ui-error p { font-size: 17px; line-height: 1.65; color: var(--ui-muted); margin: 0 0 24px; }
  .ui-error .ui-button--back { margin-bottom: 0; }
  .ui-table { width: 100%; border-collapse: collapse; }
  .ui-table th { padding: 16px 12px; color: var(--ui-muted); font-size: 13px; font-weight: 500; border-bottom: 1px solid var(--ui-border); }
  .ui-table td { padding: 16px 12px; border-bottom: 1px solid var(--ui-border); font-size: 16px; line-height: 1.55; }
  .ui-table td small { color: var(--ui-muted); }
  .ui-table tbody tr:hover { background: #fcfaf7; }
  @media(max-width:760px) {
    .ui-table--cards, .ui-table--cards tbody, .ui-table--cards tr, .ui-table--cards td { display: block; width: 100%; }
    .ui-table--cards thead { display: table-header-group; position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
    .ui-table--cards tr { padding: 18px 0; border-bottom: 1px solid var(--ui-border); }
    .ui-table--cards td { padding: 8px 0; border: 0; }
    .ui-table--cards td[data-label]::before { display: block; content: attr(data-label); color: var(--ui-muted); font-size: 13px; font-weight: 400; margin-bottom: 5px; }
    .ui-table--cards td[data-label="Acción"] { padding-top: 14px; }
    .ui-table--cards td .ui-button { width: 100%; }
    .ui-table--cards td strong, .ui-table--cards td small { overflow-wrap: anywhere; }
  }
  .admin-stats > article { display: flex; flex-direction: column; justify-content: space-between; gap: 14px; }
  .admin-stats > article > strong { margin: 0; }
  .ui-control:user-invalid { border-color: var(--ui-danger); }
  @keyframes ui-spin { to { transform: rotate(360deg); } }
  @media(max-width:1100px) { .dashboard-content { padding: 26px 24px 0; } }
  @media(max-width:760px) {
    .ui-heading { align-items: flex-start; flex-direction: column; gap: 18px; margin-bottom: 24px; }
    .ui-heading h1, .pc-page .pc-header.ui-heading h1 { font-size: 29px; letter-spacing: -.45px; }
    .ui-heading p { font-size: 16px; }
    .ui-panel { padding: 20px; border-radius: 12px; }
    .ui-button--back { margin-bottom: 22px; }
    .ui-toolbar { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 14px 12px; padding: 16px; }
    .ui-toolbar > label:first-of-type { grid-column: 1 / -1; min-width: 0; }
    .ui-toolbar > label:not(:first-of-type) { min-width: 0; }
    .ui-toolbar > .ui-button { width: 100%; }
    .ui-toolbar:not(:has(select)) > button[type=submit] { grid-column: 1 / -1; }
    .ui-toolbar > .ui-button--text { justify-self: start; width: auto; padding-inline: 8px; }
    .ui-toolbar > .ui-button--text:last-child { grid-column: 1 / -1; }
    .ui-toolbar .ui-label { font-size: 15px; }
    .ui-heading > .ui-button { max-width: 100%; white-space: normal; }
    .profile-dialog-actions .ui-button { flex: 1; }
    .account-header nav { flex-wrap: wrap; justify-content: end; gap: 4px; }
    .account-header .ui-button--text { font-size: 13px; padding-inline: 8px; }
    .auth-page .back-link { display: none; }
  }
  @media(max-width:600px) {
    .dashboard-content { padding: 24px 18px 0; }
    .ui-heading .ui-button--primary { width: 100%; }
    .ui-panel > h2 { font-size: 21px; }
    .ui-pagination { gap: 10px; font-size: 13px; }
    .ui-button { padding-inline: 15px; }
    .ui-button--compact { padding-inline: 12px; }
    .pc-form.ui-panel { padding: 0; }
  }
  @media(max-height:760px) {
    .auth-page { --ui-control-height: 44px; }
    .auth-page .ui-input-shell, .auth-page .auth-submit, .auth-page .google-button { min-height: 44px; height: 44px; }
    .auth-page .auth-submit, .auth-page .google-button { padding-block: 9px; }
    .auth-page .register-field > .ui-control, .auth-page .register-password.ui-input-shell { height: 42px; min-height: 42px; padding-block: 7px; }
    .auth-page .register-password .ui-control { min-height: 0; height: 100%; padding-block: 7px; }
  }
  @media(prefers-reduced-motion:reduce) { .ui-button, .ui-control { transition: none; } .ui-button[aria-busy=true]::after { animation: none; } }

  /* Portal shell: one navigation contract for customers and administration. */
  .portal-page .sidebar { position:fixed; inset:0 auto 0 0; width:264px; padding:24px 18px; display:flex; flex-direction:column; overflow:hidden; z-index:50; background:linear-gradient(170deg,#810b0a,#560e16); color:white; }
  .portal-sidebar-heading { display:flex; flex-shrink:0; align-items:flex-start; justify-content:space-between; gap:12px; }
  .portal-page .sidebar-logo img { display:block; width:180px; height:90px; object-fit:contain; margin:0 12px 24px; }
  .portal-sidebar-scroll { display:flex; flex-direction:column; flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#ffffff40 transparent; }
  .portal-menu-close { display:none; color:white; --ui-brand-soft:#ffffff18; --ui-brand:white; }
  .portal-page .sidebar-caption { display:block; color:#d9adaa; font-size:11px; letter-spacing:1.6px; margin:22px 13px 8px; }
  .portal-sidebar-scroll > .sidebar-caption, .portal-page nav > .sidebar-caption:first-child { margin-top:0; }
  .portal-page .sidebar nav { display:grid; gap:4px; }
  .portal-page .nav-item { display:flex; width:100%; align-items:center; color:#efd7d2; text-align:left; white-space:normal; border:0; background:transparent; text-decoration:none; }
  .portal-page .nav-item svg { width:20px; height:20px; flex-shrink:0; }
  .active-dot { width:5px; height:5px; margin-left:auto; background:#f0c07c; border-radius:50%; }
  .portal-page .sidebar-bottom { margin-top:auto; padding-top:28px; }
  .sidebar-help { border:1px solid #ffffff20; border-radius:10px; padding:16px; margin-bottom:24px; }
  .sidebar-help > svg { width:20px; height:20px; margin-bottom:10px; color:#ecc49c; }
  .sidebar-help strong { display:block; font-size:15px; font-weight:600; }
  .sidebar-help p { font-size:14px; line-height:1.65; color:#dcb7b1; margin:8px 0 12px; }
  .sidebar-help a { display:flex; align-items:center; gap:10px; color:#f2d3a9; font-size:14px; line-height:1.6; }
  .sidebar-help a svg { width:16px; flex-shrink:0; }
  .portal-page .sidebar-profile { display:flex; align-items:center; gap:12px; margin:0 6px; }
  .sidebar-profile > div { min-width:0; }
  .sidebar-profile strong { display:block; font-size:14px; line-height:1.5; overflow-wrap:anywhere; }
  .sidebar-profile small { display:block; font-size:12px; line-height:1.6; color:#dab1ab; margin-top:3px; overflow-wrap:anywhere; }
  .portal-page .logout { display:flex; align-items:center; gap:12px; background:transparent; color:#ebcec8; border:0; padding:12px 6px; min-height:48px; width:100%; margin-top:12px; }
  .logout svg { width:19px; height:19px; }
  .logout:hover { color:white; }
  .logout-form [data-message] { font-size:13px; color:#ffe3cf; }
  .portal-page .dashboard-shell { margin-left:264px; min-width:0; }
  .portal-page .topbar { display:flex; justify-content:space-between; align-items:center; gap:20px; height:76px; padding:0 32px; background:white; border-bottom:1px solid var(--ui-border); }
  .breadcrumb, .topbar-actions { display:flex; align-items:center; gap:14px; font-size:14px; }
  .breadcrumb { min-width:0; flex:1; }
  .breadcrumb > span { color:var(--ui-muted); }
  .breadcrumb strong { font-weight:500; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .portal-account-link { display:flex; align-items:center; min-width:44px; min-height:44px; justify-content:center; }
  .avatar.small { width:38px; height:38px; font-size:13px; }
  .portal-page .menu-button { display:none; }
  .portal-backdrop { position:fixed; inset:0; border:0; background:#24171980; z-index:60; }
  .portal-footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 20px; font-size:12px; color:var(--ui-muted); line-height:1.6; padding:26px 0; }
  .ui-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:30px; }
  .ui-metric { display:grid; grid-template-columns:1fr auto; align-items:start; gap:15px 10px; border:1px solid var(--ui-border); background:white; border-radius:12px; padding:20px; transition:border-color .15s,box-shadow .15s; }
  .ui-metric:hover { border-color:#b8947e; box-shadow:0 4px 16px #56301908; }
  .ui-metric-icon,.stat-icon { display:grid; place-items:center; width:38px; height:38px; background:var(--ui-brand-soft); border-radius:10px; color:var(--ui-brand); }
  .ui-metric-icon svg,.stat-icon svg { width:20px; height:20px; }
  .ui-metric strong { font-size:32px; font-weight:600; line-height:1.2; color:var(--ui-text); font-variant-numeric:tabular-nums; }
  .ui-metric-label { font-size:15px; color:var(--ui-muted); line-height:1.5; }
  .ui-metric > svg { width:18px; height:18px; color:var(--ui-brand); align-self:center; justify-self:end; }
  .ui-form-feedback { font-size:15px; line-height:1.6; padding:12px 15px; background:var(--ui-danger-bg); color:var(--ui-danger); border:1px solid #ecd1c9; border-radius:9px; overflow-wrap:anywhere; }
  .ui-form-feedback:empty { display:none; }
  .ui-form-feedback[data-tone=success] { color:var(--ui-success); background:var(--ui-success-bg); border-color:#cfe3d3; }
  .ui-toast { position:fixed; z-index:120; bottom:max(24px,env(safe-area-inset-bottom,0px)); left:50%; transform:translateX(-50%); background:#362a25; color:white; padding:15px 20px; border-radius:12px; font-size:15px; line-height:1.6; box-shadow:0 10px 32px #0002; width:max-content; max-width:calc(100vw - 36px); }
  .ui-modal-open { overflow:hidden; }
  .ui-confirm { width:min(480px,calc(100% - 32px)); max-height:calc(100dvh - 32px); padding:30px; border:1px solid var(--ui-border); border-radius:18px; color:var(--ui-text); background:white; box-shadow:0 24px 100px #20140a30; }
  :is(.ui-confirm,.ui-image-dialog)::backdrop { background:#24171999; }
  .ui-confirm-mark { display:grid; place-items:center; width:48px; height:48px; border-radius:14px; background:#faf0df; color:#91601e; }
  .ui-confirm-mark svg { width:25px; height:25px; }
  .ui-confirm h2 { font-size:24px; line-height:1.3; margin:20px 0 12px; font-weight:600; }
  .ui-confirm p { font-size:16px; line-height:1.7; color:var(--ui-muted); margin:0 0 26px; white-space:pre-line; }
  .ui-dialog-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:12px; }
  .ui-button--danger-solid { background:var(--ui-danger); border-color:var(--ui-danger); color:white; }
  .ui-button--danger-solid:hover { background:#842519; }
  .ui-image-dialog { width:min(1000px,calc(100% - 32px)); max-height:calc(100dvh - 32px); padding:0; border:1px solid var(--ui-border); border-radius:16px; background:white; color:var(--ui-text); }
  .ui-image-dialog header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 18px; font-size:14px; color:var(--ui-muted); border-bottom:1px solid var(--ui-border); }
  .ui-image-dialog > img { display:block; width:100%; height:min(60vh,640px); object-fit:contain; background:#f1eeeb; }
  .ui-image-dialog > p { margin:0; padding:18px 22px; white-space:pre-line; overflow-wrap:anywhere; font-size:16px; line-height:1.6; }
  .ui-image-dialog footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; border-top:1px solid var(--ui-border); padding:16px 20px; }
  [data-image-viewer] { cursor:zoom-in; }
  @media(max-width:1024px) {
    .portal-page.ui-navigation-locked { position:fixed; width:100%; overflow:hidden; }
    .portal-page .dashboard-shell { margin-left:0; }
    .portal-page .sidebar { height:100vh; height:100dvh; top:0; bottom:auto; width:min(320px,calc(100vw - 48px)); padding:max(20px,env(safe-area-inset-top,0px)) 20px max(24px,env(safe-area-inset-bottom,0px)); z-index:70; transform:translateX(-100%); transition:transform .2s; }
    .portal-page.menu-open .sidebar { transform:translateX(0); box-shadow:20px 0 50px #0003; }
    .portal-page .portal-menu-close { display:inline-grid; margin-right:-6px; flex-shrink:0; }
    .portal-page .sidebar-logo img { width:155px; height:92px; margin:0 0 20px; }
    .portal-page .menu-button { display:inline-grid; }
    .portal-page .topbar { position:sticky; top:0; z-index:35; height:calc(76px + env(safe-area-inset-top,0px)); padding-top:env(safe-area-inset-top,0px); padding-inline:max(24px,env(safe-area-inset-left,0px)) max(24px,env(safe-area-inset-right,0px)); }
    .portal-page .dashboard-content { padding-inline:max(24px,env(safe-area-inset-left,0px)) max(24px,env(safe-area-inset-right,0px)); }
    .portal-footer { padding-bottom:max(24px,env(safe-area-inset-bottom,0px)); }
  }
  @media(max-width:600px) {
    .portal-page .topbar { height:calc(68px + env(safe-area-inset-top,0px)); padding-inline:18px; gap:12px; }
    .portal-page .dashboard-content { padding-inline:max(18px,env(safe-area-inset-left,0px)) max(18px,env(safe-area-inset-right,0px)); }
    .breadcrumb { gap:8px; }
    .breadcrumb > span { display:none; }
    .ui-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-bottom:24px; }
    .ui-metric { padding:16px 14px; gap:14px 6px; }
    .ui-metric strong { font-size:28px; }
    .ui-metric-label { font-size:14px; }
    .ui-metric > svg { width:15px; }
    .ui-confirm { padding:24px; }
    .ui-dialog-actions .ui-button { flex:1; }
    .ui-image-dialog > img { height:48vh; }
    .ui-image-dialog footer { padding:12px; gap:6px; }
    .ui-image-dialog footer .ui-button { font-size:14px; padding-inline:10px; }
  }
  @media(prefers-reduced-motion:reduce) { .portal-page .sidebar,.ui-metric { transition:none; } }

  .ui-save-actions { display:flex; justify-content:flex-end; align-items:center; gap:12px; margin-top:24px; }
  .ui-save-actions--top { margin-top:0; margin-bottom:22px; }
  @media(max-width:600px) { .ui-save-actions > .ui-button { width:100%; } }
}

/* Action presentation sits outside the layer to match module styles. Original
   labels remain in the DOM for existing handlers; aria-label names the control. */
body .ui-action--icon {
  position:relative;
  display:inline-flex!important; align-items:center!important; justify-content:center!important;
  box-sizing:border-box; width:44px!important; min-width:44px!important; max-width:44px!important;
  height:44px!important; min-height:44px!important; flex:0 0 44px!important;
  padding:0!important; gap:0!important; font-size:0!important; line-height:0!important;
  border:1px solid var(--ui-border,#d6bab0); border-radius:10px;
  background:#fff; color:var(--ui-brand,#850806); vertical-align:middle; text-decoration:none;
}
body .ui-action--icon > :not([data-ui-action-icon]) { display:none!important; }
body .ui-icon-button { min-width:44px!important; min-height:44px!important; }
body .admin-user-actions { display:flex; flex-wrap:wrap; gap:8px; }
body .ui-action--icon > .ui-action-icon { display:block!important; width:22px!important; height:22px!important; margin:0!important; flex:none!important; }
body .ui-action--icon:is(.primary,.ui-button--primary,.ui-button--danger-solid) { background:var(--ui-brand,#850806); color:#fff; border-color:var(--ui-brand,#850806); }
body .ui-action--icon.ui-button--danger { color:var(--ui-danger); border-color:#d9afa5; background:var(--ui-danger-bg); }
body .ui-action--icon.ui-button--danger-solid { background:var(--ui-danger); border-color:var(--ui-danger); }
body .ui-action--icon:is(.ui-button--inverse,.logout) { background:#ffffff10; color:#fff; border-color:#ffffff50; }
body .ui-action--icon:focus-visible { outline:3px solid #b46b2e; outline-offset:3px; }
body .ui-action--icon[hidden] { display:none!important; }
body .ui-action--icon:disabled { opacity:.5; cursor:not-allowed; }
body .ui-action--icon::marker { content:''; }
body .ui-action--icon::-webkit-details-marker { display:none; }
body .ui-action--icon[aria-busy="true"] > .ui-action-icon { visibility:hidden; }
body .ui-action--icon[aria-busy="true"]::after { position:absolute; margin:0; width:18px; height:18px; }
.auth-page .auth-submit.ui-action--icon,.admin-access-submit.ui-action--icon { margin-inline:auto; }
.steps .ui-action--icon[aria-selected="true"] { background:var(--ui-brand,#850806); color:white; border-color:var(--ui-brand,#850806); }

/* Filters reserve space for the action instead of dividing the row in half. */
@media(max-width:760px) {
 body .ui-toolbar:not(.history-filters) { display:grid; grid-template-columns:minmax(0,1fr) auto; }
 body .ui-toolbar:not(.history-filters) > :is(label,[data-warehouse-suggest]) { min-width:0; }
 body .ui-toolbar:not(.history-filters) > label:first-of-type { grid-column:1 / -1; }
 body .ui-toolbar:not(.history-filters) > label:not(:first-of-type) { grid-column:1; }
 body .ui-toolbar:not(.history-filters) > [data-warehouse-suggest] { grid-column:1 / -1; }
 body .ui-toolbar:not(.history-filters):has(> [data-warehouse-suggest]) > label:not([data-warehouse-suggest]) { grid-column:1; }
 body .ui-toolbar:not(.history-filters) > button[type=submit] { grid-column:2; justify-self:end; }
 body .ui-toolbar:not(.history-filters):not(:has(select)) > :is(label,[data-warehouse-suggest]) { grid-column:1; }
 body .ui-toolbar:not(.history-filters):has(> a.ui-button--text) { grid-template-columns:minmax(0,1fr) 44px 44px; }
 body .ui-toolbar:not(.history-filters):has(> a.ui-button--text) > :is(label,[data-warehouse-suggest]) { grid-column:1 / -1; }
 body .ui-toolbar:not(.history-filters) > a.ui-button--text { grid-column:3; justify-self:end; }
}

/* Consent and invisible spam trap shared by public account forms. */
.auth-trap{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important}.legal-consent{display:flex!important;align-items:flex-start;gap:10px;font-size:13px!important;font-weight:400!important;line-height:1.5;margin:18px 0;text-align:left}.legal-consent input{flex:0 0 auto;width:18px!important;height:18px;margin:2px 0 0!important;accent-color:#850806;padding:0!important}.legal-consent a{color:#850806;text-decoration:underline}.auth-page dialog{width:min(460px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;box-sizing:border-box}.auth-page dialog form{display:grid;gap:14px}.auth-page dialog .ui-label{display:grid;gap:8px}.auth-page dialog input{width:100%;min-width:0}.auth-page dialog::backdrop{background:#20130f66}.auth-page dialog [data-message]:empty{display:none}[data-bot-widget]:empty{display:none}