/* Alfrid unified interface.
 * Screen-only adapters for the existing components. No data, visibility,
 * accounting precision, form behavior, authorization or print-layout changes.
 * The application loads this after its legacy/page layout styles.
 * Values and font faces are owned by af-design-tokens.css, loaded immediately
 * before this adapter by layouts.partials.design_foundation.
 */

@media screen {
  body.af-ui,body.af-ui.af-app-shell {
    font-family:var(--af-font)!important;
    font-size:var(--af-text-base);
    line-height:var(--af-line-height);
    color:var(--af-text);
    color-scheme:light;
  }

  /* Shell and navigation: the working area owns its scrollbar. */
  body.af-ui .theme-header-bg,body.af-ui .theme-logo-bg {
    background:var(--af-primary-hover)!important;
    box-shadow:none;
  }
  body.af-ui .theme-header-bg>div{padding-block:8px}
  body.af-ui .theme-header-bg .theme-btn-bg{min-height:var(--af-shell-control-height);font-size:var(--af-text-table)}
  /* The existing toolbar may wrap; a fixed height must not clip its actions. */
  body.af-ui .af-shell-header{height:auto;min-height:60px}
  body.af-ui .af-shell-header__row{min-width:0;flex-wrap:wrap;row-gap:var(--af-space-2)}
  body.af-ui .af-shell-header__actions{min-width:0;flex:1 1 auto;gap:var(--af-space-2)}
  body.af-ui .af-shell-header .theme-btn-bg{border-radius:var(--af-radius-sm)}
  body.af-ui .af-shell-header .theme-btn-bg:focus-visible{outline-color:var(--af-surface)}
  body.af-ui .af-shell-sidebar{border-inline-end:1px solid var(--af-line)}
  body.af-ui .af-shell-search{background:var(--af-subtle);border-color:var(--af-line);border-radius:var(--af-radius-sm)}
  body.af-ui .af-shell-search:focus-within{outline:2px solid var(--af-focus-ring);outline-offset:2px}
  body.af-ui .af-shell-search :is(input,button){color:var(--af-text)}
  body.af-ui .side-bar{background:#fff!important;box-shadow:none!important}
  body.af-ui .side-bar-heading{font-size:15px;line-height:1.5;padding-inline:10px}
  body.af-ui #side-bar a{font-size:13px;line-height:1.6;margin-block:2px}
  body.af-ui #side-bar .theme-sidebar-active{background:var(--af-gold-100)!important;box-shadow:inset -3px 0 0 var(--af-accent)}
  [dir=ltr] body.af-ui #side-bar .theme-sidebar-active{box-shadow:inset 3px 0 0 var(--af-accent)}
  body.af-ui #sidebar-search{min-height:28px;font-size:13px}
  body.af-ui #scrollable-container{min-width:0;overscroll-behavior:contain;scroll-padding-top:16px}
  body.af-ui:not(.af-pos-shell) .content{padding:18px 20px 28px}
  body.af-ui:not(.af-pos-shell) .content-header{padding:18px 20px 0}
  body.af-ui :is(.content-header h1,.catalog-header h1,.sales-heading,.pd-heading h1,.pf-header h1,.af-profile-title-row h1,.af-directory-hero h1,.lr-head h1,.sc-page h1,#do-workspace h1) {
    font-family:var(--af-font);font-size:var(--af-title-page);font-weight:var(--af-weight-strong);line-height:1.5;letter-spacing:0;color:var(--af-text);
  }
  body.af-ui :is(.content h2,.content h3,.box-title,.panel-title,.modal-title){font-weight:700;letter-spacing:0}
  body.af-ui .content h2{font-size:var(--af-title-section)}
  body.af-ui .content h3{font-size:var(--af-title-card)}
  body.af-ui :is(.catalog-hint,.catalog-header p,.sales-hint,.pd-note,.pd-heading p,.pf-muted,.af-work-help,.help-block,.form-text){color:var(--af-muted);font-size:12px;line-height:1.7}
  body.af-ui :is(.content-header,.catalog-header,.sales-page-header,.pd-heading,.pf-header,.af-profile-hero){gap:12px}
  body.af-ui :is(.af-page-header,.catalog-header,.sales-page-header){display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px 20px}
  body.af-ui .af-page-header h1{margin:0;min-width:0}
  body.af-ui :is(.af-page-actions,.catalog-header-actions){display:flex;align-items:center;flex-wrap:wrap;gap:8px;min-width:0;max-width:100%}
  body.af-ui .af-page-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:normal;margin:0}

  /* Canonical page identity. New and migrated pages use these components;
     specialized workspaces keep their internal layouts and accounting behavior. */
  body.af-ui .af-page-hero{
    max-width:var(--af-content-max);margin:0 auto;padding:18px var(--af-page-gutter) 14px;
    display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;
    color:var(--af-text);background:transparent;border:0;box-shadow:none;
  }
  body.af-ui .af-page-hero__identity{min-width:0;max-width:860px}
  body.af-ui .af-page-hero__identity h1{margin:2px 0 0;font-size:var(--af-title-page);line-height:1.45;color:var(--af-text)!important}
  body.af-ui .af-page-hero__identity p{margin:4px 0 0;color:var(--af-muted);font-size:var(--af-text-table);line-height:1.75}
  body.af-ui .af-page-hero__meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px;color:var(--af-muted);font-size:var(--af-text-caption);line-height:1.6}
  body.af-ui .af-page-hero__eyebrow{display:inline-flex;align-items:center;gap:7px;color:var(--af-primary);font-size:var(--af-text-caption);font-weight:var(--af-weight-strong);line-height:1.6}
  body.af-ui .af-page-hero__eyebrow i{width:var(--af-icon-sm);text-align:center;color:var(--af-accent)}
  body.af-ui .af-page-hero__actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;min-width:0}
  body.af-ui .af-page-hero__actions :is(.btn,.af-btn){margin:0;min-height:var(--af-control-height)}
  body.af-ui .content>.af-page-hero{max-width:none;margin:0;padding:0 0 14px}
  body.af-ui .cfr>.af-page-hero{max-width:none;margin:0 0 18px;padding:0 0 14px;border-bottom:1px solid var(--af-line)}
  body.af-ui .aw>.af-page-hero{max-width:none;margin:0 0 16px;padding:0 0 14px;border-bottom:1px solid var(--af-line)}

  body.af-ui .af-filter-toolbar{
    display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin:0 0 16px;padding:12px;
    background:var(--af-surface);border:1px solid var(--af-line);border-radius:var(--af-radius-md);box-shadow:var(--af-shadow-sm);
  }
  body.af-ui .af-filter-toolbar::before,body.af-ui .af-filter-toolbar::after{display:none}
  body.af-ui .af-filter-toolbar>[class*="col-"]{float:none;width:auto;min-width:min(100%,220px);padding:0;flex:1 1 220px}
  body.af-ui .af-filter-toolbar>.af-filter-toolbar__actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:1 1 280px;min-width:0}
  body.af-ui .af-filter-toolbar :is(.input-group,.select2-container){width:100%!important}
  body.af-ui .af-input-icon{min-width:40px;color:var(--af-primary);background:var(--af-gold-100);border-color:var(--af-control-border)!important}

  body.af-ui .af-section-tabs{
    max-width:calc(var(--af-content-max) - (var(--af-page-gutter) * 2));margin:0 auto 14px;padding:5px;
    display:flex;align-items:center;gap:4px;overflow:visible;
    background:var(--af-surface);border:1px solid var(--af-line);border-radius:var(--af-radius-md);
    box-shadow:var(--af-shadow-sm);
  }
  body.af-ui .af-section-tabs__track{display:flex;align-items:center;gap:4px;min-width:0;flex:1 1 auto;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin}
  body.af-ui .af-section-tabs__actions{display:flex;align-items:center;gap:4px;flex:0 0 auto}
  body.af-ui .af-section-tabs__track>a,body.af-ui .af-section-tabs__track>button,body.af-ui .af-section-tabs__actions>details>summary{
    display:inline-flex;align-items:center;justify-content:center;gap:7px;flex:0 0 auto;min-height:38px;
    padding:7px 12px;border:1px solid transparent;border-radius:var(--af-radius-sm);background:transparent;
    color:var(--af-muted);font-size:var(--af-text-table);font-weight:var(--af-weight-strong);text-decoration:none;white-space:nowrap;
    transition:background var(--af-motion-fast) var(--af-ease),border-color var(--af-motion-fast) var(--af-ease),color var(--af-motion-fast) var(--af-ease);
  }
  body.af-ui .af-section-tabs__track>a:hover,body.af-ui .af-section-tabs__track>button:hover,body.af-ui .af-section-tabs__actions>details>summary:hover{background:var(--af-subtle);color:var(--af-text)}
  body.af-ui .af-section-tabs__track>[aria-current=page]{background:var(--af-gold-100);border-color:var(--af-gold-300);color:var(--af-primary)}
  body.af-ui .af-section-tabs__track>[aria-pressed=true]{background:var(--af-gold-100);border-color:var(--af-gold-300);color:var(--af-primary)}
  body.af-ui .af-section-tabs__actions>details{position:relative;flex:0 0 auto}
  body.af-ui .af-section-tabs__actions>details>summary{list-style:none;cursor:pointer}
  body.af-ui .af-section-tabs__actions>details>summary::-webkit-details-marker{display:none}
  body.af-ui .af-section-tabs__actions>details[open]>summary{background:var(--af-subtle);color:var(--af-primary)}
  body.af-ui .af-section-tabs__actions>details>div{position:absolute;z-index:var(--af-z-dropdown);inset-inline-end:0;top:calc(100% + 6px);display:grid;gap:4px;width:min(320px,calc(100vw - 24px));padding:5px;background:var(--af-surface);border:1px solid var(--af-line);border-radius:var(--af-radius-sm);box-shadow:var(--af-shadow-md)}
  body.af-ui .af-section-tabs__actions>details>div>a{display:block;padding:9px 10px;border-radius:var(--af-radius-sm);color:var(--af-text);text-decoration:none;white-space:normal}
  body.af-ui .af-section-tabs__actions>details>div>a:hover{background:var(--af-subtle)}

  /* Keep every section shortcut, but make this a secondary navigation row. */
  body.af-ui .af-section-actions {
    margin:12px 20px 0;padding:8px 12px;gap:12px;
    border-radius:var(--af-radius-md);background:var(--af-surface);box-shadow:none;
  }
  body.af-ui .af-section-actions__identity{min-width:150px;gap:8px}
  body.af-ui .af-section-actions__identity strong{font-size:13px}
  body.af-ui .af-section-actions__identity small{font-size:11px;color:var(--af-muted)}
  body.af-ui .af-section-actions__icon{width:30px;height:30px;border-radius:7px;background:var(--af-gold-100);color:var(--af-primary);box-shadow:none}
  body.af-ui .af-section-actions__buttons{gap:6px;padding-block:2px;scrollbar-color:#c9cfd6 transparent}
  body.af-ui .af-section-action{min-height:36px;padding:8px 10px;font-size:12px;font-weight:700;border-color:transparent;background:transparent;color:var(--af-muted);border-radius:6px}
  body.af-ui .af-section-action:hover,body.af-ui .af-section-action:focus{transform:none;box-shadow:none;background:var(--af-subtle)}
  body.af-ui .af-section-action.is-active{color:var(--af-primary);background:var(--af-gold-100);border-color:var(--af-line);box-shadow:none}
  body.af-ui .af-section-actions .af-section-action--primary:not(.is-active){background:transparent;border-color:var(--af-line);color:var(--af-primary)}

  /* A single inset per shared widget replaces nested 8 + 12 + 20px padding. */
  body.af-ui .af-widget{border-radius:var(--af-radius-lg)!important;box-shadow:var(--af-shadow-sm)!important;min-width:0;margin-bottom:16px}
  body.af-ui .af-widget>.af-widget-shell{padding:0!important}
  body.af-ui .af-widget .af-widget-body{padding:16px!important}
  body.af-ui .af-widget-body .row{margin-inline:-8px}
  body.af-ui .af-widget-body .row>[class*="col-"]{padding-inline:8px}
  body.af-ui :is(.box-header,.panel-heading,.modal-header){background:var(--af-surface);padding:14px 16px}
  body.af-ui .af-widget-header{gap:var(--af-space-3);align-items:center;min-width:0;border-bottom:1px solid var(--af-line)}
  body.af-ui .af-widget-title{flex-basis:160px;font-size:var(--af-title-card);margin:0;line-height:1.65}
  body.af-ui .af-widget-header>small{flex-basis:100%;color:var(--af-muted);line-height:1.7}
  body.af-ui :is(.box-body,.panel-body){padding:16px}
  body.af-ui :is(.box-footer,.panel-footer,.modal-footer){padding:12px 16px;background:var(--af-subtle)}
  body.af-ui .af-filter-panel{box-shadow:none!important;border-radius:var(--af-radius-md)!important}
  body.af-ui .pf-btn{min-height:44px;padding:10px 14px;color:var(--af-text)}
  body.af-ui .af-filter-panel .pf-label{font-family:var(--af-font);font-size:13px;font-weight:700;color:var(--af-text)}
  body.af-ui .af-filter-panel .pf-icon{width:28px;height:28px;border-radius:6px}
  [dir=rtl] body.af-ui .pf-btn::before{left:auto;right:0;transform-origin:right}
  body.af-ui :is(.af-form-guide,.af-saved-filters,.af-work-start){background:#fff;border-color:var(--af-line);padding:12px 14px;border-radius:var(--af-radius-md)}
  body.af-ui .af-form-guide{gap:8px}

  /* Geometry only. Never convert input values, hide controls or restyle icons as text. */
  body.af-ui :is(.btn,.tw-dw-btn,.af-btn,.af-work-button,.af-section-action,.sc-button,.do-btn){font-family:var(--af-font);letter-spacing:0}
  body.af-ui .af-btn{min-height:var(--af-control-height);font-size:var(--af-text-table);font-weight:var(--af-weight-strong);padding:var(--af-space-2) var(--af-space-3);border-radius:var(--af-radius-sm);gap:var(--af-space-2);line-height:1.45}
  body.af-ui .af-btn:hover{transform:none;box-shadow:none}
  body.af-ui .af-btn-secondary{background:var(--af-surface);color:var(--af-ink-700);border-color:var(--af-control-border)}
  body.af-ui .af-directory-title-icon{width:40px;height:40px;flex-basis:40px;border-radius:10px;background:var(--af-gold-100);color:var(--af-primary);box-shadow:none}
  body.af-ui :is(.btn,.tw-dw-btn,button[type=submit]){min-height:var(--af-control-height);font-size:var(--af-text-table);font-weight:var(--af-weight-strong);padding:var(--af-space-2) var(--af-space-3);gap:var(--af-space-2);line-height:1.45}
  body.af-ui :is(.btn,.tw-dw-btn,button[type=submit]):hover{transform:none;box-shadow:none}
  body.af-ui :is(.btn-sm,.btn-xs,.tw-dw-btn-sm,.tw-dw-btn-xs,.dataTables_wrapper .dt-button){min-height:var(--af-control-sm);padding:6px 10px;font-size:var(--af-text-caption)}
  body.af-ui :is(.btn-primary,.tw-dw-btn.tw-bg-gradient-to-r){background:var(--af-primary)!important;border-color:var(--af-primary)!important;color:#fff!important;box-shadow:none}
  body.af-ui :is(.btn-primary,.tw-dw-btn.tw-bg-gradient-to-r):hover{background:var(--af-primary-hover)!important}
  body.af-ui :is(.btn-default,.btn-secondary,.tw-dw-btn-outline){color:var(--af-ink-700)!important;border-color:var(--af-control-border)!important}
  body.af-ui .btn-success{background:var(--af-success)!important;border-color:var(--af-success)!important;color:var(--af-surface)!important}
  body.af-ui .btn-danger{background:var(--af-danger)!important;border-color:var(--af-danger)!important;color:var(--af-surface)!important}
  body.af-ui .btn-info{background:var(--af-info)!important;border-color:var(--af-info)!important;color:#fff!important}
  body.af-ui :is(.btn-warning,.tw-dw-btn-warning){background:var(--af-warning-soft)!important;color:var(--af-warning)!important;border-color:var(--af-warning-border)!important}
  body.af-ui .btn:focus-visible,body.af-ui a:focus-visible,body.af-ui summary:focus-visible{outline:2px solid var(--af-focus-ring);outline-offset:3px}
  body.af-ui label,body.af-ui .control-label{font-size:13px;font-weight:700;line-height:1.6;margin-bottom:6px;color:var(--af-ink-700)}
  body.af-ui :is(.form-control,.select2-selection){font-family:var(--af-font);font-size:13px}
  body.af-ui :is(.form-control,.input-group-addon,.select2-container .select2-selection){border-color:var(--af-control-border)!important}
  body.af-ui .form-control:focus{border-color:var(--af-focus-ring)!important;box-shadow:0 0 0 2px var(--af-gold-100)!important}
  body.af-ui :is(.form-control[aria-invalid=true],.has-error .form-control,.has-error .select2-selection){border-color:var(--af-danger)!important}
  body.af-ui .form-control:not(textarea){height:40px;min-height:40px;padding-block:8px}
  body.af-ui .form-control[readonly]{background:#f6f8fa;color:var(--af-ink-700)}
  body.af-ui .form-control:disabled{background:#f0f2f5;color:var(--af-muted)}
  body.af-ui .select2-container .select2-selection--single{height:40px;min-height:40px}
  body.af-ui .select2-container .select2-selection--single .select2-selection__rendered{line-height:38px;font-size:13px;padding-inline:10px 30px}
  body.af-ui .select2-container .select2-selection--single .select2-selection__arrow{height:38px;min-height:38px}
  body.af-ui .select2-dropdown{border-color:var(--af-line);box-shadow:var(--af-shadow-md);font-size:13px}
  body.af-ui .select2-results__option{padding:8px 10px;line-height:1.65}
  body.af-ui .select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--af-primary);color:#fff}
  body.af-ui .form-group{margin-bottom:16px;min-width:0}
  body.af-ui :is(.af-form-grid,.af-payment-grid,.af-payment-details-grid){gap:16px}
  body.af-ui :is(.af-form-grid,.af-payment-grid,.af-payment-details-grid) .form-group{margin-bottom:0}
  body.af-ui :is(.af-form-grid,.af-payment-grid) .multi-input .form-control{display:inline-block!important;float:none!important;vertical-align:top}
  body.af-ui :is(.af-form-grid,.af-payment-grid) .multi-input .width-40{width:calc(40% - 4px)!important}
  body.af-ui :is(.af-form-grid,.af-payment-grid) .multi-input .width-60{width:calc(60% - 4px)!important}
  body.af-ui .af-form-file .file-caption-main{gap:0}
  body.af-ui .input-group-btn>.btn{height:40px;min-height:40px}
  body.af-ui :is(.input-group,.select2-container){max-width:100%}
  body.af-ui .form-group>.select2-container{width:100%!important;min-width:0}
  body.af-ui .form-group .input-group:has(>.select2-container){display:flex!important;align-items:stretch;width:100%;min-width:0}
  body.af-ui .form-group .input-group>.select2-container{display:block!important;flex:1 1 0!important;width:0!important;min-width:0}
  body.af-ui .form-group .input-group:has(>.select2-container)>:is(.input-group-addon,.input-group-btn){display:flex;align-items:center;justify-content:center;flex:0 0 auto;width:auto!important;min-width:40px}
  body.af-ui .has-error .help-block,body.af-ui label.error{font-size:var(--af-text-caption);line-height:1.65;color:var(--af-danger)}

  /* Tables remain real tables; existing mobile card/core-detail modes stay intact. */
  body.af-ui :is(.table,.pd-table,.sc-table,.do-table){font-size:var(--af-text-table);font-variant-numeric:tabular-nums}
  body.af-ui .table>thead>tr>th{background:#f1f4f7;color:#3c4854;border-color:var(--af-line);font-weight:700;font-size:12px;line-height:1.65;padding:10px 12px}
  body.af-ui .table>tbody>tr>td{padding:10px 12px;border-color:#e9edf1;line-height:1.65}
  body.af-ui .table-striped>tbody>tr:nth-of-type(odd){background:#fafbfc}
  body.af-ui .table>tbody>tr:hover{background:#f5f7fa}
  body.af-ui .table>tfoot>tr>td{font-weight:700;background:#edf1f5;border-color:var(--af-line);padding:12px}
  body.af-ui .table-responsive{border-radius:8px;scrollbar-color:#b8c1cc #f5f6f8}
  body.af-ui .dataTables_wrapper{min-width:0;width:100%;max-width:100%}
  body.af-ui .tw-overflow-x-auto>.tw-inline-block:has(>.dataTables_wrapper){display:block!important;width:100%;min-width:0;max-width:100%}
  body.af-ui .dataTables_wrapper .dataTables_length label{display:flex;align-items:center;gap:8px;margin:0;font-weight:400;white-space:normal}
  body.af-ui .dataTables_wrapper .dataTables_length select{min-width:76px;width:auto!important;height:36px;min-height:36px;flex-shrink:0;margin:0}
  body.af-ui .dataTables_wrapper .dataTables_filter input{min-height:36px;font-size:13px}
  body.af-ui .dataTables_wrapper .dt-buttons{display:flex!important;flex-wrap:wrap!important;gap:6px;align-items:center;max-width:100%;min-width:0}
  body.af-ui .dataTables_wrapper .dt-button{font-size:12px;border-color:#d2d9e1!important;color:var(--af-ink-700)!important}
  body.af-ui .dataTables_wrapper :is(.dataTables_info,.dataTables_paginate){padding-top:12px;font-size:12px}
  body.af-ui .pagination{display:flex;flex-wrap:wrap;gap:3px}
  body.af-ui .pagination>li>a,body.af-ui .pagination>li>span{border-radius:6px!important;min-height:34px;padding:7px 11px;margin:0}
  body.af-ui .af-daily-toolbar{padding:8px 0;gap:10px;line-height:1.7}
  body.af-ui .af-daily-detail{width:auto;margin-top:6px;padding:5px 8px;min-height:30px;font-size:11px;border-color:var(--af-line);color:var(--af-muted)}
  body.af-ui .af-daily-compact .af-daily-table>tbody>tr:nth-child(even){background:#fafbfc}
  /* DataTables inserts a sizing THEAD inside scrollBody. Its visible counterpart
     is scrollHead. The old block/grid adaptation exposed a duplicate band over
     the first record. Hide the sizing copy only, preserving DOM/export columns. */
  body.af-ui .af-daily-compact .dataTables_scrollBody>table>thead,
  body.af-ui .af-daily-compact .dataTables_scrollBody>table>tfoot{display:none!important}
  body.af-ui td.dataTables_empty,body.af-ui :is(.catalog-empty,.pd-empty,.sc-empty,.af-directory-empty){padding:var(--af-space-6) var(--af-space-4)!important;color:var(--af-muted);text-align:center;line-height:1.8}
  body.af-ui .dataTables_processing{border:1px solid var(--af-line)!important;background:#fff!important;color:var(--af-primary)!important;border-radius:10px;box-shadow:var(--af-shadow-md)!important;padding:14px;max-width:calc(100% - 24px);font-size:13px}

  /* Component adapters reuse section-specific layouts rather than rebuilding them. */
  body.af-ui .af-contact-directory{--af-brown:var(--af-primary);--af-brown-dark:var(--af-primary-hover);--af-gold:var(--af-accent);--af-cream:var(--af-subtle);--af-line:#dfe4ea;--af-text:#25313c;--af-muted:#626e79;max-width:none;padding:18px 20px 28px}
  body.af-ui .af-contact-profile{background:var(--af-canvas);padding:18px 20px 28px}
  body.af-ui :is(.catalog-workspace,.pd-workspace,.pf-workspace,.lr-workspace){color:var(--af-text)}
  body.af-ui :is(.catalog-browse,.catalog-list,.pd-panel,.pd-product,.pf-card,.af-directory-hero,.af-directory-panel,.af-profile-hero,.af-profile-panels,.sc-card,.sc-header,.lr-head){border-color:var(--af-line);border-radius:12px;background:#fff;box-shadow:var(--af-shadow-sm)}
  body.af-ui :is(.catalog-browse,.catalog-list,.pd-panel,.pd-product,.af-directory-hero,.af-profile-hero,.lr-head){padding:16px}
  body.af-ui :is(.catalog-summary button,.af-directory-stats>button){background:#fff;border-color:var(--af-line);color:var(--af-muted);border-radius:10px}
  body.af-ui .catalog-summary button strong{color:var(--af-text);font-size:24px}
  body.af-ui .catalog-summary button[aria-pressed=true]{background:var(--af-gold-100);border-color:var(--af-primary-border);color:var(--af-primary)}
  body.af-ui .catalog-summary button[aria-pressed=true] strong{color:var(--af-primary)}
  body.af-ui :is(.catalog-search,.sales-search-box){border-color:#d2d9e1;border-radius:8px;min-height:40px}
  body.af-ui :is(.catalog-list-heading h2,.pd-list-heading h2){font-size:17px}
  body.af-ui .catalog-table-toolbar{margin:12px 0}
  body.af-ui .catalog-workspace .table>thead>tr>th{background:#f1f4f7}
  body.af-ui .catalog-workspace .table>tbody>tr>td{font-size:13px}
  body.af-ui .sc-page{--sc-ink:var(--af-text);--sc-border:var(--af-line);--sc-gold:var(--af-accent);--sc-soft:var(--af-subtle)}
  body.af-ui .frb-shell{--ink:var(--af-text);--muted:var(--af-muted);--line:var(--af-line);--paper:#fff;--soft:var(--af-subtle);--accent:var(--af-primary);--accent2:var(--af-accent);--green:var(--af-success);--red:var(--af-danger);background:var(--af-canvas)}
  body.af-ui #do-workspace{--do-ink:var(--af-text);--do-muted:var(--af-muted);--do-line:var(--af-line);--do-teal:var(--af-primary);--do-gold:var(--af-accent);--do-cream:var(--af-subtle)}
  body.af-ui #do-workspace .do-hero{background:#fff;color:var(--af-text);border-color:var(--af-line);box-shadow:var(--af-shadow-sm)}
  body.af-ui #do-workspace .do-heading :is(.do-eyebrow,p){color:var(--af-muted);opacity:1}
  body.af-ui #do-workspace .do-brand-icon{color:var(--af-primary);background:var(--af-gold-100);border-color:var(--af-line)}
  body.af-ui #do-workspace .do-hero .do-btn-ghost{color:var(--af-primary);background:var(--af-surface);border-color:var(--af-line)}
  body.af-ui #do-workspace .do-hero .do-btn-ghost:hover{color:var(--af-primary-hover);background:var(--af-subtle);border-color:var(--af-accent)}
  body.af-ui #do-workspace .do-view-tabs{background:#edf0f4;border-color:var(--af-line);border-radius:10px}
  body.af-ui #do-workspace :is(.do-panel,.do-metric){border-radius:12px}
  body.af-ui :is(.sales-drawer,.af-directory-drawer,.af-profile-drawer,.do-drawer){font-family:var(--af-font);color:var(--af-text)}
  body.af-ui .sales-drawer{background:#fff;box-shadow:var(--af-shadow-lg)}
  body.af-ui .sales-drawer-header{background:var(--af-subtle);border-color:var(--af-line);padding:12px 16px}
  body.af-ui .sales-drawer-header h2{font-size:20px;font-weight:700;color:var(--af-text)}
  body.af-ui .sales-invoice-summary strong{color:var(--af-text)}
  body.af-ui :is(.sales-invoice-summary span,.sales-invoice-summary small,.sales-invoice-money span){color:var(--af-muted)}
  body.af-ui .sales-invoice-money>div{background:var(--af-subtle);border-color:var(--af-line);padding:12px}
  body.af-ui .sales-invoice-money strong{color:var(--af-text);font-variant-numeric:tabular-nums}
  body.af-ui .sales-detail-tabs{border-color:var(--af-line)}
  body.af-ui .sales-detail-tabs button{border-color:var(--af-line);color:var(--af-ink-700);min-height:40px;font-family:var(--af-font)}
  body.af-ui .sales-detail-tabs button[aria-selected=true]{background:var(--af-primary);border-color:var(--af-primary);color:#fff}
  body.af-ui .sales-items-table{border-color:var(--af-line)}
  body.af-ui .sales-items-table :is(caption,th){background:#f1f4f7;color:var(--af-ink-700);border-color:var(--af-line)}
  body.af-ui .currency-panel .metric-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:8px}
  body.af-ui .currency-panel .metric{padding:10px 12px;background:var(--af-subtle);border-color:#e5eaf0;min-width:0}
  body.af-ui .currency-panel .metric strong{font-size:18px;color:var(--af-text);font-weight:700;line-height:1.65;white-space:normal;overflow-wrap:anywhere}
  body.af-ui .finance-hero,body.af-ui :is(.content,.content-header) :is(.fi-hero,.gl-hero){background:#fff;border:1px solid var(--af-line);border-inline-start:4px solid var(--af-accent);border-radius:12px;color:var(--af-text);padding:18px 20px;box-shadow:var(--af-shadow-sm)}
  body.af-ui .content-header .finance-hero h1,body.af-ui :is(.content,.content-header) :is(.fi-hero,.gl-hero) h1{font-size:24px;font-weight:700;color:var(--af-text)!important;margin:0 0 8px}
  body.af-ui :is(.finance-hero,.content .fi-hero,.content .gl-hero,.content-header .gl-hero) p{color:var(--af-muted);font-size:13px;line-height:1.8;opacity:1}
  /* Secondary workspaces use the same page-header component grammar. */
  body.af-ui :is(.acc-hero,.ahc-hero,.fia-hero,.fai-hero,.fir-hero,.fis-hero,.dt-hero,.te-hero,.update-hero,.shift-summary__hero){background:var(--af-surface);color:var(--af-text);border:1px solid var(--af-line);border-radius:var(--af-radius-md);box-shadow:var(--af-shadow-sm)}
  body.af-ui :is(.acc-hero,.ahc-hero,.fia-hero,.fai-hero,.fir-hero,.fis-hero,.dt-hero,.te-hero,.update-hero,.shift-summary__hero) :is(h1,h2,h3){color:var(--af-text)!important;font-weight:700}
  body.af-ui :is(.acc-hero,.ahc-hero,.fia-hero,.fai-hero,.fir-hero,.fis-hero,.dt-hero,.te-hero,.update-hero,.shift-summary__hero) :is(p,small){color:var(--af-muted);opacity:1}
  body.af-ui :is(.fia-btn--hero,.fai-btn--hero,.fir-btn--hero,.fis-btn--hero,.acc-hero-actions a){color:var(--af-primary)!important;background:var(--af-surface);border-color:var(--af-control-border)}
  body.af-ui :is(.acc-table,.fir-table,.fis-table,.ahc-table,.shift-table) th{background:var(--af-subtle);color:var(--af-text);border-color:var(--af-line)}
  body.af-ui :is(.acc-btn,.fia-btn,.fai-btn,.fir-btn,.fis-btn,.ahc-btn){min-height:var(--af-control-height);border-radius:var(--af-radius-sm);font-family:var(--af-font);font-size:var(--af-text-table)}
  /* Neutral legacy metrics; the warning/error number and icon keep their meaning. */
  body.af-ui .control-tabs #overview .small-box{position:relative;background:var(--af-surface)!important;color:var(--af-text)!important;border:1px solid var(--af-line);border-radius:var(--af-radius-md);box-shadow:var(--af-shadow-sm);min-height:106px}
  body.af-ui .control-tabs #overview .small-box>.inner{padding:14px 16px;padding-inline-end:64px}
  body.af-ui .control-tabs #overview .small-box h3{font-size:24px;margin:0 0 4px;line-height:1.65;font-weight:700;white-space:normal;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
  body.af-ui .control-tabs #overview .small-box p{margin:0;font-size:12px;color:var(--af-muted);line-height:1.7}
  body.af-ui .control-tabs #overview .small-box>.icon{top:14px;inset-inline-start:auto;inset-inline-end:14px;display:grid;place-items:center;width:36px;height:36px;border-radius:8px;font-size:20px;color:var(--af-info);background:var(--af-info-soft)}
  body.af-ui .control-tabs #overview .small-box>.icon>i{font-size:20px;position:static}
  body.af-ui .control-tabs #overview .small-box.bg-yellow{border-inline-start:3px solid var(--af-warning)}
  body.af-ui .control-tabs #overview .small-box.bg-yellow :is(h3,.icon){color:var(--af-warning)}
  body.af-ui .control-tabs #overview .small-box.bg-yellow>.icon{background:var(--af-warning-soft)}
  body.af-ui .control-tabs #overview .small-box.bg-red{border-inline-start:3px solid var(--af-danger)}
  body.af-ui .control-tabs #overview .small-box.bg-red :is(h3,.icon){color:var(--af-danger)}
  body.af-ui .control-tabs #overview .small-box.bg-red>.icon{background:var(--af-danger-soft)}
  body.af-ui .control-tabs #overview .small-box.bg-green>.icon{color:var(--af-success);background:var(--af-success-soft)}
  body.af-ui .af-summary-scope{padding:12px 14px;margin-top:12px;background:var(--af-subtle);border-color:var(--af-line)}
  body.af-ui .af-scope-note{background:#edf2f7;color:#526171;padding:10px 12px}
  body.af-ui .dashboard-hero.theme-header-bg{background:var(--af-canvas)!important;color:var(--af-text)}
  body.af-ui.af-app-shell .dashboard-hero #dashboard-title{color:var(--af-text)!important;font-size:24px;font-weight:700;line-height:1.5}
  body.af-ui .dashboard-filters{background:#fff;border-color:var(--af-line);border-radius:10px;box-shadow:none}
  body.af-ui .dashboard-filters :is(label,.tw-text-white){color:var(--af-ink-700)!important}
  body.af-ui .dashboard-metric-card{background:#fff;border-color:var(--af-line);border-radius:12px;box-shadow:var(--af-shadow-sm)!important}
  body.af-ui .dashboard-metric-card:hover{transform:none!important;box-shadow:var(--af-shadow-sm)!important}
  body.af-ui .dashboard-metric-value{font-size:24px;font-variant-numeric:tabular-nums;line-height:1.65;color:var(--af-text)}
  body.af-ui :is(.label,.badge){font-size:11px;line-height:1.6;font-weight:700;padding:3px 8px}
  body.af-ui :is(.label-success,.badge-success,.label.bg-light-green,.label.bg-green){color:var(--af-success)!important;background:var(--af-success-soft)!important}
  body.af-ui :is(.label-warning,.badge-warning,.label.bg-yellow){color:var(--af-warning)!important;background:var(--af-warning-soft)!important}
  body.af-ui :is(.label-danger,.badge-danger,.label.bg-red){color:var(--af-danger)!important;background:var(--af-danger-soft)!important}
  body.af-ui :is(.label-info,.badge-info,.label.bg-aqua){color:var(--af-info)!important;background:var(--af-info-soft)!important}
  body.af-ui .alert{padding:var(--af-space-3) var(--af-space-4);border-radius:var(--af-radius-md);box-shadow:none;line-height:1.8;font-size:var(--af-text-table);overflow-wrap:anywhere}
  body.af-ui .alert-success{color:var(--af-success)!important;background:var(--af-success-soft)!important;border-color:var(--af-success-border)!important}
  body.af-ui .alert-warning{color:var(--af-warning)!important;background:var(--af-warning-soft)!important;border-color:var(--af-warning-border)!important}
  body.af-ui .alert-danger{color:var(--af-danger)!important;background:var(--af-danger-soft)!important;border-color:var(--af-danger-border)!important}
  body.af-ui .alert-info{color:var(--af-info)!important;background:var(--af-info-soft)!important;border-color:var(--af-info-border)!important}
  body.af-ui .alert a{color:inherit;text-decoration:underline;text-underline-offset:3px}
  body.af-ui :is(.modal-content,.dropdown-menu){border-color:var(--af-line);border-radius:12px!important}
  body.af-ui .modal-title{font-size:18px;line-height:1.6}
  body.af-ui .modal-body{padding:16px}
  body.af-ui .modal-footer{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px}
  body.af-ui .modal-footer::before,body.af-ui .modal-footer::after{display:none}
  body.af-ui .modal-footer .btn+.btn{margin-inline-start:0}
  body.af-ui .dropdown-menu>li>a{font-size:13px;line-height:1.7;padding:9px 14px}
  body.af-ui :is(bdi,.display_currency,.display_currency_positive,.document-base-total-value,.current_stock){font-variant-numeric:tabular-nums}
  body.af-ui bdi{unicode-bidi:isolate}

  /* POS keeps its own tested two-pane layout, cart, numeric fields and action bar. */
  body.af-pos-shell .af-pos-command-bar{background:#fff;box-shadow:var(--af-shadow-sm);border-radius:10px}
  body.af-pos-shell :is(.af-pos-cart-card,.af-pos-catalog){border-color:var(--af-line);box-shadow:var(--af-shadow-sm)}
  body.af-pos-shell .af-pos-product-card{border-color:var(--af-line);box-shadow:var(--af-shadow-sm);border-radius:9px}
  body.af-pos-shell .af-pos-product-card::before{background:var(--af-accent)}
  body.af-pos-shell .af-pos-product-card__name{font-size:14px;font-weight:700;color:var(--af-text)}
  body.af-pos-shell .af-pos-product-card__price{font-variant-numeric:tabular-nums;color:var(--af-primary)}
  body.af-pos-shell :is(.af-pos-cart__header,.af-pos-catalog__header){background:#fff}
  body.af-pos-shell #pos_table thead th{background:#f1f4f7;color:var(--af-muted);border-color:var(--af-line)}
  body.af-pos-shell #pos_table :is(input,.form-control){font-family:var(--af-font);font-variant-numeric:tabular-nums}
  body.af-pos-shell .pos-form-actions{box-shadow:0 -2px 8px #16233108}
  body.af-pos-shell #modal_payment .af-pos-payment-summary{background:#fff;border-color:var(--af-line);box-shadow:none}
  body.af-pos-shell .af-pos-workspace-form #modal_payment .af-pos-payment-summary__grid{background:#fff!important}
  body.af-pos-shell #modal_payment .af-pos-payment-summary__grid::before,
  body.af-pos-shell #modal_payment .af-pos-payment-summary__grid::after{display:none!important;content:none}
  body.af-pos-shell #modal_payment .af-pos-payment-stat{background:var(--af-subtle)!important;border-color:var(--af-line)!important}
  body.af-pos-shell #modal_payment .af-pos-payment-stat .af-pos-payment-stat__icon{background:#e9edf2;color:var(--af-muted)}
  body.af-pos-shell #modal_payment .af-pos-payment-stat--payable{background:var(--af-gold-100)!important;border-color:var(--af-primary-border)!important}
  body.af-pos-shell #modal_payment .af-pos-payment-stat--paid{background:var(--af-success-soft)!important;border-color:#b9ddc8!important}
  body.af-pos-shell #modal_payment .payment_row>.box{border-color:var(--af-line)}
  body.af-pos-shell #modal_payment .payment_row>.box .box-body{background:#fff}

  body.af-auth-shell{background:linear-gradient(135deg,#f5f6f8,var(--af-primary-soft))!important}
  body.af-auth-shell :is(.right-col form,.login-box-body,.register-box-body){background:#fff;border-color:var(--af-line);box-shadow:var(--af-shadow-md)}
  /* Auth navigation stays in normal flow, so language and registration links
     cannot cover a form. Preserve every existing conditional route and action. */
  body.af-auth-shell .af-auth-navigation{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;direction:ltr;gap:var(--af-space-4);margin:0;padding:var(--af-space-3) 0}
  body.af-auth-shell .af-auth-navigation::before,body.af-auth-shell .af-auth-navigation::after{display:none}
  body.af-auth-shell :is(.af-auth-navigation__brand,.af-auth-navigation__actions){position:static;min-width:0;max-width:100%;flex-wrap:wrap;gap:var(--af-space-3);text-align:start!important}
  body.af-auth-shell .af-auth-navigation__actions{margin-left:auto}
  [dir=rtl] body.af-auth-shell .af-auth-navigation>div{direction:rtl}
  body.af-auth-shell .af-auth-navigation :is(a,summary){color:var(--af-primary)!important;font-size:var(--af-text-table);line-height:1.7}
  body.af-auth-shell .af-auth-navigation summary{min-height:var(--af-control-height);display:flex;align-items:center;padding:var(--af-space-2) var(--af-space-3);border:1px solid var(--af-control-border);border-radius:var(--af-radius-sm);background:var(--af-surface);cursor:pointer}
  body.af-auth-shell .af-auth-navigation .tw-dw-dropdown{margin:0!important}
  body.af-auth-shell .af-auth-navigation__brand>a>div{width:48px;height:48px;margin:0}
  body.af-auth-shell .right-col:has(>.af-auth-navigation){padding-top:var(--af-space-4)!important}
  body.af-ui.statement-workspace,body.af-ui.af-document-viewer{background:var(--af-canvas)}
  body.af-ui.statement-workspace :is(.statement-party,.statement-filters,.statement-results,.statement-balances article){border-color:var(--af-line);background:#fff;border-radius:12px;box-shadow:var(--af-shadow-sm)}
  body.af-ui.statement-workspace :is(input,select,.statement-button){font-family:var(--af-font);font-size:13px;min-height:40px;border-color:#d2d9e1;border-radius:6px;color:var(--af-text)}
  body.af-ui.statement-workspace .statement-button.primary{background:var(--af-primary);border-color:var(--af-primary);color:#fff}
  body.af-ui.statement-workspace :is(.statement-hint,.statement-party small,.statement-results-heading span,.statement-party dt,.statement-table-tools label,.statement-footer){color:var(--af-muted);font-size:12px}
  body.af-ui.statement-workspace #statement-table th{background:#f1f4f7;color:var(--af-ink-700)}
  body.af-ui.statement-workspace #statement-table tbody tr:nth-child(even){background:#fafbfc}
  body.af-ui.af-document-viewer .document-toolbar{background:var(--af-primary-hover);box-shadow:none;padding:10px;gap:8px}
  body.af-ui.af-document-viewer .af-view-controls{background:#fff;border-bottom:1px solid var(--af-line);font-family:var(--af-font)}
  body.af-ui.af-document-viewer .af-view-controls button{border-color:var(--af-line);color:var(--af-ink-700);min-height:36px}
  body.af-ui.af-document-viewer .doc-dialog-head{background:var(--af-primary-hover)}

  @media(min-width:1600px){body.af-ui:not(.af-pos-shell) .content{padding-inline:28px}body.af-ui:not(.af-pos-shell) .content-header{padding-inline:28px}body.af-ui .af-section-actions{margin-inline:28px}}
  @media(max-width:1023px){
    body.af-ui .af-section-actions{margin-inline:16px}
    body.af-ui .af-section-actions__identity{min-width:130px}
    body.af-ui:not(.af-pos-shell) .content,body.af-ui .af-contact-directory,body.af-ui .af-contact-profile{padding:16px 16px 24px}
    body.af-ui:not(.af-pos-shell) .content-header{padding:16px 16px 0}
  }
  @media(max-width:767px){
    body.af-ui .af-page-hero{padding:14px var(--af-page-gutter-compact) 10px;gap:10px}
    body.af-ui .af-page-hero__identity,body.af-ui .af-page-hero__actions{width:100%}
    body.af-ui .af-page-hero__identity h1{font-size:21px}
    body.af-ui .af-page-hero__actions{justify-content:stretch}
    body.af-ui .af-page-hero__actions :is(.btn,.af-btn){flex:1 1 auto;min-height:var(--af-touch-height)}
    body.af-ui .af-filter-toolbar{padding:10px;align-items:stretch}
    body.af-ui .af-filter-toolbar>[class*="col-"]{flex-basis:100%;min-width:0}
    body.af-ui .af-filter-toolbar>.af-filter-toolbar__actions{justify-content:stretch;flex-basis:100%}
    body.af-ui .af-filter-toolbar>.af-filter-toolbar__actions>.btn{flex:1 1 auto}
    body.af-ui .af-section-tabs{margin:0 var(--af-page-gutter-compact) 12px;padding:4px;border-radius:var(--af-radius-sm)}
    body.af-ui .af-section-tabs__track>a,body.af-ui .af-section-tabs__track>button,body.af-ui .af-section-tabs__actions>details>summary{min-height:var(--af-touch-height);padding-inline:11px}
    body.af-ui .af-section-tabs__actions>details>div{max-height:50dvh;overflow:auto}
    /* A dialog lives inside the cart form. Catalog-only mobile mode must not
       hide that ancestor while a payment/credit/options dialog is open. */
    body.af-pos-shell .af-pos-workspace-form:has(.af-pos-cart-panel .modal.in) .af-pos-cart-panel{display:block!important}
    body.af-pos-shell .af-pos-workspace-form #modal_payment .af-pos-payment-summary__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row;gap:8px}
    body.af-pos-shell #modal_payment .af-pos-payment-stat{grid-column:auto!important;grid-row:auto!important}
    body.af-pos-shell #modal_payment .af-pos-payment-stat--balance{grid-column:1 / -1!important}
    body.af-ui:not(.af-pos-shell) .content,body.af-ui .af-contact-directory,body.af-ui .af-contact-profile{padding:12px 12px 20px}
    body.af-ui:not(.af-pos-shell) .content-header{padding:14px 12px 0}
    body.af-ui :is(.content-header h1,.catalog-header h1,.sales-heading,.pd-heading h1,.pf-header h1,.af-profile-title-row h1,.af-directory-hero h1,.lr-head h1,.sc-page h1,#do-workspace h1){font-size:21px}
    body.af-ui .af-section-actions{margin:10px 12px 0;flex-wrap:wrap;gap:6px;padding:8px 10px}
    body.af-ui .af-section-actions__identity{flex-basis:100%}
    body.af-ui .af-section-actions__buttons{display:flex!important;flex-basis:100%;flex-wrap:nowrap;overflow-x:auto}
    body.af-ui .af-section-action{width:auto;min-width:max-content;min-height:40px;flex:0 0 auto}
    body.af-ui :is(.af-page-actions,.catalog-header-actions){width:100%}
    body.af-ui .af-page-actions>.btn{flex:1 1 auto;width:auto;min-height:44px}
    body.af-ui :is(.af-widget .af-widget-body,.box-body,.panel-body,.catalog-browse,.catalog-list,.pd-panel,.pd-product,.af-directory-hero,.af-profile-hero,.lr-head){padding:12px!important}
    body.af-ui :is(.btn,.tw-dw-btn,.sc-button,.do-btn){min-height:42px}
    body.af-ui :is(.dataTables_wrapper .btn,.dataTables_wrapper .dt-button){min-height:40px}
    body.af-ui .form-control:not(textarea){height:44px;min-height:44px;font-size:16px}
    body.af-ui .select2-container .select2-selection--single{height:44px;min-height:44px}
    body.af-ui .select2-container .select2-selection--single .select2-selection__rendered{line-height:42px;font-size:14px}
    body.af-ui .select2-container .select2-selection--single .select2-selection__arrow{height:42px}
    body.af-ui .input-group-btn>.btn{height:44px;min-height:44px}
    body.af-ui .modal-dialog{margin:12px;width:calc(100% - 24px);max-width:calc(100% - 24px)}
    body.af-ui .modal-body{padding:12px}
    body.af-ui .modal-footer .btn{flex:1 1 auto}
    body.af-ui .catalog-summary{gap:8px}
    body.af-ui .currency-panel .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    body.af-ui .currency-panel .metric strong{font-size:16px}
    body.af-ui .af-daily-detail{min-height:40px}
    /* Discount/tax form tables are not item lists. Stack their existing cells
       on small screens so a colspan note cannot force the page wider. */
    body.af-ui :is(#add_purchase_form,#edit_purchase_form) table:has(#additional_notes),
    body.af-ui :is(#add_purchase_form,#edit_purchase_form) table:has(#additional_notes)>tbody{display:block;width:100%;min-width:0}
    body.af-ui :is(#add_purchase_form,#edit_purchase_form) table:has(#additional_notes)>tbody>tr{display:flex;flex-wrap:wrap;gap:8px}
    body.af-ui :is(#add_purchase_form,#edit_purchase_form) table:has(#additional_notes)>tbody>tr>td{display:block;flex:1 1 100%;width:100%!important;min-width:0;max-width:100%;padding:8px 0}
    body.af-ui :is(#add_purchase_form,#edit_purchase_form) table:has(#additional_notes) :is(.form-control,.form-group){max-width:100%;min-width:0}
    body.af-pos-shell #pos_table .form-control{font-size:14px}
  }
  @media(max-width:359px){body.af-ui .currency-panel .metric-grid{grid-template-columns:minmax(0,1fr)}}
  @media(prefers-reduced-motion:reduce){body.af-ui *,body.af-ui *::before,body.af-ui *::after{transition:none!important;animation-duration:.01ms!important}}
}

/* Alfrid modern identity. Included in af-interface.css by the release build.
 * Presentation only: no generated actions, renamed fields, hidden data or new totals.
 * Keep native table, dialog, permission and calculation behavior in its owner module.
 */
@media screen {
  body.af-ui .thetop > main, body.af-ui #scrollable-container {background:var(--af-canvas)!important}
  body.af-ui.af-app-shell {color:var(--af-text);background:var(--af-canvas)!important}
  body.af-ui .af-shell-header {background:var(--af-surface)!important;color:var(--af-text);border-bottom:1px solid var(--af-line)!important;box-shadow:0 1px 0 #192d4a04}
  body.af-ui .af-shell-header .theme-btn-bg {background:var(--af-surface)!important;color:var(--af-text)!important;border:1px solid var(--af-line)!important;box-shadow:none;min-height:38px;border-radius:var(--af-radius-sm)}
  body.af-ui .af-shell-header .theme-btn-bg:hover {background:var(--af-primary-soft)!important;color:var(--af-primary)!important;border-color:var(--af-primary-border)!important;transform:none}
  body.af-ui .af-shell-header .theme-btn-bg:focus-visible {outline-color:var(--af-focus-ring)}
  body.af-ui .af-shell-header :is(.tw-text-white,.tw-text-white\/80) {color:var(--af-text)}
  body.af-ui .af-shell-header a[href$="/pos/create"] {background:var(--af-primary)!important;border-color:var(--af-primary)!important;color:#fff!important}
  body.af-ui .af-site-release__summary {background:var(--af-primary-soft)!important;color:var(--af-primary)!important;border:1px solid var(--af-primary-border)!important;box-shadow:none;border-radius:var(--af-radius-sm)}
  body.af-ui .af-site-release__summary:hover {background:#e1ebff!important}

  /* A persistent navigation rail. Existing expand/collapse/search is retained. */
  body.af-ui .af-shell-sidebar, body.af-ui .side-bar {background:var(--af-nav)!important;border-color:var(--af-nav-line)!important;box-shadow:none!important;color:var(--af-nav-text)}
  body.af-ui .af-shell-sidebar .theme-logo-bg {background:var(--af-nav)!important;border-color:var(--af-nav-line)!important;min-height:68px;justify-content:flex-start;padding:12px 16px;gap:10px;text-decoration:none}
  body.af-ui .side-bar-heading {color:#fff!important;font-size:14px;font-weight:700;margin:0;padding:0;line-height:1.7;text-align:start;min-width:0;white-space:normal}
  body.af-ui .af-brand-mark {display:inline-flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;background:var(--af-nav-active);border:1px solid #4c7cda;border-radius:11px;color:#fff}
  body.af-ui .af-brand-mark svg {width:23px;height:23px}
  body.af-ui .af-shell-sidebar > div {border-color:var(--af-nav-line)!important}
  body.af-ui .af-shell-search {margin-block:4px 10px;padding:8px 10px;background:var(--af-nav-raised)!important;border:1px solid var(--af-nav-line)!important;border-radius:var(--af-radius-sm)}
  body.af-ui .af-shell-search :is(input,button,svg),body.af-ui #sidebar-search {color:var(--af-nav-text)!important}
  body.af-ui #sidebar-search {background:transparent!important;box-shadow:none!important;border:0!important;min-height:28px;font-size:12px}
  body.af-ui #sidebar-search::placeholder {color:var(--af-nav-muted);opacity:1}
  body.af-ui #side-bar {padding:4px 10px 18px;border-color:var(--af-nav-line)!important;scrollbar-width:thin;scrollbar-color:#405675 transparent}
  body.af-ui #side-bar > .tw-uppercase {color:var(--af-nav-muted)!important;font-size:11px;letter-spacing:0;padding:18px 12px 8px;font-weight:400}
  body.af-ui #side-bar a {margin-inline:0;min-height:38px;padding:9px 12px;color:var(--af-nav-text)!important;border:1px solid transparent;border-radius:8px;font-size:13px;transition:background-color var(--af-motion-fast) var(--af-ease),color var(--af-motion-fast) var(--af-ease)}
  body.af-ui #side-bar a :is(svg,i) {color:var(--af-nav-muted)!important}
  body.af-ui #side-bar .theme-sidebar-hover:hover, body.af-ui #side-bar .theme-sidebar-child-hover:hover {background:var(--af-nav-raised)!important;color:#fff!important}
  body.af-ui #side-bar .theme-sidebar-active {background:var(--af-nav-active)!important;border-color:#3e70d3!important;color:#fff!important;box-shadow:none!important}
  body.af-ui #side-bar .theme-sidebar-active :is(svg,i),body.af-ui #side-bar a:hover :is(svg,i) {color:#fff!important}
  body.af-ui #side-bar .chiled {padding-inline-start:18px!important;margin-inline:16px 0;border-inline-start:1px solid var(--af-nav-line)}
  body.af-ui #side-bar .chiled > .tw-absolute {background:var(--af-nav-line);width:0}
  body.af-ui #side-bar .chiled a {min-height:34px;padding:6px 10px;font-size:12px;white-space:normal;line-height:1.65}
  body.af-ui #side-bar .theme-sidebar-child-active {color:#fff!important;background:var(--af-nav-raised)!important;border-color:var(--af-nav-line);font-weight:700}
  body.af-ui #af-sidebar-results {background:var(--af-nav);color:var(--af-nav-text)}
  body.af-ui #af-sidebar-results a {background:var(--af-nav-raised);color:#fff;border-color:var(--af-nav-line)}
  body.af-ui #af-sidebar-result-count,body.af-ui #sidebar-no-results {color:var(--af-nav-muted)}

  /* Page hierarchy: quiet canvas, clear heading, one consistent action height. */
  body.af-ui.af-app-shell :is(h1,h2,h3,h4,h5,h6),body.af-ui.af-auth-shell :is(h1,h2,h3,h4,h5,h6) {font-family:var(--af-font)!important;font-weight:var(--af-weight-strong);letter-spacing:0}
  body.af-ui.af-app-shell #scrollable-container h1 {font-size:var(--af-title-page);line-height:1.5}
  body.af-ui :is(.content-header,.af-page-hero) h1 {font-weight:700;color:var(--af-text)!important;letter-spacing:0}
  body.af-ui .af-page-hero {padding-block:22px 18px}
  body.af-ui .af-page-hero__eyebrow {color:var(--af-muted);font-size:12px;font-weight:400;letter-spacing:0}
  body.af-ui .af-page-hero__eyebrow i {color:var(--af-primary);background:var(--af-primary-soft);width:24px;height:24px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center}
  body.af-ui :is(.af-section-tabs,.catalog-saved-filters,.af-saved-filters) {box-shadow:none}
  body.af-ui .af-section-tabs__track > :is(a,button)[aria-current=page],body.af-ui .af-section-tabs__track > button[aria-pressed=true] {background:var(--af-primary-soft);color:var(--af-primary);border-color:var(--af-primary-border)}
  body.af-ui :is(.af-widget,.content .box,.content .panel,.sales-results-card,.catalog-list,.af-directory-panel,.acw-card,.ic-panel,.aw-panel) {background:var(--af-surface);border-color:var(--af-line)!important;box-shadow:var(--af-shadow-sm);border-radius:var(--af-radius-md)}
  body.af-ui :is(.box-header,.panel-heading,.modal-header) {border-bottom:1px solid var(--af-line);background:var(--af-surface)}
  body.af-ui :is(.box-footer,.panel-footer,.modal-footer) {border-color:var(--af-line);background:var(--af-subtle)}
  body.af-ui :is(.modal-content,.swal2-popup,.acw-export) {border:1px solid var(--af-line);border-radius:var(--af-radius-lg);box-shadow:var(--af-shadow-lg);color:var(--af-text)}
  body.af-ui :is(.modal-header .close,.sales-drawer-close,.gl-drawer-close) {border:1px solid var(--af-line);border-radius:8px;min-width:34px;min-height:34px;background:var(--af-subtle);color:var(--af-muted);opacity:1;line-height:1}

  /* Button grammar: neutral secondary, blue primary, semantic destructive. */
  body.af-ui :is(.acw-btn,.ic-btn,.aw-btn,.catalog-button,.sales-button,.af-btn,.af-work-button,.do-btn,.sc-button,.pd-button,.prc-btn) {border-radius:var(--af-radius-sm);min-height:var(--af-control-height);font-family:var(--af-font);font-size:var(--af-text-table);border-color:var(--af-control-border);box-shadow:none;transition:background-color var(--af-motion-fast) var(--af-ease),border-color var(--af-motion-fast) var(--af-ease)}
  body.af-ui :is(.btn,.tw-dw-btn,.af-btn,.sales-button,.catalog-button):not(:disabled):hover {transform:none}
  body.af-ui :is(.btn-primary,.tw-dw-btn-primary,.sales-button-primary,.catalog-button-primary,.acw-primary,.ic-primary,.af-btn-primary,.aw-primary) {background:var(--af-primary)!important;border-color:var(--af-primary)!important;color:#fff!important;box-shadow:0 2px 4px #2457d618}
  body.af-ui :is(.btn-primary,.tw-dw-btn-primary,.sales-button-primary,.catalog-button-primary,.acw-primary,.ic-primary,.af-btn-primary,.aw-primary):hover {background:var(--af-primary-hover)!important;border-color:var(--af-primary-hover)!important}
  body.af-ui :is(.btn-default,.btn-secondary,.tw-dw-btn-outline) {background:var(--af-surface)!important;border-color:var(--af-control-border)!important;color:var(--af-text)!important}
  body.af-ui :is(.btn-default,.btn-secondary,.tw-dw-btn-outline):hover {background:var(--af-subtle)!important;border-color:#91a6c4!important}
  body.af-ui :is(.dropdown-menu,.sales-menu-panel,.af-section-tabs__actions>details>div,.acw-menu-body,.acw-columns>div) {background:var(--af-surface);border:1px solid var(--af-line);border-radius:var(--af-radius-md);box-shadow:var(--af-shadow-lg);padding:6px}
  body.af-ui .dropdown-menu > li > a {border-radius:6px;color:var(--af-text)}
  body.af-ui .dropdown-menu > li > a:hover,body.af-ui .dropdown-menu > li > a:focus {background:var(--af-primary-soft);color:var(--af-primary)}

  /* Filters, search and explicit field states. No hidden inputs are restyled. */
  body.af-ui :is(.sales-search,.catalog-search,.af-directory-search,.acw-filter,.ic-filters,.sales-filters,.catalog-filters,.af-filter-toolbar,.af-filter-panel) {border-color:var(--af-line);border-radius:var(--af-radius-md);box-shadow:none;background:var(--af-surface)}
  body.af-ui :is(.sales-search,.catalog-search,.af-directory-search):focus-within {border-color:var(--af-primary);box-shadow:0 0 0 3px var(--af-primary-soft)}
  body.af-ui :is(.form-control,.select2-selection) {border-radius:var(--af-radius-sm);background-color:var(--af-surface);color:var(--af-text)}
  body.af-ui input:is([type=checkbox],[type=radio]) {accent-color:var(--af-primary)}
  body.af-ui :is(.input-group-addon,.af-input-icon) {background:var(--af-subtle);color:var(--af-muted);border-color:var(--af-control-border)}
  body.af-ui .form-control:focus {outline:0;box-shadow:0 0 0 3px var(--af-primary-soft)!important}
  body.af-ui :is(.form-control[aria-invalid=true],.has-error .form-control):focus {box-shadow:0 0 0 3px var(--af-danger-soft)!important}
  body.af-ui :is(.sales-filters summary,.sales-summary summary,.sales-disclosure summary,.af-filter-panel .pf-btn) {min-height:44px;color:var(--af-text)}
  body.af-ui :is(.sales-filter-count,.catalog-filter-count,.af-filter-count) {background:var(--af-primary-soft);color:var(--af-primary);border:1px solid var(--af-primary-border);border-radius:6px}
  body.af-ui :is(.acw-subtabs,.aw-tabs,.ic-tabs) [aria-current=page] {background:var(--af-primary-soft)!important;color:var(--af-primary)!important;border-color:var(--af-primary-border)}

  /* Tabular numbers retain their original precision/currency and DOM order. */
  body.af-ui .dataTables_wrapper table thead th {background:var(--af-subtle)!important;color:#455b78!important;border-color:var(--af-line)!important;font-weight:700;font-size:12px;line-height:1.7;vertical-align:middle}
  body.af-ui .dataTables_wrapper table tbody td {border-color:var(--af-line)!important;vertical-align:middle;line-height:1.8}
  body.af-ui .dataTables_wrapper table tbody tr:not(.selected):not(.danger):not(.warning):nth-child(even) {background:#fafcff}
  body.af-ui .dataTables_wrapper table tbody tr:not(.selected):hover {background:var(--af-primary-soft)!important}
  body.af-ui :is(.table tfoot,.dataTables_wrapper tfoot) {background:#eef3fc;color:var(--af-text)}
  body.af-ui :is(.table tfoot th,.table tfoot td) {border-color:var(--af-line)!important;line-height:1.8}
  body.af-ui :is(.display_currency,.acw-number,.sales-amount,.catalog-price,.aw-value,.ic-number) {font-variant-numeric:tabular-nums}
  body.af-ui .pagination > .active > :is(a,span) {background:var(--af-primary)!important;border-color:var(--af-primary)!important;color:#fff!important}
  body.af-ui .pagination > li > :is(a,span) {border-color:var(--af-line);color:var(--af-text);min-width:34px;min-height:34px}

  /* Existing summary cards share a neutral surface; meaning keeps its colors. */
  body.af-ui :is(.dashboard-metric-card,.acw-metric,.ic-metric,.aw-kpi,.cfr-metric,.af-stat-card,.catalog-summary button,.sales-metric) {background:var(--af-surface)!important;color:var(--af-text);border:1px solid var(--af-line)!important;border-radius:var(--af-radius-md);box-shadow:var(--af-shadow-sm)!important;min-width:0}
  body.af-ui :is(.dashboard-metric-card,.acw-metric,.ic-metric,.aw-kpi,.af-stat-card,.sales-metric) :is(strong,.dashboard-metric-value) {color:var(--af-text);font-variant-numeric:tabular-nums;line-height:1.6;letter-spacing:0}
  body.af-ui .dashboard-metric-card .dashboard-metric-value {font-size:24px}
  body.af-ui .dashboard-hero {background:transparent!important;color:var(--af-text)!important}
  body.af-ui .dashboard-hero #dashboard-title {color:var(--af-text)!important}
  body.af-ui #dashboard-summary-scope :is(dt,p,small) {color:var(--af-muted)!important;opacity:1!important}
  body.af-ui #dashboard-summary-scope dd {color:var(--af-text)!important;opacity:1!important}
  body.af-ui :is(.af-directory-title-icon,.af-stat-icon) {background:var(--af-primary-soft);color:var(--af-primary);border-radius:10px}
  body.af-ui :is(.acw-empty,.af-directory-empty,.dataTables_empty,.catalog-empty) {color:var(--af-muted);line-height:1.8}
  body.af-ui :is(.acw,.acw-drawer,.ic,.ic-drawer,.af-profile,.af-contact-directory,.af-pos-shell) {--afp-brown:var(--af-primary);--afp-gold:var(--af-accent);--afp-cream:var(--af-subtle);--afp-line:var(--af-line);--afp-text:var(--af-text);--afp-muted:var(--af-muted);--af-pos-brown:var(--af-primary);--af-pos-brown-dark:var(--af-primary-hover);--af-pos-gold:var(--af-accent);--af-pos-cream:var(--af-subtle);--af-pos-line:var(--af-line);--af-pos-ink:var(--af-text);--af-pos-muted:var(--af-muted)}
  body.af-ui .aw-kpi {--aw-ring:var(--af-primary)}

  /* Public/authentication entry points use the same brand, not a second theme. */
  body.af-auth-shell,body.af-guest-shell {background:var(--af-canvas)!important;background-image:none!important;color:var(--af-text)}
  body.af-auth-shell :is(.right-col form,.login-box-body,.register-box-body) {border:1px solid var(--af-line);border-radius:var(--af-radius-lg);background:var(--af-surface);box-shadow:var(--af-shadow-md)}
  body.af-auth-shell .left-col {background:var(--af-nav)!important;color:#fff}
  body.af-guest-shell .navbar-default {background:var(--af-nav);border:0}
  body.af-guest-shell .navbar-default :is(.navbar-brand,.navbar-nav>li>a) {color:#fff}
  body.af-ui :is(.main-footer,footer) {color:var(--af-muted);border-color:var(--af-line);font-size:11px}
  @media(max-width:767px) {
    body.af-ui .af-shell-header__actions {gap:6px}
    body.af-ui .af-shell-header .theme-btn-bg {min-height:40px}
    body.af-ui .af-page-hero {padding-block:16px 12px;gap:12px}
    body.af-ui .af-page-hero__identity {width:100%}
    body.af-ui .af-page-hero__actions {gap:8px}
    body.af-ui :is(.acw-btn,.ic-btn,.aw-btn,.sales-button,.catalog-button,.af-btn) {min-height:44px}
    body.af-ui .af-shell-sidebar {max-width:calc(100vw - 48px)}
    body.af-ui #side-bar a {min-height:44px}
    body.af-ui #side-bar .chiled a {min-height:40px}
  }
  @media(prefers-reduced-motion:reduce) {
    body.af-ui *,body.af-ui *::before,body.af-ui *::after {transition:none!important;scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
  }
}
