:root {
 color-scheme: light;
 --bg: #f4f6fb;
 --panel: #ffffff;
 --panel-soft: #fff7ed;
 --line: #e6e9f2;
 --text: #182033;
 --muted: #6b7280;
 --brand: #ff7a00;
 --brand-2: #ffb000;
 --good: #16a34a;
 --warn: #f59e0b;
 --bad: #dc2626;
 --blue: #2563eb;
 --sidebar: #111827;
 --sidebar-2: #1f2937;
 --shadow: 0 12px 34px rgba(15, 23, 42, 0.08);
 --shadow-soft: 0 8px 20px rgba(15, 23, 42, 0.05);
 --radius: 18px;
 --topbar-height: 76px;
 --modal-mobile-gap: 0px;
 --modal-mobile-top: calc(var(--topbar-height) + var(--modal-mobile-gap));
 --products-modal-mobile-top: calc(var(--topbar-height) - 1px);
}

html,
body {
 color-scheme: light;
 background: var(--bg) !important;
 color: var(--text);
}

body {
 forced-color-adjust: none;
}

input,
textarea,
select,
button {
 color-scheme: light;
}

input,
textarea,
select {
 background-color: #ffffff;
 color: var(--text);
 border-color: #dbe3ef;
}

@media (prefers-color-scheme: dark) {
 :root {
 color-scheme: light;
 }

 html,
 body {
 background: var(--bg) !important;
 color: var(--text) !important;
 }

 .app-shell,
 .main,
 .page {
 background: var(--bg) !important;
 color: var(--text) !important;
 }

 .card,
 .panel,
 .topbar,
 input,
 textarea,
 select {
 background-color: #ffffff;
 color: var(--text);
 }

 input::placeholder,
 textarea::placeholder {
 color: #7b8494;
 opacity: 1;
 }
}

* {
 scrollbar-color: var(--brand) #fff3e3;
 scrollbar-width: thin;
}

*::-webkit-scrollbar {
 width: 12px;
 height: 12px;
}

*::-webkit-scrollbar-track {
 background: #fff3e3;
 border-radius: 999px;
}

*::-webkit-scrollbar-thumb {
 min-height: 42px;
 border: 2px solid #fff3e3;
 border-radius: 999px;
 background: linear-gradient(180deg, #ffb000, #ff7a00);
}

*::-webkit-scrollbar-thumb:hover {
 background: linear-gradient(180deg, #ffca3a, #f97316);
}

*::-webkit-scrollbar-corner {
 background: #fff3e3;
}

*::-webkit-scrollbar-button {
 width: 12px;
 height: 12px;
 border-radius: 999px;
 background-color: #ff7a00;
 background-repeat: no-repeat;
 background-position: center;
 background-size: 7px 7px;
}

*::-webkit-scrollbar-button:vertical:decrement {
 background-image:
 linear-gradient(135deg, transparent 50%, #fff 50%),
 linear-gradient(45deg, #fff 50%, transparent 50%);
 background-position:
 3px 5px,
 6px 5px;
}

*::-webkit-scrollbar-button:vertical:increment {
 background-image:
 linear-gradient(45deg, transparent 50%, #fff 50%),
 linear-gradient(135deg, #fff 50%, transparent 50%);
 background-position:
 3px 3px,
 6px 3px;
}

*::-webkit-scrollbar-button:horizontal:decrement {
 background-image:
 linear-gradient(45deg, transparent 50%, #fff 50%),
 linear-gradient(135deg, transparent 50%, #fff 50%);
 background-position:
 5px 3px,
 5px 6px;
}

*::-webkit-scrollbar-button:horizontal:increment {
 background-image:
 linear-gradient(135deg, #fff 50%, transparent 50%),
 linear-gradient(45deg, #fff 50%, transparent 50%);
 background-position:
 3px 3px,
 3px 6px;
}

.layout-order .history-table {
 border-collapse: separate !important;
 border-spacing: 0 !important;
 overflow: hidden;
}

.layout-order .history-list-shell {
 position: relative;
 overflow: visible;
}

.layout-order .history-table th:nth-child(1),
.layout-order .history-table td:nth-child(1) {
 width: 230px;
}

.layout-order .history-table th,
.layout-order .history-table td {
 font-size: 14px;
}

.layout-order .history-main-row.is-odd,
.layout-order .history-note-row.is-odd {
 background: #ffffff !important;
}

.layout-order .history-main-row.is-even,
.layout-order .history-note-row.is-even {
 background: #f8fafc !important;
}

.layout-order .history-main-row td {
 padding: 15px 16px 8px !important;
 border-bottom: 0 !important;
 vertical-align: top;
}

.layout-order .history-note-row td {
 padding: 0 16px 15px !important;
 border-top: 0 !important;
 border-bottom: 1px solid #e5e7eb !important;
 color: #64748b;
 font-size: 14px;
 line-height: 1.45;
}

.layout-order .history-date-value {
 display: block;
 color: #0f172a;
 font-size: 14px;
 line-height: 1.2;
}

.layout-order .history-user-inline {
 display: block;
 margin-top: 5px;
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
 line-height: 1.2;
}

.layout-order .history-status-pill {
 display: inline-flex;
 align-items: center;
 max-width: 100%;
 min-height: 32px;
 padding: 8px 12px;
 font-size: 13px;
 white-space: normal;
}

.layout-order .history-note-label {
 display: inline-flex;
 margin-right: 8px;
 color: #334155;
 font-size: 11px;
 font-weight: 900;
 text-transform: uppercase;
}

.layout-order .history-note-text {
 color: #475569;
 font-weight: 700;
}

.history-table {
 border-collapse: separate;
 border-spacing: 0;
 overflow: hidden;
}

.history-table th:nth-child(4) {
 display: none;
}

.history-main-row.is-odd,
.history-note-row.is-odd {
 background: #ffffff;
}

.history-main-row.is-even,
.history-note-row.is-even {
 background: #f8fafc;
}

.history-main-row td {
 border-bottom: 0 !important;
 vertical-align: middle;
}

.history-note-row td {
 padding-top: 0 !important;
 border-top: 0 !important;
 border-bottom: 1px solid #e5e7eb !important;
 color: #64748b;
 font-size: 13px;
 line-height: 1.35;
}

.history-status-pill {
 display: inline-flex;
 align-items: center;
 max-width: 100%;
 min-height: 28px;
 padding: 7px 10px;
 font-size: 12px;
 white-space: normal;
}

.history-note-label {
 display: inline-flex;
 margin-right: 8px;
 color: #334155;
 font-size: 11px;
 font-weight: 900;
 text-transform: uppercase;
}

.history-note-text {
 color: #475569;
 font-weight: 700;
}

@media (max-width: 760px) {
 .history-table th,
 .history-table td {
 padding-left: 10px;
 padding-right: 10px;
 }

 .history-table th:nth-child(1),
 .history-table td:nth-child(1) {
 width: 34%;
 }

 .history-table th:nth-child(2),
 .history-table td:nth-child(2) {
 width: 38%;
 }

 .history-table th:nth-child(3),
 .history-table td:nth-child(3) {
 width: 28%;
 }
}

/* Status pill contrast v098: parentul si statusul copil se intalnesc intr-un fade pastel. */
.order-status-gradient,
.status-action-gradient {
 --status-surface-color-weight: 54%;
 border: 1px solid color-mix(
  in srgb,
  var(--status-accent-color, #cbd5e1) var(--status-surface-color-weight),
  #ffffff
 ) !important;
 background: linear-gradient(
  105deg,
  color-mix(
   in srgb,
   var(--status-parent-color, #f1f5f9) var(--status-surface-color-weight),
   #ffffff
  ) 0%,
  color-mix(
   in srgb,
   var(--status-accent-color, var(--status-parent-color, #f1f5f9)) var(--status-surface-color-weight),
   #ffffff
  ) 100%
 ) !important;
 box-shadow:
  inset 3px 0 0 color-mix(
   in srgb,
   var(--status-parent-color, #f1f5f9) var(--status-surface-color-weight),
   #ffffff
  ),
  inset -7px 0 0 color-mix(
   in srgb,
   var(--status-accent-color, var(--status-parent-color, #f1f5f9)) var(--status-surface-color-weight),
   #ffffff
 ) !important;
 color: var(--status-text-color, #0f172a);
 text-shadow: var(--status-text-glow, 0 1px 8px rgba(255, 255, 255, 0.82));
}

.order-status-info-tile {
 border-color: color-mix(
 in srgb,
 var(--status-accent-color, #ff8a00) var(--status-surface-color-weight, 54%),
 #ffffff
 ) !important;
 background: linear-gradient(
 105deg,
 color-mix(in srgb, var(--status-parent-color, #fff7ed) var(--status-surface-color-weight, 54%), #ffffff) 0%,
 color-mix(
 in srgb,
 var(--status-accent-color, var(--status-parent-color, #fff7ed)) var(--status-surface-color-weight, 54%),
 #ffffff
 )
 100%
 ) !important;
 box-shadow:
 inset 4px 0 0 color-mix(in srgb, var(--status-parent-color, #fff7ed) var(--status-surface-color-weight, 54%), #ffffff),
 inset -9px 0 0 color-mix(in srgb, var(--status-accent-color, var(--status-parent-color, #fff7ed)) var(--status-surface-color-weight, 54%), #ffffff) !important;
 color: var(--status-text-color, #0f172a);
 text-shadow: var(--status-text-glow, 0 1px 8px rgba(255, 255, 255, 0.82));
}

/* Status workflow admin */
.status-admin-layout {
 display: grid;
 gap: 16px;
}

.status-admin-intro {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 16px;
 border-left: 5px solid #ff8a00;
}

.status-admin-intro h2,
.status-admin-create h3,
.status-admin-group h3 {
 margin: 0;
}

.status-admin-stats {
 display: flex;
 gap: 10px;
}

.status-admin-stats span {
 min-width: 110px;
 padding: 12px 14px;
 border: 1px solid #e2e8f0;
 border-radius: 14px;
 background: #f8fafc;
}

.status-admin-stats strong,
.status-admin-stats small {
 display: block;
}

.status-admin-stats strong {
 font-size: 24px;
 color: #0f172a;
}

.status-admin-stats small {
 color: #64748b;
 font-weight: 800;
}

.status-admin-form {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 12px;
}

.status-admin-form label,
.status-admin-checks {
 display: grid;
 gap: 6px;
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
}

.status-admin-form input,
.status-admin-form select,
.status-admin-form textarea {
 width: 100%;
 border: 1px solid #d7e0ea;
 border-radius: 12px;
 background: #fff;
 color: #0f172a;
 font: inherit;
 font-weight: 800;
 padding: 11px 12px;
}

.status-admin-form input[type="color"] {
 min-height: 44px;
 padding: 4px;
}

.status-admin-wide {
 grid-column: 1 / -1;
}

.status-admin-checks {
 grid-template-columns: repeat(3, minmax(0, 1fr));
 padding: 12px;
 border: 1px solid #e2e8f0;
 border-radius: 14px;
 background: #f8fafc;
}

.status-admin-checks > span {
 grid-column: 1 / -1;
}

.status-admin-checks label,
.status-admin-toggles label {
 display: flex;
 align-items: center;
 gap: 8px;
 min-width: 0;
}

.status-admin-toggles {
 display: flex;
 gap: 18px;
 padding: 4px 0;
 color: #0f172a;
 font-weight: 900;
}

.status-admin-groups {
 display: grid;
 gap: 14px;
}

.status-admin-group {
 border-left: 5px solid var(--status-parent-color, #334155);
}

.status-admin-group-head {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 margin-bottom: 10px;
}

.status-admin-parent-swatch {
 width: 44px;
 height: 44px;
 border: 3px solid rgba(255, 255, 255, 0.92);
 border-radius: 16px;
 box-shadow:
  0 12px 28px rgba(15, 23, 42, 0.14),
  inset 0 0 0 1px rgba(15, 23, 42, 0.1);
}

.status-admin-list {
 display: grid;
 gap: 8px;
}

.status-admin-row {
 border: 1px solid #e2e8f0;
 border-radius: 14px;
 background: #fff;
 overflow: hidden;
}

.status-admin-row[data-inactive="1"] {
 opacity: 0.62;
}

.status-admin-row summary {
 display: grid;
 grid-template-columns: minmax(120px, auto) minmax(0, 1fr) auto;
 align-items: center;
 gap: 12px;
 padding: 10px 12px;
 cursor: pointer;
 list-style: none;
}

.status-admin-row summary::-webkit-details-marker {
 display: none;
}

.status-admin-swatch {
 --status-surface-color-weight: 54%;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 7px;
 min-width: 150px;
 min-height: 36px;
 padding: 8px 14px;
 border-radius: 999px;
 border: 1px solid color-mix(in srgb, var(--status-accent-color, #cbd5e1) var(--status-surface-color-weight), #ffffff);
 background: linear-gradient(
 105deg,
 color-mix(in srgb, var(--status-parent-color, #f1f5f9) var(--status-surface-color-weight), #ffffff) 0%,
 color-mix(in srgb, var(--status-accent-color, var(--status-parent-color, #f1f5f9)) var(--status-surface-color-weight), #ffffff) 100%
 );
 box-shadow:
 inset 3px 0 0 color-mix(in srgb, var(--status-parent-color, #f1f5f9) var(--status-surface-color-weight), #ffffff),
 inset -7px 0 0 color-mix(in srgb, var(--status-accent-color, var(--status-parent-color, #f1f5f9)) var(--status-surface-color-weight), #ffffff);
 color: var(--status-text-color, #0f172a);
 text-shadow: var(--status-text-glow, 0 1px 8px rgba(255, 255, 255, 0.82));
 font-size: 12px;
 font-weight: 950;
 white-space: nowrap;
}

.status-admin-swatch-icon {
 display: inline-grid;
 place-items: center;
 width: 22px;
 height: 22px;
 flex: 0 0 auto;
 border-radius: 999px;
 background: rgba(255, 255, 255, 0.78);
 box-shadow: 0 1px 4px rgba(15, 23, 42, 0.12);
 font-size: 13px;
 line-height: 1;
}

.status-action-gradient {
 border-width: 1px;
}

.status-action-with-icon {
 display: grid !important;
 grid-template-columns: 30px minmax(0, 1fr) auto;
 align-items: center;
 gap: 9px;
}

.status-action-icon {
 display: grid;
 place-items: center;
 width: 28px;
 height: 28px;
 border-radius: 11px;
 background: rgba(255, 255, 255, 0.74);
 box-shadow: 0 3px 10px rgba(15, 23, 42, 0.1);
 font-size: 15px;
 line-height: 1;
}

.status-admin-row-main {
 min-width: 0;
}

.status-admin-row-main strong,
.status-admin-row-main small {
 display: block;
}

.status-admin-row-main strong {
 color: #0f172a;
}

.status-admin-row-main small {
 margin-top: 2px;
 color: #64748b;
 font-size: 12px;
 font-weight: 800;
}

.status-admin-usage-line {
 display: block;
 margin-top: 5px;
 color: #1e40af;
 font-size: 11px;
 font-weight: 950;
}

.status-admin-row em {
 font-style: normal;
 padding: 5px 8px;
 border-radius: 999px;
 background: #fee2e2;
 color: #991b1b;
 font-size: 11px;
 font-weight: 950;
}

.status-admin-edit-form {
 padding: 12px;
 border-top: 1px solid #e2e8f0;
 background: #f8fafc;
}

.status-admin-actions {
 display: flex;
 align-items: center;
 justify-content: flex-end;
 gap: 10px;
}

.status-admin-actions .btn {
 min-width: 180px;
}

.status-delete-modal {
 position: fixed;
 inset: 0;
 z-index: 2300;
 display: flex;
 align-items: flex-start;
 justify-content: center;
 padding: calc(var(--topbar-height, 76px) + 18px) 16px 18px;
}

.status-delete-modal[hidden] {
 display: none !important;
}

.status-delete-backdrop {
 position: absolute;
 inset: 0;
 border: 0;
 background: rgba(15, 23, 42, 0.48);
 backdrop-filter: blur(8px);
 -webkit-backdrop-filter: blur(8px);
 cursor: pointer;
}

.status-delete-card {
 position: relative;
 width: min(620px, 100%);
 max-height: calc(100dvh - var(--topbar-height, 76px) - 36px);
 overflow: auto;
 border: 1px solid rgba(254, 202, 202, 0.9);
 border-radius: 24px;
 background: #ffffff;
 box-shadow: 0 30px 80px rgba(15, 23, 42, 0.32);
 padding: 28px;
}

.status-delete-close {
 position: absolute;
 top: 14px;
 right: 14px;
 width: 38px;
 height: 38px;
 border: 0;
 border-radius: 50%;
 background: #f8fafc;
 color: #0f172a;
 font-size: 20px;
 font-weight: 950;
 cursor: pointer;
}

.status-delete-icon {
 display: grid;
 place-items: center;
 width: 58px;
 height: 58px;
 margin-bottom: 12px;
 border-radius: 20px;
 background: linear-gradient(135deg, #f87171, #f97316);
 color: #fff;
 font-size: 28px;
 font-weight: 950;
}

.status-delete-copy {
 display: grid;
 gap: 7px;
 margin-bottom: 16px;
}

.status-delete-copy span {
 color: #991b1b;
 font-size: 12px;
 font-weight: 950;
 text-transform: uppercase;
}

.status-delete-copy h3 {
 margin: 0;
 color: #0f172a;
 font-size: 24px;
}

.status-delete-copy p,
.status-delete-copy small,
.status-delete-warning {
 margin: 0;
 color: #64748b;
 font-weight: 800;
 line-height: 1.4;
}

.status-delete-warning {
 padding: 12px;
 border: 1px solid #fecaca;
 border-radius: 14px;
 background: #fff1f2;
 color: #991b1b;
}

.status-delete-form {
 display: grid;
 gap: 14px;
}

.status-delete-form label {
 display: grid;
 gap: 7px;
 color: #64748b;
 font-size: 13px;
 font-weight: 900;
}

.status-delete-form select,
.status-delete-form .input {
 width: 100%;
 min-height: 46px;
 border: 1px solid #d7e0ea;
 border-radius: 14px;
 background: #fff;
 color: #0f172a;
 font: inherit;
 font-weight: 900;
 padding: 11px 12px;
}

.status-delete-form label strong {
 display: inline-flex;
 width: fit-content;
 padding: 5px 9px;
 border-radius: 999px;
 background: #fee2e2;
 color: #991b1b;
}

.status-delete-actions {
 display: flex;
 justify-content: flex-end;
 gap: 10px;
}

.status-delete-actions .btn[disabled] {
 opacity: 0.45;
 cursor: not-allowed;
}

@media (max-width: 900px) {
 .status-admin-intro {
 align-items: stretch;
 flex-direction: column;
 }

 .status-admin-stats,
 .status-admin-form,
 .status-admin-checks {
 grid-template-columns: 1fr;
 }

 .status-admin-stats {
 display: grid;
 grid-template-columns: 1fr 1fr;
 }

 .status-admin-row summary {
 grid-template-columns: 1fr;
 align-items: start;
 }

 .status-admin-actions,
 .status-delete-actions {
 display: grid;
 }

 .status-admin-actions .btn,
 .status-delete-actions .btn {
 width: 100%;
 min-width: 0;
 }
}

/* New order flow */
.new-order-page {
 display: grid;
 gap: 14px;
}
.new-order-mode-card {
 display: grid;
 grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
 gap: 12px;
}
.new-order-mode {
 min-height: 178px;
 display: grid;
 grid-template-rows: 102px auto auto;
 gap: 8px;
 align-content: start;
 border: 2px solid #e5e7eb;
 border-radius: 8px;
 padding: 10px;
 background: #fff;
 color: #0f172a;
 text-align: left;
 cursor: pointer;
 opacity: 0.62;
 filter: grayscale(1);
 transition:
 border-color 0.18s ease,
 box-shadow 0.18s ease,
 opacity 0.18s ease,
 filter 0.18s ease,
 transform 0.18s ease;
}
.new-order-mode::before {
 content: "";
 display: block;
 border-radius: 7px;
 background-color: #f8fafc;
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;
 box-shadow:
 inset 0 0 0 1px rgba(255, 255, 255, 0.72),
 inset 0 -38px 46px rgba(15, 23, 42, 0.28);
}
.new-order-mode[data-mode="inhouse"]::before {
 background-image:
 linear-gradient(135deg, rgba(255, 247, 237, 0.12), rgba(15, 23, 42, 0.05)),
 url("../img/new-order-inhouse.jpg");
}
.new-order-mode[data-mode="home"]::before {
 background-image:
 linear-gradient(135deg, rgba(239, 246, 255, 0.1), rgba(15, 23, 42, 0.08)),
 url("../img/new-order-delivery.jpg");
}
.new-order-mode strong {
 font-size: 17px;
 line-height: 1.15;
}
.new-order-mode span {
 color: #64748b;
 font-size: 13px;
 line-height: 1.35;
}
.new-order-mode.is-active {
 border-color: #ff7a00;
 background: #ffffff;
 box-shadow:
 0 18px 42px rgba(255, 122, 0, 0.18),
 inset 0 0 0 1px #fed7aa;
 opacity: 1;
 filter: none;
 transform: translateY(-1px);
}
.new-order-layout {
 display: grid;
 grid-template-columns: minmax(0, 1fr) 330px;
 gap: 14px;
 align-items: start;
}
.new-order-main,
.new-order-side {
 display: grid;
 gap: 14px;
}
.new-order-side {
 position: sticky;
 top: calc(var(--topbar-height) + 14px);
}
.new-order-card h3 {
 margin: 0;
}
.new-order-card {
 position: relative;
 overflow: visible;
}
.new-order-card .phone-field {
 min-width: 0;
}
.new-order-page .new-order-branch-card[hidden] {
 display: none !important;
}
.new-order-page .phone-field > label {
 font: inherit;
}

.new-order-estimate-card {
 display: grid;
 gap: 10px;
}

.new-order-estimate-card p {
 margin: 0;
 line-height: 1.35;
}

.new-order-estimate-panel {
 padding: 14px;
 border: 1px solid rgba(59, 130, 246, 0.18);
 border-radius: 16px;
 background: linear-gradient(135deg, #eef6ff, #ffffff 74%);
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
}

.new-order-estimate-panel span {
 display: block;
 color: #64748b;
 font-size: 11px;
 font-weight: 950;
 text-transform: uppercase;
 letter-spacing: 0.03em;
}

.new-order-estimate-panel strong {
 display: block;
 margin-top: 7px;
 color: #0f172a;
 font-size: 24px;
 line-height: 1;
}

.new-order-estimate-panel small {
 display: block;
 margin-top: 8px;
 color: #64748b;
 font-weight: 800;
 line-height: 1.35;
}

.new-order-estimate-breakdown {
 display: grid;
 gap: 6px;
 margin-top: 10px;
}

.new-order-estimate-breakdown > div {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 10px;
 padding: 7px 9px;
 border-radius: 12px;
 background: rgba(255, 255, 255, 0.74);
 border: 1px solid rgba(148, 163, 184, 0.18);
}

.new-order-estimate-breakdown > div span {
 display: block;
 color: #64748b;
 font-size: 11px;
 font-weight: 950;
 text-transform: uppercase;
 letter-spacing: 0.02em;
}

.new-order-estimate-breakdown > div strong {
 display: block;
 margin: 0;
 color: #0f172a;
 font-size: 16px;
 line-height: 1;
 white-space: nowrap;
}

.new-order-estimate-breakdown > div.is-total {
 background: #0f172a;
 border-color: #0f172a;
}

.new-order-estimate-breakdown > div.is-total span,
.new-order-estimate-breakdown > div.is-total strong {
 color: #ffffff;
}

.new-order-estimate-panel.is-hidden {
 display: none;
}

.new-order-section-head {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 12px;
 margin-bottom: 12px;
}
.new-order-section-head p {
 margin: 4px 0 0;
 color: #64748b;
 font-size: 13px;
}
.new-order-grid {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 10px;
}
.new-order-grid.single {
 grid-template-columns: minmax(0, 1fr);
}
.new-order-grid.client-grid {
 grid-template-columns: repeat(2, minmax(0, 1fr));
}
.new-order-grid .wide,
.phone-field {
 grid-column: 1/-1;
}
.new-order-address-map {
 position: relative;
 min-height: 220px;
 border: 1px solid #dbe3ef;
 border-radius: 14px;
 overflow: hidden;
 background: linear-gradient(135deg, #fff7ed, #eef6ff);
 box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7);
}
.new-order-address-map iframe {
 display: block;
 width: 100%;
 height: 220px;
 border: 0;
}
.new-order-address-map-empty {
 position: absolute;
 inset: 0;
 display: grid;
 place-items: center;
 align-content: center;
 gap: 6px;
 padding: 18px;
 text-align: center;
 color: #64748b;
}
.new-order-address-map-empty strong {
 color: #0f172a;
 font-size: 17px;
}
.new-order-address-map-empty span {
 font-size: 13px;
 font-weight: 800;
}
.new-order-address-map.has-map {
 background: #ffffff;
}
.new-order-address-map.has-map .new-order-address-map-empty {
 display: none;
}
.field {
 position: relative;
 display: grid;
 gap: 5px;
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
}
.field textarea.input {
 min-height: 84px;
 resize: vertical;
}
.new-order-page .phone-suggestions {
 position: static;
 display: none;
 min-width: 0;
 width: 100%;
 max-height: min(360px, 48vh);
 margin-top: 5px;
 overflow-x: hidden;
 overflow-y: auto;
 border: 1px solid var(--line, #e6e9f2);
 border-left: 3px solid var(--brand, #ff7a00);
 border-radius: 12px;
 background: var(--panel, #fff);
 box-shadow: none;
}
.new-order-page .phone-suggestions.is-open {
 display: grid;
 grid-auto-rows: max-content;
 align-content: start;
}
.new-order-page .phone-suggestion-item {
 display: grid;
 grid-template-columns: 36px minmax(0, 1fr);
 align-items: center;
 gap: 10px;
 min-width: 0;
 min-height: 76px;
 width: 100%;
 padding: 10px 12px;
 border: 0;
 border-bottom: 1px solid var(--line, #e6e9f2);
 border-radius: 0;
 background: var(--panel, #fff);
 color: var(--text, #182033);
 font: inherit;
 text-align: left;
 cursor: pointer;
}
.new-order-page .phone-suggestion-item:last-child {
 border-bottom: 0;
}
.new-order-page .phone-suggestion-item:hover,
.new-order-page .phone-suggestion-item:focus-visible {
 background: var(--panel-soft, #fff7ed);
}
.new-order-page .phone-suggestion-item:focus-visible {
 outline: 2px solid var(--brand, #ff7a00);
 outline-offset: -3px;
}
.new-order-page .phone-suggestion-icon {
 display: grid;
 width: 36px;
 height: 36px;
 place-items: center;
 border: 1px solid #fed7aa;
 border-radius: 10px;
 background: #fff7ed;
 font-size: 18px;
}
.new-order-page .phone-suggestion-copy {
 display: grid;
 min-width: 0;
 gap: 3px;
}
.new-order-page .phone-suggestion-copy em {
 color: var(--muted, #6b7280);
 font-size: max(11px, calc(11px * var(--goic-simple-text-scale, 1)));
 font-style: normal;
 font-weight: 700;
 line-height: 1.3;
}
.new-order-page .phone-suggestion-copy strong {
 color: var(--text, #182033);
 font-size: max(14px, calc(15px * var(--goic-simple-text-scale, 1)));
 font-weight: 800;
 line-height: 1.3;
 overflow-wrap: anywhere;
}
.new-order-page .phone-suggestion-phone {
 color: var(--text, #182033);
 font-size: max(13px, calc(14px * var(--goic-simple-text-scale, 1)));
 font-weight: 600;
 line-height: 1.3;
 overflow-wrap: anywhere;
}
.new-order-page .phone-suggestion-copy small {
 color: var(--muted, #6b7280);
 font-size: max(12px, calc(12px * var(--goic-simple-text-scale, 1)));
 font-weight: 500;
 line-height: 1.4;
 overflow-wrap: anywhere;
}
.new-order-items {
 display: grid;
 gap: 10px;
 counter-reset: new-order-item;
}
.new-order-item {
 counter-increment: new-order-item;
 position: relative;
 display: grid;
 grid-template-columns: minmax(180px, 1.25fr) 96px minmax(160px, 0.9fr) 126px;
 gap: 8px;
 align-items: end;
 border: 1px solid #e5e7eb;
 border-radius: 8px;
 padding: 12px 12px 12px 48px;
 background: #f8fafc;
}
.new-order-item::before {
 content: counter(new-order-item);
 position: absolute;
 left: 0;
 top: 0;
 bottom: 0;
 width: 34px;
 display: grid;
 place-items: center;
 background: #374151;
 color: #fff;
 font-size: 15px;
 font-weight: 900;
}
.new-order-item-remove {
 position: absolute;
 top: 8px;
 right: 8px;
 width: 30px;
 height: 30px;
}
.new-order-item-total {
 display: grid;
 gap: 4px;
 align-self: stretch;
 align-content: center;
 border-radius: 8px;
 padding: 8px 10px;
 background: #fff;
 font-weight: 900;
 text-align: right;
}
.new-order-item-total span {
 color: #64748b;
 font-size: 12px;
}
.new-order-total {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 margin: 10px 0 12px;
 border-radius: 8px;
 padding: 12px;
 background: #fff7ed;
 font-weight: 900;
}
.new-order-submit {
 width: 100%;
 margin-top: 8px;
}
.is-hidden {
 display: none !important;
}
@media (max-width: 980px) {
 .new-order-layout,
 .new-order-grid,
 .new-order-grid.client-grid {
 grid-template-columns: 1fr;
 }
 .new-order-side {
 position: static;
 }
 .new-order-item {
 grid-template-columns: 1fr 92px;
 padding-top: 46px;
 }
 .new-order-item .product-field,
 .new-order-item .item-note-field,
 .new-order-item-total {
 grid-column: 1/-1;
 }
}
@media (max-width: 640px) {
 .new-order-mode-card {
 grid-template-columns: 1fr 1fr;
 gap: 8px;
 }
 .new-order-mode {
 min-height: 148px;
 padding: 8px;
 grid-template-rows: 76px auto auto;
 }
 .new-order-mode strong {
 font-size: 14px;
 }
 .new-order-mode span {
 font-size: 11px;
 }
 .new-order-section-head {
 align-items: stretch;
 }
 .new-order-section-head .btn {
 min-width: 108px;
 }
 .new-order-address-map {
 min-height: 170px;
 }
 .new-order-address-map iframe {
 height: 170px;
 }
 .new-order-item {
 grid-template-columns: 1fr;
 padding-right: 12px;
 }
 .new-order-item .qty-field,
 .new-order-item-total {
 grid-column: 1/-1;
 }
}
.previous-orders-card {
 display: grid;
 gap: 10px;
}
.previous-orders-list {
 display: grid;
 border: 1px solid #e5e7eb;
 border-radius: 8px;
 overflow: hidden;
 background: #fff;
}
.previous-order-row {
 display: grid;
 grid-template-columns: 110px minmax(0, 1fr) minmax(150px, 0.8fr) 100px 90px;
 gap: 10px;
 align-items: center;
 padding: 11px 12px;
 border-bottom: 1px solid #eef2f7;
 text-decoration: none;
}
.previous-order-row:last-child {
 border-bottom: 0;
}
.previous-order-row:hover {
 background: #fff7ed;
}
.previous-order-row span,
.previous-order-row small {
 min-width: 0;
 color: #64748b;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}
.previous-order-row strong {
 color: #0f172a;
}
@media (max-width: 760px) {
 .previous-order-row {
 grid-template-columns: 1fr auto;
 }
 .previous-order-row span:nth-of-type(2),
 .previous-order-row small {
 display: none;
 }
 .previous-order-row span:first-of-type {
 grid-column: 1/-1;
 }
}

* {
 box-sizing: border-box;
}

html {
 scroll-behavior: smooth;
}

body {
 margin: 0;
 font-family:
 Inter,
 system-ui,
 -apple-system,
 Segoe UI,
 Arial,
 sans-serif;
 background:
 radial-gradient(
 circle at top left,
 rgba(255, 122, 0, 0.08),
 transparent 32rem
 ),
 var(--bg);
 color: var(--text);
 -webkit-font-smoothing: antialiased;
}

a {
 color: inherit;
 text-decoration: none;
}

button,
a,
input,
select,
textarea {
 -webkit-tap-highlight-color: transparent;
}

.app-shell {
 display: block;
 min-height: 100vh;
}

.main {
 min-width: 0;
}

.topbar {
 min-height: var(--topbar-height);
 position: sticky;
 top: 0;
 z-index: 50;
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto auto;
 align-items: center;
 gap: 14px;
 padding: 12px 18px;
 background: rgba(255, 255, 255, 0.88);
 backdrop-filter: blur(16px);
 -webkit-backdrop-filter: blur(16px);
 border-bottom: 1px solid rgba(230, 233, 242, 0.95);
 box-shadow: 0 8px 28px rgba(15, 23, 42, 0.045);
}

.topbar-main {
 display: flex;
 align-items: center;
 min-width: 0;
 gap: 12px;
}

.header-title-block {
 min-width: 0;
}

.header-title-block h1 {
 margin: 0;
 font-size: 23px;
 line-height: 1.1;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}

.header-title-block h1.dashboard-full-scope-title,
.alpha31-topbar-fixed .header-title-block h1.dashboard-full-scope-title {
 color: #dc2626 !important;
}

.header-title-block p {
 margin: 4px 0 0;
 max-width: 640px;
 color: var(--muted);
 font-size: 13px;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}

.header-shortcuts {
 display: flex;
 align-items: center;
 gap: 9px;
}

.header-icon-btn,
.icon-btn {
 width: 42px;
 height: 42px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border: 1px solid var(--line);
 border-radius: 14px;
 background: #ffffff;
 box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05);
 color: #111827;
 font-size: 19px;
 cursor: pointer;
 transition:
 transform 0.18s ease,
 box-shadow 0.18s ease,
 background 0.18s ease,
 border-color 0.18s ease;
}

.topbar .menu-trigger {
 background: linear-gradient(135deg, #ff8a00 0%, #ffb000 100%);
 border-color: rgba(255, 138, 0, 0.58);
 color: #ffffff;
 box-shadow: 0 10px 24px rgba(255, 138, 0, 0.24);
}

.topbar .menu-trigger:hover,
.topbar .menu-trigger:focus {
 background: linear-gradient(135deg, #ff7a00 0%, #ffa600 100%);
 border-color: rgba(255, 122, 0, 0.72);
 box-shadow: 0 12px 28px rgba(255, 138, 0, 0.32);
}

.header-icon-btn:hover,
.icon-btn:hover,
.header-icon-btn.active {
 transform: translateY(-2px);
 border-color: #fed7aa;
 background: #fff7ed;
 box-shadow: 0 10px 24px rgba(255, 122, 0, 0.14);
}

.userbox {
 display: flex;
 align-items: center;
 gap: 10px;
}

.userbox-text {
 text-align: right;
}

.avatar {
 width: 38px;
 height: 38px;
 display: grid;
 place-items: center;
 border-radius: 50%;
 background: linear-gradient(135deg, #111827, #374151);
 color: #ffffff;
 font-weight: 900;
}

.sidebar {
 width: min(320px, 86vw);
 height: 100vh;
 position: fixed;
 z-index: 90;
 top: 0;
 left: 0;
 overflow: auto;
 padding: 12px 12px 18px;
 background: linear-gradient(180deg, var(--sidebar), var(--sidebar-2));
 color: #ffffff;
 box-shadow: 26px 0 60px rgba(15, 23, 42, 0.32);
 transform: translateX(-105%);
 opacity: 0.8;
 transition:
 transform 0.24s ease,
 opacity 0.24s ease;
}

body.sidebar-open .sidebar {
 transform: translateX(0);
 opacity: 1;
}

.sidebar-backdrop {
 position: fixed;
 inset: 0;
 z-index: 80;
 background: rgba(15, 23, 42, 0.46);
 backdrop-filter: blur(4px);
 -webkit-backdrop-filter: blur(4px);
 opacity: 0;
 pointer-events: none;
 transition: opacity 0.2s ease;
}

body.sidebar-open .sidebar-backdrop {
 opacity: 1;
 pointer-events: auto;
}

.sidebar-head {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 10px;
 padding-bottom: 10px;
}

.brand {
 display: flex;
 align-items: center;
 gap: 9px;
 font-size: 18px;
 font-weight: 900;
}

.brand-mark {
 width: 34px;
 height: 34px;
 display: grid;
 place-items: center;
 flex: 0 0 auto;
 border-radius: 11px;
 background: linear-gradient(135deg, var(--brand), var(--brand-2));
 color: #111111;
}

.brand-name {
 line-height: 1.1;
}

.brand-subtitle {
 margin-top: 2px;
 color: #cbd5e1;
 font-size: 11px;
 font-weight: 600;
}

.sidebar-close {
 background: rgba(255, 255, 255, 0.08);
 color: #ffffff;
 border-color: rgba(255, 255, 255, 0.14);
}

.nav-title {
 margin: 10px 10px 4px;
 color: #9ca3af;
 font-size: 10px;
 text-transform: uppercase;
 letter-spacing: 0.06em;
}

.nav-tree,
.nav-tree ul {
 margin: 0;
 padding: 0;
 list-style: none;
}

.nav-tree li {
 margin: 0;
 padding: 0;
}

.nav-tree .nav-title {
 display: block;
}

.nav a {
 display: flex;
 align-items: center;
 gap: 8px;
 min-height: 40px;
 margin: 2px 0;
 padding: 9px 10px;
 border-radius: 11px;
 color: #e5e7eb;
 transition:
 background 0.18s ease,
 transform 0.18s ease,
 color 0.18s ease;
}

.nav a:hover,
.nav a.active {
 background: rgba(255, 255, 255, 0.11);
 color: #ffffff;
 transform: translateX(3px);
}

.nav .parent {
 width: 100%;
 border: 0;
 display: flex;
 align-items: center;
 gap: 8px;
 min-height: 40px;
 margin: 2px 0;
 padding: 9px 10px;
 border-radius: 11px;
 background: transparent;
 color: #e5e7eb;
 font: inherit;
 font-weight: 850;
 text-align: left;
 cursor: pointer;
 transition:
 background 0.18s ease,
 transform 0.18s ease,
 color 0.18s ease;
}

.nav .parent:hover,
.nav-folder.open > .parent {
 background: rgba(255, 255, 255, 0.11);
 color: #ffffff;
 transform: translateX(3px);
}

.nav-caret {
 width: 8px;
 height: 8px;
 margin-left: auto;
 border-right: 2px solid currentColor;
 border-bottom: 2px solid currentColor;
 transform: rotate(45deg);
 opacity: 0.72;
 transition: transform 0.22s ease;
}

.nav-folder.open > .parent .nav-caret {
 transform: rotate(225deg);
}

.nav .collapse {
 max-height: 0;
 overflow: hidden;
 margin-left: 21px;
 padding-left: 9px;
 border-left: 1px solid rgba(255, 255, 255, 0.18);
 opacity: 0;
 transform: translateY(-4px);
 transition:
 max-height 0.28s ease,
 opacity 0.22s ease,
 transform 0.22s ease;
}

.nav .collapse.in {
 max-height: 420px;
 opacity: 1;
 transform: translateY(0);
}

.nav .collapse a {
 min-height: 34px;
 margin: 1px 0;
 padding: 7px 8px;
 border-radius: 9px;
 font-size: 13px;
}

.nav-icon {
 width: 22px;
 text-align: center;
 flex: 0 0 22px;
 line-height: 1;
}

.nav-icon-wa {
 position: relative;
 width: 26px;
 height: 26px;
 border-radius: 999px;
 display: inline-grid;
 place-items: center;
 background: #22c55e;
 color: #ffffff;
 box-shadow: 0 8px 16px rgba(34, 197, 94, 0.22);
}

.nav-icon-wa::after {
 content: "";
 position: absolute;
 left: 3px;
 bottom: 1px;
 width: 7px;
 height: 7px;
 background: #22c55e;
 border-radius: 0 0 0 7px;
 transform: rotate(-35deg);
}

.nav-icon-wa span {
 position: relative;
 z-index: 1;
 font-size: 9px;
 font-weight: 950;
 letter-spacing: -0.02em;
}

.nav-group {
 margin: 4px 0;
}

.nav-group-label {
 display: flex;
 align-items: center;
 gap: 10px;
 padding: 13px 12px 8px;
 border-radius: 14px 14px 8px 8px;
 color: #e5e7eb;
 font-weight: 800;
}

.nav-group.is-open .nav-group-label {
 background: rgba(255, 255, 255, 0.08);
 color: #fff;
}

.nav-sub {
 margin-left: 25px;
 padding-left: 11px;
 border-left: 1px solid rgba(255, 255, 255, 0.18);
}

.nav-sub a {
 min-height: 38px;
 margin: 2px 0;
 padding: 9px 10px;
 border-radius: 10px;
 font-size: 14px;
}

.nav-sub a:hover,
.nav-sub a.active {
 transform: translateX(2px);
}

.nav-branch {
 width: 26px;
 color: #94a3b8;
 font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
 font-size: 12px;
}

.nav-badge {
 min-width: 22px;
 height: 22px;
 margin-left: auto;
 padding: 0 7px;
 border-radius: 999px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 background: #ef4444;
 color: #fff;
 font-size: 11px;
 font-weight: 950;
 line-height: 1;
 box-shadow: 0 8px 20px rgba(239, 68, 68, 0.28);
}

.user-dropdown-badged-link {
 display: flex !important;
 align-items: center;
 justify-content: space-between;
 gap: 10px;
}

.user-dropdown-badge {
 margin-left: 8px;
 flex: 0 0 auto;
}

.user-dropdown-text-size {
 margin: 8px 0;
 padding: 10px;
 border: 1px solid rgba(148, 163, 184, 0.22);
 border-radius: 14px;
 background: rgba(248, 250, 252, 0.82);
 display: grid;
 gap: 8px;
}

.user-dropdown-text-size > span {
 font-size: 12px;
 font-weight: 900;
 text-transform: uppercase;
 color: var(--muted);
}

.user-dropdown-text-size > div {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 6px;
}

.user-dropdown-text-size button {
 border: 1px solid rgba(148, 163, 184, 0.35);
 border-radius: 11px;
 background: #fff;
 color: var(--text);
 min-height: 34px;
 padding: 0 8px;
 font-size: 12px;
 font-weight: 950;
 cursor: pointer;
 box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

.user-dropdown-text-size button.is-active {
 border-color: rgba(255, 138, 0, 0.6);
 background: linear-gradient(135deg, #ff8a00, #ffbd00);
 color: #111827;
}

.user-dropdown-text-size button.is-saving {
 opacity: 0.72;
 pointer-events: none;
}

.user-dropdown-quick-toggle {
 margin: 8px 0 10px;
 padding: 10px;
 border: 1px solid rgba(148, 163, 184, 0.22);
 border-radius: 14px;
 background: rgba(248, 250, 252, 0.82);
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 10px;
}

.user-dropdown-quick-toggle > span {
 font-size: 12px;
 font-weight: 900;
 text-transform: uppercase;
 color: var(--muted);
}

.user-dropdown-quick-toggle button {
 border: 1px solid rgba(148, 163, 184, 0.35);
 border-radius: 999px;
 background: #e5e7eb;
 color: #475569;
 min-height: 34px;
 padding: 3px 10px 3px 4px;
 display: inline-flex;
 align-items: center;
 gap: 7px;
 font-size: 12px;
 font-weight: 950;
 cursor: pointer;
 box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

.user-dropdown-quick-toggle button.is-active {
 border-color: rgba(34, 197, 94, 0.45);
 background: #dcfce7;
 color: #14532d;
}

.user-dropdown-toggle-knob {
 width: 26px;
 height: 26px;
 border-radius: 999px;
 background: #fff;
 box-shadow: 0 5px 12px rgba(15, 23, 42, 0.12);
 position: relative;
}

.user-dropdown-toggle-knob::after {
 content: "";
 position: absolute;
 inset: 8px;
 border-radius: inherit;
 background: #94a3b8;
}

.user-dropdown-quick-toggle button.is-active .user-dropdown-toggle-knob::after {
 background: #22c55e;
}

.user-dropdown-quick-toggle button.is-saving {
 opacity: 0.72;
 pointer-events: none;
}

body.user-motion-off,
body.user-motion-off *,
body.user-motion-off *::before,
body.user-motion-off *::after {
 scroll-behavior: auto !important;
 animation-duration: 0.001ms !important;
 animation-delay: 0ms !important;
 animation-iteration-count: 1 !important;
 transition-duration: 0.001ms !important;
 transition-delay: 0ms !important;
}

body.user-motion-off .sidebar,
body.user-motion-off .sidebar-backdrop,
body.user-motion-off .nav .collapse,
body.user-motion-off .nav-caret,
body.user-motion-off .orders-list-shell .order-compact-row,
body.user-motion-off .orders-list-shell .order-extended-card,
body.user-motion-off .layout-order .card,
body.user-motion-off .layout-order section,
body.user-motion-off .dashboard-anim-item {
 animation: none !important;
 transition: none !important;
}

.page {
 padding: 18px;
 animation: none;
}

@keyframes pageIn {
 from {
 opacity: 0;
 transform: translateY(6px);
 }

 to {
 opacity: 1;
 transform: none;
 }
}

.grid {
 display: grid;
 gap: 16px;
}

.grid.cols-4 {
 grid-template-columns: repeat(4, minmax(0, 1fr));
}

.grid.cols-3 {
 grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid.cols-4 > *,
.grid.cols-3 > * {
 min-width: 0;
}

.card {
 background: var(--panel);
 border: 1px solid var(--line);
 border-radius: var(--radius);
 box-shadow: var(--shadow-soft);
 overflow: hidden;
 transition:
 transform 0.18s ease,
 box-shadow 0.18s ease,
 border-color 0.18s ease;
}

.card:hover {
 border-color: #dde3ee;
 box-shadow: var(--shadow);
}

.card.pad {
 padding: 18px;
}

.metric {
 font-size: 28px;
 font-weight: 900;
}

.dashboard-page {
 display: grid;
 gap: 16px;
}

.dashboard-metric-grid {
 gap: 12px;
}

.dashboard-metric-card {
 --dashboard-accent: #ff8a00;
 position: relative;
 display: flex;
 align-items: center;
 gap: 12px;
 min-height: 112px;
 border-left: 5px solid var(--dashboard-accent);
 color: inherit;
 text-decoration: none;
 cursor: pointer;
 background: linear-gradient(
 90deg,
 color-mix(in srgb, var(--dashboard-accent) 8%, #ffffff) 0%,
 #ffffff 58%
 );
}

.dashboard-metric-card.is-orange {
 --dashboard-accent: #ff8a00;
}

.dashboard-metric-card.is-blue {
 --dashboard-accent: #2563eb;
}

.dashboard-metric-card.is-green {
 --dashboard-accent: #16a34a;
}

.dashboard-metric-card.is-violet {
 --dashboard-accent: #7c3aed;
}

.dashboard-metric-card:hover,
.dashboard-metric-card:focus {
 border-color: color-mix(in srgb, var(--dashboard-accent) 55%, #ffffff);
 transform: translateY(-1px);
 box-shadow: 0 16px 34px rgba(15, 23, 42, 0.1);
 outline: none;
}

.dashboard-metric-icon {
 width: 46px;
 height: 46px;
 display: grid;
 place-items: center;
 flex: 0 0 auto;
 border-radius: 15px;
 background: color-mix(in srgb, var(--dashboard-accent) 14%, #ffffff);
 box-shadow: inset 0 0 0 1px
 color-mix(in srgb, var(--dashboard-accent) 18%, #ffffff);
 font-size: 22px;
}

.dashboard-metric-card .muted {
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
 text-transform: uppercase;
}

.dashboard-metric-card .metric {
 margin-top: 3px;
 color: #0f172a;
 line-height: 1.05;
}

.dashboard-card-subvalue {
 display: inline-flex;
 align-items: center;
 gap: 5px;
 margin-top: 6px;
 color: #64748b;
 font-size: 12px;
 font-weight: 800;
}

.dashboard-trend {
 display: inline-flex;
 align-items: center;
 gap: 4px;
 border-radius: 999px;
 padding: 3px 7px;
 font-size: 12px;
 font-weight: 950;
}

.dashboard-trend.is-up {
 background: #dcfce7;
 color: #166534;
}

.dashboard-trend.is-down {
 background: #ffedd5;
 color: #9a3412;
}

.dashboard-status-card {
 overflow: hidden;
}

.dashboard-card-toolbar {
 background: linear-gradient(90deg, #ffffff 0%, #f8fafc 100%);
}

.dashboard-card-toolbar p {
 margin: 4px 0 0;
 color: #64748b;
 font-size: 13px;
 font-weight: 700;
}

.dashboard-status-table th {
 color: #64748b;
 font-size: 12px;
 text-transform: uppercase;
}

.dashboard-status-row {
 cursor: pointer;
 transition: background 0.15s ease;
}

.dashboard-status-row:hover {
 background: #fff7ed !important;
}

.dashboard-status-row td:last-child {
 text-align: right;
}

.muted {
 color: var(--muted);
}

.small {
 font-size: 12px;
}

.text-right {
 text-align: right;
}

.pill {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 max-width: 100%;
 border-radius: 999px;
 padding: 6px 10px;
 background: #eef2ff;
 color: #3730a3;
 font-size: 12px;
 font-weight: 800;
 line-height: 1.15;
}

.pill.good {
 background: #dcfce7;
 color: #166534;
}

.pill.warn {
 background: #fef3c7;
 color: #92400e;
}

.pill.bad {
 background: #fee2e2;
 color: #991b1b;
}

.btn {
 min-height: 42px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 8px;
 border: 0;
 border-radius: 13px;
 padding: 10px 14px;
 font-weight: 900;
 cursor: pointer;
 transition:
 transform 0.18s ease,
 box-shadow 0.18s ease,
 filter 0.18s ease;
}

.btn:hover {
 transform: translateY(-1px);
 box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

.btn.primary {
 background: linear-gradient(135deg, var(--brand), var(--brand-2));
 color: #111111;
}

.btn.ghost {
 background: #f3f4f6;
 color: #111827;
}

.btn.good {
 background: #dcfce7;
 color: #166534;
}

.btn.warn {
 background: #fef3c7;
 color: #92400e;
}

.btn.bad {
 background: #fee2e2;
 color: #991b1b;
}

.btn.blue {
 background: #dbeafe;
 color: #1e40af;
}

.btn-row,
.page-actions {
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
}

.page-actions {
 position: sticky;
 top: calc(var(--topbar-height) + 8px);
 z-index: 30;
 margin-bottom: 16px;
 padding: 10px;
 border: 1px solid rgba(230, 233, 242, 0.9);
 border-radius: 18px;
 background: rgba(255, 255, 255, 0.86);
 backdrop-filter: blur(14px);
 -webkit-backdrop-filter: blur(14px);
 box-shadow: 0 8px 22px rgba(15, 23, 42, 0.045);
}

.table-wrap {
 overflow: hidden;
}

.table {
 width: 100%;
 border-collapse: separate;
 border-spacing: 0;
}

.table th,
.table td {
 padding: 13px 14px;
 border-bottom: 1px solid var(--line);
 text-align: left;
 vertical-align: middle;
}

.table th {
 background: #fafafa;
 color: #6b7280;
 font-size: 12px;
 text-transform: uppercase;
}

.order-row {
 cursor: pointer;
 transition:
 background 0.15s ease,
 color 0.15s ease;
}

.order-compact-row.order-is-inhouse,
.order-extended-card.order-is-inhouse {
 background: rgb(244, 255, 244) !important;
 background-color: rgb(244, 255, 244) !important;
}

.orders-table-alpha36 .order-row.order-is-inhouse > td {
 background: rgb(244, 255, 244) !important;
 background-color: rgb(244, 255, 244) !important;
}

.order-row:hover td {
 background: #fff7ed;
 color: #1e73be;
}

.action-cell {
 opacity: 0.25;
 transition:
 opacity 0.15s ease,
 transform 0.15s ease;
}

.order-row:hover .action-cell {
 opacity: 1;
 transform: translateX(4px);
}

.open-order-icon {
 font-size: 24px;
 font-weight: 900;
}

.orders-mobile-list {
 display: none;
}

.order-mobile-card {
 display: grid;
 gap: 12px;
 margin-bottom: 12px;
 padding: 14px;
 border: 1px solid var(--line);
 border-radius: 20px;
 background: rgba(255, 255, 255, 0.94);
 box-shadow: var(--shadow-soft);
 cursor: pointer;
 transition:
 transform 0.18s ease,
 box-shadow 0.18s ease,
 border-color 0.18s ease;
}

.order-mobile-card:active,
.order-mobile-card:hover {
 transform: scale(0.992);
 border-color: #fed7aa;
 box-shadow: 0 12px 30px rgba(255, 122, 0, 0.11);
}

.order-mobile-top {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 10px;
}

.order-mobile-top .pill {
 max-width: 52%;
 justify-content: center;
 text-align: center;
}

.order-number {
 font-size: 17px;
}

.order-mobile-client {
 padding: 10px 0;
 border-top: 1px dashed var(--line);
 border-bottom: 1px dashed var(--line);
}

.order-mobile-meta {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 10px;
}

.order-mobile-meta > div {
 min-width: 0;
 padding: 10px;
 border-radius: 14px;
 background: #f9fafb;
}

.order-mobile-meta strong {
 display: block;
 margin-top: 4px;
 word-break: break-word;
}

.order-mobile-open {
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding-top: 2px;
 color: #1e40af;
 font-weight: 900;
}

.order-mobile-open span {
 font-size: 24px;
 line-height: 1;
}

.empty-state {
 padding: 32px 18px;
 border: 1px dashed var(--line);
 border-radius: 22px;
 background: rgba(255, 255, 255, 0.78);
 text-align: center;
}

.empty-icon {
 margin-bottom: 8px;
 font-size: 36px;
}

.status-panel {
 position: sticky;
 top: calc(var(--topbar-height) + 16px);
}

.status-big {
 display: grid;
 gap: 10px;
}

.status-action {
 width: 100%;
 display: flex;
 align-items: center;
 justify-content: space-between;
 border: 1px solid var(--line);
 border-radius: 14px;
 padding: 13px 14px;
 background: #ffffff;
 cursor: pointer;
 transition:
 transform 0.16s ease,
 border-color 0.16s ease,
 background 0.16s ease;
}

.status-action:hover,
.status-action:focus {
 border-color: #fed7aa;
 background: #fff7ed;
 transform: translateY(-1px);
}

.status-action.recommended {
 border-color: #fed7aa;
 background: #fff7ed;
}

.percent {
 color: #6b7280;
 font-size: 12px;
}

.layout-order {
 display: grid;
 grid-template-columns: minmax(0, 1fr) 340px;
 gap: 16px;
}

.form {
 display: grid;
 gap: 12px;
}

.field label {
 display: block;
 margin-bottom: 6px;
 color: #6b7280;
 font-size: 12px;
 font-weight: 900;
}

.input,
select,
textarea {
 width: 100%;
 border: 1px solid var(--line);
 border-radius: 13px;
 padding: 11px;
 background: #ffffff;
 font: inherit;
 transition:
 border-color 0.16s ease,
 box-shadow 0.16s ease,
 background 0.16s ease;
}

.input:focus,
select:focus,
textarea:focus {
 outline: 0;
 border-color: #fb923c;
 background: #fffdf9;
 box-shadow: 0 0 0 4px rgba(251, 146, 60, 0.16);
}

textarea {
 min-height: 88px;
}

.login-wrap {
 min-height: 100vh;
 display: grid;
 place-items: center;
 padding: 18px;
 background: radial-gradient(
 circle at top left,
 #fff3e0,
 #f4f6fb 45%,
 #e0e7ff
 );
}

.login-card {
 width: min(430px, 92vw);
 padding: 26px;
 border: 1px solid var(--line);
 border-radius: 24px;
 background: #ffffff;
 box-shadow: 0 20px 60px rgba(15, 23, 42, 0.12);
}

.passkey-login-wrap {
 place-items: center;
 background:
 radial-gradient(
 circle at 15% 12%,
 rgba(255, 138, 0, 0.18),
 transparent 28%
 ),
 radial-gradient(
 circle at 85% 18%,
 rgba(37, 99, 235, 0.13),
 transparent 30%
 ),
 linear-gradient(135deg, #f8fafc, #eef2ff 56%, #fff7ed);
}

.login-shell {
 display: grid;
 grid-template-columns: minmax(0, 0.95fr) minmax(360px, 440px);
 gap: 22px;
 width: min(980px, 96vw);
 align-items: stretch;
}

.login-brand-panel,
.passkey-login-card {
 border: 1px solid rgba(226, 232, 240, 0.92);
 border-radius: 28px;
 background: rgba(255, 255, 255, 0.88);
 box-shadow: 0 28px 90px rgba(15, 23, 42, 0.14);
}

.login-brand-panel {
 display: flex;
 flex-direction: column;
 justify-content: flex-end;
 min-height: 520px;
 padding: 34px;
 overflow: hidden;
 background:
 linear-gradient(135deg, rgba(15, 23, 42, 0.96), rgba(30, 41, 59, 0.94)),
 radial-gradient(circle at 18% 20%, rgba(255, 138, 0, 0.36), transparent 35%);
 color: #ffffff;
}

.login-brand-badge {
 display: grid;
 place-items: center;
 width: 68px;
 height: 68px;
 margin-bottom: auto;
 border-radius: 22px;
 background: #ff8a00;
 color: #ffffff;
 font-size: 24px;
 font-weight: 950;
 box-shadow: 0 16px 36px rgba(255, 138, 0, 0.34);
}

.login-brand-panel h1 {
 margin: 0 0 10px;
 font-size: 52px;
 letter-spacing: 0;
}

.login-brand-panel p {
 max-width: 420px;
 margin: 0 0 28px;
 color: #cbd5e1;
 font-size: 18px;
 line-height: 1.45;
}

.login-security-points {
 display: grid;
 gap: 10px;
}

.login-security-points span {
 padding: 12px 14px;
 border: 1px solid rgba(255, 255, 255, 0.12);
 border-radius: 16px;
 background: rgba(255, 255, 255, 0.07);
 color: #e2e8f0;
 font-weight: 750;
}

.login-security-points b {
 color: #ffffff;
}

.passkey-login-card {
 width: auto;
 padding: 30px;
}

.login-card-head {
 margin-bottom: 20px;
}

.login-kicker {
 display: inline-flex;
 margin-bottom: 8px;
 color: #ea580c;
 font-size: 13px;
 font-weight: 950;
 text-transform: uppercase;
}

.login-card-head h2 {
 margin: 0;
 color: #0f172a;
 font-size: 34px;
}

.login-card-head p {
 margin: 8px 0 0;
 color: #64748b;
 font-weight: 750;
}

.passkey-login-btn {
 display: flex;
 align-items: center;
 width: 100%;
 gap: 14px;
 min-height: 74px;
 padding: 14px 16px;
 border: 1px solid #fed7aa;
 border-radius: 20px;
 background:
 radial-gradient(
 circle at top left,
 rgba(255, 138, 0, 0.18),
 transparent 34%
 ),
 #fff7ed;
 color: #111827;
 cursor: pointer;
 text-align: left;
 box-shadow: 0 12px 30px rgba(255, 138, 0, 0.12);
}

.passkey-login-btn:disabled {
 cursor: wait;
 opacity: 0.72;
}

.passkey-login-icon {
 display: grid;
 place-items: center;
 width: 48px;
 height: 48px;
 border-radius: 16px;
 background: #ff8a00;
 font-size: 24px;
}

.passkey-login-btn strong,
.passkey-login-btn small {
 display: block;
}

.passkey-login-btn strong {
 font-size: 18px;
 font-weight: 950;
}

.passkey-login-btn small {
 margin-top: 3px;
 color: #64748b;
 font-weight: 800;
}

.passkey-login-status {
 margin-top: 12px;
 padding: 11px 12px;
 border-radius: 14px;
 font-weight: 850;
}

.passkey-login-status.is-good {
 background: #dcfce7;
 color: #166534;
}

.passkey-login-status.is-bad {
 background: #fee2e2;
 color: #991b1b;
}

.login-divider {
 display: flex;
 align-items: center;
 gap: 12px;
 margin: 22px 0;
 color: #94a3b8;
 font-weight: 900;
}

.login-divider::before,
.login-divider::after {
 content: "";
 height: 1px;
 flex: 1 1 auto;
 background: #e2e8f0;
}

.login-submit-btn {
 width: 100%;
 justify-content: center;
 min-height: 48px;
}

.account-passkey-card {
 grid-column: 1 / -1;
}

.account-passkey-head {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 16px;
 margin-bottom: 16px;
}

.account-passkey-head h3 {
 margin: 0 0 6px;
}

.account-passkey-icon {
 display: grid;
 place-items: center;
 width: 54px;
 height: 54px;
 border-radius: 18px;
 background: #fff7ed;
 font-size: 26px;
}

.account-passkey-add {
 min-height: 46px;
}

.account-passkey-list {
 display: grid;
 gap: 10px;
 margin-top: 16px;
}

.account-passkey-row {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 padding: 12px;
 border: 1px solid #e2e8f0;
 border-radius: 16px;
 background: #f8fafc;
}

.account-passkey-row strong,
.account-passkey-row span {
 display: block;
}

.account-passkey-row span {
 margin-top: 3px;
 color: #64748b;
 font-size: 13px;
 font-weight: 750;
}

.account-force-password-alert {
 grid-column: 1 / -1;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 14px;
 border-color: #fed7aa;
 background:
 radial-gradient(
 circle at top left,
 rgba(255, 138, 0, 0.16),
 transparent 34%
 ),
 #fff7ed;
 color: #7c2d12;
}

.account-force-password-alert strong,
.account-force-password-alert span {
 display: block;
}

.account-force-password-alert strong {
 color: #111827;
 font-size: 18px;
}

.account-force-password-alert span {
 color: #9a3412;
 font-weight: 800;
}

.post-login-passkey-modal[hidden] {
 display: none;
}

.post-login-passkey-modal {
 position: fixed;
 inset: 0;
 z-index: 12000;
 display: flex;
 align-items: flex-start;
 justify-content: center;
 padding: max(18px, calc(env(safe-area-inset-top) + 18px)) 18px 18px;
 background: rgba(15, 23, 42, 0.62);
 opacity: 0;
 overflow-y: auto;
 transition: opacity 0.18s ease;
}

.post-login-passkey-modal.is-open {
 opacity: 1;
}

.post-login-passkey-card {
 position: relative;
 width: min(520px, 100%);
 max-height: calc(100dvh - 36px);
 overflow-y: auto;
 padding: 28px;
 border: 1px solid rgba(226, 232, 240, 0.96);
 border-radius: 28px;
 background:
 radial-gradient(
 circle at top left,
 rgba(255, 138, 0, 0.14),
 transparent 34%
 ),
 #ffffff;
 box-shadow: 0 30px 90px rgba(15, 23, 42, 0.28);
 transform: translateY(12px) scale(0.98);
 transition: transform 0.18s ease;
}

.post-login-passkey-modal.is-open .post-login-passkey-card {
 transform: translateY(0) scale(1);
}

.post-login-passkey-close {
 position: absolute;
 top: 14px;
 right: 14px;
 display: grid;
 place-items: center;
 width: 42px;
 height: 42px;
 border: 1px solid #e2e8f0;
 border-radius: 16px;
 background: #ffffff;
 color: #0f172a;
 font-size: 26px;
 font-weight: 900;
 cursor: pointer;
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}

.post-login-passkey-icon {
 display: grid;
 place-items: center;
 width: 66px;
 height: 66px;
 margin-bottom: 16px;
 border-radius: 22px;
 background: linear-gradient(135deg, #ff8a00, #fbbf24);
 color: #111827;
 font-size: 14px;
 font-weight: 950;
 box-shadow: 0 18px 36px rgba(255, 138, 0, 0.24);
}

.post-login-passkey-card > strong {
 display: block;
 padding-right: 46px;
 color: #0f172a;
 font-size: 28px;
 line-height: 1.12;
}

.post-login-passkey-card > p {
 margin: 12px 0 20px;
 color: #64748b;
 font-size: 16px;
 font-weight: 750;
 line-height: 1.45;
}

.post-login-passkey-actions {
 display: grid;
 grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
 gap: 10px;
}

.post-login-passkey-actions .btn {
 min-height: 48px;
 justify-content: center;
}

body.post-login-passkey-open {
 overflow: hidden;
}

@media (max-width: 760px) {
 .login-shell {
 grid-template-columns: 1fr;
 }

 .login-brand-panel {
 display: none;
 }

 .login-brand-panel h1 {
 font-size: 38px;
 }

 .passkey-login-card {
 padding: 22px;
 }

 .login-card-head h2 {
 font-size: 28px;
 }

 .account-passkey-row {
 align-items: stretch;
 flex-direction: column;
 }

 .account-force-password-alert {
 align-items: flex-start;
 flex-direction: column;
 }

 .post-login-passkey-modal {
 align-items: flex-start;
 padding: max(10px, calc(env(safe-area-inset-top) + 10px)) 10px 10px;
 }

 .post-login-passkey-card {
 max-height: calc(100dvh - 20px - env(safe-area-inset-top));
 padding: 24px;
 border-radius: 26px;
 }

 .post-login-passkey-card > strong {
 font-size: 24px;
 }

 .post-login-passkey-actions {
 grid-template-columns: 1fr;
 }
}

.section-head,
.card-toolbar {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 12px;
 padding: 16px 18px;
 border-bottom: 1px solid var(--line);
}

.card-toolbar h3,
.section-head h3 {
 margin: 0;
}

.section-head p {
 margin: 4px 0 0;
}

.totals-row strong {
 font-size: 20px;
}

.item-add-grid {
 display: grid;
 grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
 gap: 12px;
 align-items: end;
}

.item-add-grid .note-field {
 grid-column: 1 / 5;
}

.item-add-grid .add-btn {
 height: 44px;
 justify-content: center;
}

.calc-preview {
 padding: 11px 12px;
 border: 1px solid #fed7aa;
 border-radius: 14px;
 background: #fff7ed;
}

.calc-preview strong {
 font-size: 18px;
}

.items-table th {
 white-space: nowrap;
}

.item-edit-cell {
 padding: 0 !important;
 background: #ffffff !important;
}

.item-row-form {
 padding: 12px 14px;
 border-bottom: 1px solid var(--line);
}

.item-main {
 display: grid;
 grid-template-columns: 1.7fr 1.45fr 1.5fr 0.85fr 1fr auto;
 gap: 10px;
 align-items: center;
}

.input.compact,
.compact-select {
 padding: 9px 10px;
 border-radius: 10px;
}

.dims-inline {
 display: grid;
 grid-template-columns: 1fr auto 1fr 1fr;
 align-items: center;
 gap: 6px;
}

.qr-cell {
 padding: 9px;
 border: 1px dashed var(--line);
 border-radius: 10px;
 background: #f9fafb;
 color: #374151;
 font-size: 12px;
 font-weight: 900;
}

.no-wrap {
 flex-wrap: nowrap;
}

.delete-item-form {
 display: flex;
 justify-content: flex-end;
 padding: 0 14px 12px;
 background: #ffffff;
}

.status-panel optgroup {
 font-weight: 900;
}

.status-panel option {
 font-weight: 500;
}

.order-head-card {
 background: linear-gradient(180deg, #ffffff, #fff7ed);
}

@media (min-width: 1101px) {
 .main {
 padding-left: 0;
 }
}

@media (max-width: 1100px) {
 :root {
 --topbar-height: 68px;
 }

 .grid.cols-4,
 .grid.cols-3,
 .layout-order {
 grid-template-columns: 1fr;
 }

 .status-panel {
 position: static;
 }

 .item-add-grid,
 .item-main {
 grid-template-columns: 1fr;
 }

 .item-add-grid .note-field {
 grid-column: auto;
 }

 .dims-inline {
 grid-template-columns: 1fr auto 1fr 1fr;
 }

 .delete-item-form {
 justify-content: stretch;
 }

 .delete-item-form .btn {
 width: 100%;
 }

 .table.items-table {
 min-width: 0;
 }

 .items-table thead {
 display: none;
 }

 .items-table,
 .items-table tbody,
 .items-table tr,
 .items-table td {
 display: block;
 width: 100%;
 }

 .item-edit-cell {
 border-bottom: 10px solid var(--bg) !important;
 }

 .qr-cell {
 word-break: break-all;
 }
}

@media (max-width: 760px) {
 :root {
 --topbar-height: 66px;
 }

 body {
 background: #f6f7fb;
 }

 .topbar {
 grid-template-columns: minmax(0, 1fr) auto;
 gap: 10px;
 padding: 9px 10px;
 }

 .header-title-block h1 {
 font-size: 18px;
 }

 .header-title-block p {
 display: none;
 }

 .header-shortcuts {
 order: 3;
 grid-column: 1 / -1;
 width: 100%;
 padding-top: 8px;
 border-top: 1px solid rgba(230, 233, 242, 0.8);
 overflow-x: auto;
 scrollbar-width: none;
 }

 .header-shortcuts::-webkit-scrollbar {
 display: none;
 }

 .header-icon-btn {
 width: 48px;
 height: 44px;
 flex: 0 0 auto;
 }

 .userbox {
 justify-content: flex-end;
 }

 .userbox-text {
 display: none;
 }

 .avatar {
 width: 36px;
 height: 36px;
 }

 .page {
 padding: 12px;
 }

 .page-actions {
 top: 112px;
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 8px;
 padding: 8px;
 }

 .page-actions .btn:first-child {
 grid-column: 1 / -1;
 }

 .btn {
 width: 100%;
 min-height: 44px;
 padding: 10px 12px;
 font-size: 14px;
 }

 .orders-desktop-table {
 display: none;
 }

 .orders-mobile-list {
 display: block;
 }

 .card.pad {
 padding: 14px;
 }

 .card {
 border-radius: 16px;
 }

 .metric {
 font-size: 24px;
 }

 .grid {
 gap: 12px;
 }

 .section-head,
 .card-toolbar {
 padding: 14px;
 }
}

@media (max-width: 390px) {
 .order-mobile-meta {
 grid-template-columns: 1fr;
 }

 .order-mobile-top {
 display: grid;
 }

 .order-mobile-top .pill {
 max-width: none;
 justify-content: flex-start;
 }
}

/* Sectiune 4 - compact products + edit modal */

body.modal-open {
 overflow: hidden;
}

.products-compact-card {
 overflow: hidden;
}

.products-toolbar {
 align-items: center;
}

.product-summary-list {
 display: grid;
 gap: 0;
}

.product-summary-row {
 display: grid;
 grid-template-columns:
 minmax(0, 1.6fr) minmax(120px, 0.9fr) minmax(150px, 0.9fr)
 auto;
 align-items: center;
 gap: 12px;
 padding: 13px 18px;
 border-bottom: 1px solid var(--line);
 background: #ffffff;
 transition:
 background 0.18s ease,
 transform 0.18s ease,
 box-shadow 0.18s ease;
}

.product-summary-row:last-child {
 border-bottom: 0;
}

.product-summary-row:hover {
 background: #fffaf4;
 transform: translateY(-1px);
 box-shadow: inset 4px 0 0 rgba(255, 122, 0, 0.55);
}

.product-summary-main {
 min-width: 0;
}

.product-summary-title {
 font-weight: 900;
 line-height: 1.25;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}

.product-summary-meta {
 display: flex;
 flex-wrap: wrap;
 gap: 6px;
 margin-top: 5px;
 color: var(--muted);
 font-size: 12px;
}

.product-summary-meta span {
 display: inline-flex;
 align-items: center;
 max-width: 180px;
 padding: 3px 7px;
 border-radius: 999px;
 background: #f3f4f6;
 overflow: hidden;
 white-space: nowrap;
 text-overflow: ellipsis;
}

.product-summary-measure {
 display: grid;
 gap: 4px;
 font-size: 13px;
}

.product-summary-measure span {
 color: var(--muted);
 font-size: 12px;
}

.product-summary-status {
 display: grid;
 gap: 6px;
 justify-items: start;
}

.qr-mini {
 max-width: 190px;
 padding: 4px 7px;
 border: 1px dashed var(--line);
 border-radius: 8px;
 background: #f9fafb;
 color: #374151;
 font-size: 11px;
 font-weight: 900;
 overflow: hidden;
 white-space: nowrap;
 text-overflow: ellipsis;
}

.product-summary-total {
 text-align: right;
 white-space: nowrap;
}

.empty-products-box {
 display: grid;
 justify-items: center;
 gap: 12px;
 padding: 26px 18px;
}

.modal-backdrop {
 position: fixed;
 inset: 0;
 z-index: 120;
 display: none;
 align-items: center;
 justify-content: center;
 padding: 18px;
 background: rgba(15, 23, 42, 0.56);
 backdrop-filter: blur(7px);
 -webkit-backdrop-filter: blur(7px);
 opacity: 0;
 transition: opacity 0.18s ease;
}

.modal-backdrop.is-open {
 display: flex;
 opacity: 1;
}

.products-modal-shell {
 width: min(1180px, 100%);
 max-height: min(92vh, 980px);
 transform: scale(0.94) translateY(12px);
 opacity: 0;
 transition:
 transform 0.22s ease,
 opacity 0.22s ease;
}

.modal-backdrop.is-open .products-modal-shell {
 transform: scale(1) translateY(0);
 opacity: 1;
}

.products-modal {
 display: flex;
 flex-direction: column;
 max-height: min(92vh, 980px);
 overflow: hidden;
 border: 1px solid rgba(255, 255, 255, 0.5);
 border-radius: 24px;
 background: var(--bg);
 box-shadow: 0 28px 90px rgba(15, 23, 42, 0.35);
}

.products-modal-header {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 14px;
 padding: 18px 20px;
 border-bottom: 1px solid var(--line);
 background: rgba(255, 255, 255, 0.92);
 backdrop-filter: blur(12px);
 -webkit-backdrop-filter: blur(12px);
}

.products-modal-header h3 {
 margin: 0;
}

.products-modal-header p {
 margin: 5px 0 0;
}

.products-modal-body {
 display: grid;
 gap: 14px;
 padding: 16px;
 overflow: auto;
}

.products-modal-add-card,
.products-modal-edit-card {
 box-shadow: var(--shadow-soft);
}

.clean-section-head {
 margin: -18px -18px 16px;
}

.soft-separator {
 border: 0;
 border-top: 1px solid var(--line);
 margin: 16px 0;
}

@media (max-width: 900px) {
 .product-summary-row {
 grid-template-columns: minmax(0, 1fr) auto;
 align-items: start;
 gap: 10px;
 }

 .product-summary-measure,
 .product-summary-status {
 grid-column: 1 / -1;
 }

 .product-summary-total {
 grid-column: 2;
 grid-row: 1;
 align-self: start;
 }

 .products-modal-body {
 padding: 12px;
 }

 .products-modal {
 border-radius: 20px;
 }
}

@media (max-width: 760px) {
 .products-toolbar {
 flex-direction: row;
 align-items: center;
 }

 .products-toolbar .btn {
 width: auto;
 min-height: 40px;
 padding-inline: 12px;
 }

 .product-summary-row {
 padding: 12px 14px;
 }

 .product-summary-title {
 white-space: normal;
 }

 .product-summary-meta span {
 max-width: 100%;
 }

 .product-summary-total strong {
 font-size: 15px;
 }

 .modal-backdrop {
 align-items: flex-end;
 padding: 0;
 }

 .products-modal-shell {
 width: 100%;
 max-height: 94vh;
 transform: translateY(100%);
 }

 .modal-backdrop.is-open .products-modal-shell {
 transform: translateY(0);
 }

 .products-modal {
 max-height: 94vh;
 border-radius: 22px 22px 0 0;
 }

 .products-modal-header {
 position: sticky;
 top: 0;
 z-index: 2;
 padding: 14px;
 }

 .products-modal-header p {
 display: none;
 }

 .products-modal-body {
 padding: 10px;
 }

 .clean-section-head {
 margin: -14px -14px 14px;
 padding: 14px;
 }

 .history-table {
 min-width: 560px;
 }
}

/* Sectiune 5 - order hero compact mobile-first */
.order-hero-card {
 overflow: hidden;
}

.order-hero-top {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 16px;
 margin-bottom: 16px;
}

.order-identity {
 min-width: 0;
}

.order-number-line {
 display: flex;
 align-items: center;
 flex-wrap: wrap;
 gap: 8px;
 margin-bottom: 8px;
}

.order-number-badge {
 display: inline-flex;
 align-items: center;
 min-height: 30px;
 padding: 5px 11px;
 border-radius: 999px;
 background: #0f172a;
 color: #ffffff;
 font-weight: 800;
 letter-spacing: 0.2px;
}

.order-contact-line {
 display: flex;
 flex-wrap: wrap;
 gap: 8px;
 margin-top: 8px;
}

.contact-chip {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-height: 34px;
 padding: 7px 11px;
 border-radius: 12px;
 background: #eef2ff;
 color: #1e3a8a;
 font-weight: 700;
 text-decoration: none;
 transition:
 transform 0.18s ease,
 background 0.18s ease,
 box-shadow 0.18s ease;
}

.contact-chip:hover {
 transform: translateY(-1px);
 background: #dbeafe;
 box-shadow: 0 8px 18px rgba(30, 64, 175, 0.12);
}

.contact-chip.whatsapp {
 background: #dcfce7;
 color: #166534;
}

.muted-chip {
 background: #f1f5f9;
 color: #64748b;
}

.order-quick-actions {
 display: flex;
 flex-wrap: wrap;
 justify-content: flex-end;
 gap: 8px;
}

.quick-action-btn {
 display: inline-flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 gap: 1px;
 text-align: center;
 text-decoration: none;
 min-width: 72px;
 min-height: 54px;
 border: 1px solid #e2e8f0;
 border-radius: 16px;
 background: #ffffff;
 color: #0f172a;
 font-weight: 800;
 cursor: pointer;
 box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
 transition:
 transform 0.18s ease,
 box-shadow 0.18s ease,
 border-color 0.18s ease;
}

.quick-action-btn span {
 display: block;
 margin-top: 2px;
 font-size: 11px;
}

.quick-action-btn:hover,
.quick-action-btn:focus {
 transform: translateY(-2px) scale(1.02);
 border-color: #93c5fd;
 box-shadow: 0 12px 28px rgba(37, 99, 235, 0.14);
 outline: none;
}

.order-info-grid {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 10px;
}

.order-info-tile {
 display: flex;
 align-items: flex-start;
 gap: 10px;
 min-width: 0;
 padding: 13px;
 border: 1px solid #e5e7eb;
 border-radius: 18px;
 background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
 transition:
 transform 0.18s ease,
 box-shadow 0.18s ease,
 border-color 0.18s ease;
}

.order-info-tile:hover,
.order-info-tile:focus-within {
 transform: translateY(-1px);
 border-color: #bfdbfe;
 box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
}

.order-info-tile.important {
 background: linear-gradient(135deg, #fff7ed 0%, #ffffff 70%);
 border-color: #fed7aa;
}

.tile-icon {
 flex: 0 0 auto;
 width: 34px;
 height: 34px;
 display: flex;
 align-items: center;
 justify-content: center;
 border-radius: 13px;
 background: #eff6ff;
}

.order-info-tile span {
 display: block;
 color: #64748b;
 font-size: 12px;
 font-weight: 800;
 text-transform: uppercase;
 letter-spacing: 0.02em;
}

.order-info-tile strong {
 display: block;
 margin-top: 3px;
 color: #0f172a;
 font-size: 15px;
 line-height: 1.25;
 overflow-wrap: anywhere;
}

.order-info-tile small {
 display: block;
 margin-top: 3px;
 color: #64748b;
 line-height: 1.35;
 overflow-wrap: anywhere;
}

.note-tile {
 grid-column: span 1;
}

.order-hero-card-test-2 {
 padding: 18px;
 border-color: rgba(15, 23, 42, 0.1);
 background:
 linear-gradient(135deg, rgba(15, 23, 42, 0.04), transparent 32%),
 linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.order-hero-card-test-2 .order-hero-top {
 margin: 0 0 14px;
 padding: 12px;
 border-radius: 22px;
 background: #0f172a;
 color: #fff;
 box-shadow: 0 18px 42px rgba(15, 23, 42, 0.18);
}

.order-hero-card-test-2 .order-number-badge {
 background: #fff;
 color: #0f172a;
}

.order-hero-card-test-2 .order-mode-pill {
 background: rgba(255, 255, 255, 0.14);
 color: #fff;
}

.order-hero-card-test-2 .order-identity h2 {
 color: #fff;
 margin-bottom: 6px;
}

.order-hero-card-test-2 .contact-chip {
 background: rgba(255, 255, 255, 0.12);
 color: #fff;
 border: 1px solid rgba(255, 255, 255, 0.16);
}

.order-hero-card-test-2 .contact-chip.whatsapp {
 background: #22c55e;
 color: #052e16;
}

.order-hero-card-test-2 .quick-action-btn {
 background: rgba(255, 255, 255, 0.98);
}

.order-hero-card-test-2 .order-info-grid,
.order-hero-card-test-2 > .order-location-map {
 display: none;
}

.order-command-board {
 display: grid;
 grid-template-columns: 1.15fr 1fr 1fr;
 grid-template-areas:
 "status progress money"
 "estimate client notes"
 "map map map";
 gap: 12px;
}

.order-command-board > section {
 min-width: 0;
 border: 1px solid rgba(226, 232, 240, 0.95);
 border-radius: 20px;
 background: rgba(255, 255, 255, 0.92);
 box-shadow: 0 12px 30px rgba(15, 23, 42, 0.07);
}

.command-status-panel {
 position: relative;
 grid-area: status;
 padding: 18px;
 background: linear-gradient(
 135deg,
 color-mix(in srgb, var(--status-parent-color, #fff7ed) var(--status-surface-color-weight, 54%), #ffffff),
 color-mix(in srgb, var(--status-accent-color, var(--status-parent-color, #fff7ed)) var(--status-surface-color-weight, 54%), #ffffff)
 ) !important;
 border-color: color-mix(in srgb, var(--status-accent-color, #fed7aa) var(--status-surface-color-weight, 54%), #ffffff) !important;
 color: var(--status-text-color, #0f172a);
 text-shadow: var(--status-text-glow, 0 1px 8px rgba(255, 255, 255, 0.82));
}

.command-status-panel.is-clickable {
 cursor: pointer;
 overflow: hidden;
 border-right-width: 1px !important;
 transition:
 transform 0.18s ease,
 box-shadow 0.18s ease,
 border-color 0.18s ease;
}

.command-edge-action {
 position: relative;
 overflow: hidden;
 padding-right: 18px !important;
 border-right-width: 1px !important;
}

.command-edge-action::before {
 content: attr(data-edge-icon);
 position: absolute;
 right: 2px;
 bottom: 2px;
 z-index: 2;
 width: 24px;
 height: 24px;
 display: grid;
 place-items: center;
 border-radius: 50%;
 background: rgba(255, 255, 255, 0.58);
 color: rgba(15, 23, 42, 0.78);
 font-size: 17px;
 font-weight: 950;
 line-height: 1;
 text-shadow: 0 1px 0 rgba(255, 255, 255, 0.85);
 box-shadow: 0 5px 12px rgba(15, 23, 42, 0.08);
 opacity: 0.86;
 pointer-events: none;
 transition:
 opacity 0.18s ease,
 transform 0.18s ease,
 background 0.18s ease;
}

.command-edge-action[data-edge-label="Status Rapid"]::before {
 content: "\261D";
}

.command-edge-action[data-edge-icon="tel"]::before {
 content: "\260E";
}

.command-edge-action[data-edge-icon="$"]::before {
 content: "\1F4B0";
}

.command-edge-action::after {
 content: "";
 position: absolute;
 top: auto;
 right: 0;
 bottom: 0;
 width: 34px;
 height: 34px;
 border: 0;
 border-radius: 0;
 background:
 linear-gradient(
 135deg,
 rgba(255, 255, 255, 0.96) 0%,
 rgba(248, 250, 252, 0.9) 34%,
 rgba(203, 213, 225, 0.8) 58%,
 rgba(100, 116, 139, 0.34) 100%
 ),
 #cbd5e1;
 clip-path: polygon(100% 0, 100% 100%, 0 100%);
 opacity: 0.86;
 pointer-events: none;
 box-shadow:
 inset -7px -7px 12px rgba(15, 23, 42, 0.12),
 inset 4px 4px 9px rgba(255, 255, 255, 0.72),
 -5px -5px 12px rgba(15, 23, 42, 0.06);
 transition:
 width 0.18s ease,
 height 0.18s ease,
 opacity 0.18s ease,
 filter 0.18s ease;
}

.command-client-panel.is-callable {
 cursor: pointer;
 transition:
 transform 0.18s ease,
 box-shadow 0.18s ease,
 border-color 0.18s ease;
}

.command-client-panel.is-callable * {
 cursor: pointer;
}

.command-client-panel.is-callable:hover,
.command-status-panel.is-clickable:hover {
 transform: translateY(-1px);
 box-shadow: 0 18px 44px rgba(15, 23, 42, 0.12);
}

.command-edge-action:hover::after {
 opacity: 1;
 width: 42px;
 height: 42px;
 filter: saturate(1.05);
 background:
 linear-gradient(
 135deg,
 rgba(255, 255, 255, 1) 0%,
 rgba(248, 250, 252, 0.96) 34%,
 rgba(203, 213, 225, 0.86) 58%,
 rgba(100, 116, 139, 0.42) 100%
 ),
 #dbe3ef;
}

.command-edge-action:hover::before {
 opacity: 1;
 background: rgba(255, 255, 255, 0.78);
 transform: translate(-2px, -2px) scale(1.05);
}

.command-status-icon {
 display: grid;
 place-items: center;
 width: 46px;
 height: 46px;
 margin-bottom: 12px;
 border-radius: 16px;
 background: color-mix(
 in srgb,
 var(--status-accent-color, #ff8a00) var(--status-surface-color-weight, 54%),
 #ffffff
 );
 box-shadow:
 inset 0 0 0 1px rgba(255, 255, 255, 0.78),
 0 8px 18px rgba(15, 23, 42, 0.1);
 color: var(--status-text-color, #0f172a);
 text-shadow: var(--status-text-glow, 0 1px 8px rgba(255, 255, 255, 0.82));
 font-size: 22px;
 line-height: 1;
}

.command-status-auto-toggle {
 position: absolute;
 top: 12px;
 right: 12px;
 z-index: 2;
 display: inline-flex;
 align-items: center;
 cursor: pointer;
}

.command-status-auto-toggle input {
 position: absolute;
 opacity: 0;
 pointer-events: none;
}

.command-status-auto-toggle span {
 position: relative;
 display: block;
 width: 36px;
 height: 20px;
 border: 1px solid rgba(148, 163, 184, 0.55);
 border-radius: 999px;
 background: rgba(226, 232, 240, 0.92);
 box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.08);
 transition:
 background 0.18s ease,
 border-color 0.18s ease;
}

.command-status-auto-toggle span::after {
 content: "";
 position: absolute;
 top: 2px;
 left: 2px;
 width: 14px;
 height: 14px;
 border-radius: 999px;
 background: #ffffff;
 box-shadow: 0 2px 6px rgba(15, 23, 42, 0.18);
 transition: transform 0.18s ease;
}

.command-status-auto-toggle input:checked + span {
 border-color: rgba(34, 197, 94, 0.55);
 background: #22c55e;
}

.command-status-auto-toggle input:checked + span::after {
 transform: translateX(16px);
}

.command-panel-kicker,
.command-label,
.command-money-panel span,
.command-notes-panel span {
 display: block;
 color: #64748b;
 font-size: 12px;
 font-weight: 950;
 text-transform: uppercase;
 letter-spacing: 0.02em;
}

.command-status-panel strong {
 display: block;
 margin-top: 10px;
 color: var(--status-text-color, #0f172a);
 text-shadow: var(--status-text-glow, 0 1px 8px rgba(255, 255, 255, 0.82));
 font-size: clamp(24px, 3vw, 38px);
 line-height: 1.05;
}

.command-status-panel > span:last-child {
 display: block;
 margin-top: 10px;
 color: var(--status-muted-text-color, #475569);
 text-shadow: var(--status-text-glow, 0 1px 7px rgba(255, 255, 255, 0.72));
 font-weight: 850;
}

.command-progress-panel {
 grid-area: progress;
 padding: 14px 16px;
}

.command-estimate-panel {
 grid-area: estimate;
 padding: 18px;
 background: linear-gradient(135deg, #eef6ff, #ffffff 72%) !important;
 border-color: rgba(59, 130, 246, 0.22) !important;
}

.command-estimate-panel span {
 display: block;
 color: #64748b;
 font-size: 12px;
 font-weight: 950;
 text-transform: uppercase;
 letter-spacing: 0.02em;
}

.command-estimate-panel strong {
 display: block;
 margin-top: 8px;
 color: #0f172a;
 font-size: clamp(22px, 2.2vw, 32px);
 line-height: 1;
}

.command-estimate-panel small {
 display: block;
 margin-top: 10px;
 color: #64748b;
 font-weight: 850;
 line-height: 1.35;
}

.command-schedule-panel {
 position: relative;
 overflow: hidden;
 border-width: 1px !important;
 box-shadow: 0 14px 34px rgba(15, 23, 42, 0.09);
}

.command-schedule-panel::before {
 content: "";
 position: absolute;
 inset: 0 auto 0 0;
 width: 8px;
 background: currentColor;
 opacity: 0.62;
}

.command-schedule-panel span,
.command-schedule-panel strong,
.command-schedule-panel small {
 position: relative;
 z-index: 1;
}

.command-schedule-panel.is-today {
 background: linear-gradient(135deg, #fff7ed 0%, #fed7aa 58%, #ffffff 100%) !important;
 border-color: #fdba74 !important;
 color: #9a3412;
}

.command-schedule-panel.is-tomorrow {
 background: linear-gradient(135deg, #fefce8 0%, #fef08a 54%, #ffffff 100%) !important;
 border-color: #fde047 !important;
 color: #854d0e;
}

.command-schedule-panel.is-pending {
 background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 64%, #ffffff 100%) !important;
 border-color: #cbd5e1 !important;
 color: #475569;
}

.command-schedule-panel.is-overdue {
 background: linear-gradient(135deg, #fff1f2 0%, #fecdd3 62%, #ffffff 100%) !important;
 border-color: #fda4af !important;
 color: #9f1239;
}

.command-schedule-panel strong {
 color: #0f172a;
}

.command-schedule-panel small {
 color: color-mix(in srgb, currentColor 78%, #0f172a);
}

.command-estimate-breakdown {
 display: grid;
 gap: 7px;
 margin-top: 12px;
}

.command-estimate-breakdown > div {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 10px;
 padding: 8px 10px;
 border-radius: 13px;
 background: rgba(255, 255, 255, 0.78);
 border: 1px solid rgba(148, 163, 184, 0.2);
}

.command-estimate-breakdown > div span {
 display: block;
 color: #64748b;
 font-size: 11px;
 font-weight: 950;
 text-transform: uppercase;
 letter-spacing: 0.02em;
}

.command-estimate-breakdown > div strong {
 display: block;
 margin: 0;
 color: #0f172a;
 font-size: 17px;
 line-height: 1;
 white-space: nowrap;
}

.command-estimate-breakdown > div.is-total {
 background: #0f172a;
 border-color: #0f172a;
}

.command-estimate-breakdown > div.is-total span,
.command-estimate-breakdown > div.is-total strong {
 color: #ffffff;
}

.command-panel-head {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 10px;
 color: #0f172a;
 min-height: 18px;
}

.command-panel-head span {
 color: #64748b;
 font-weight: 950;
 text-transform: uppercase;
 font-size: 11px;
}

.command-panel-head strong {
 font-size: 14px;
}

.command-panel-head.secondary {
 margin-top: 10px;
}

.command-progress-track {
 overflow: hidden;
 height: 10px;
 margin-top: 6px;
 border-radius: 999px;
 background: #e2e8f0;
}

.command-progress-track span {
 display: block;
 height: 100%;
 border-radius: inherit;
 background: linear-gradient(90deg, #ff8a00, #fbbf24);
}

.command-progress-track.ready span {
 background: linear-gradient(90deg, #22c55e, #86efac);
}

.command-progress-track.labeled span {
 background: linear-gradient(90deg, #6366f1, #a5b4fc);
}

.command-client-panel {
 grid-area: client;
 display: grid;
 grid-template-columns: minmax(0, 1fr) minmax(0, 0.7fr);
 gap: 12px;
 padding: 18px;
}

.command-client-panel > div {
 min-width: 0;
}

.command-client-panel strong,
.command-client-panel a,
.command-notes-panel strong {
 display: block;
 margin-top: 5px;
 color: #0f172a;
 font-size: 17px;
 font-weight: 950;
 line-height: 1.25;
 overflow-wrap: anywhere;
 text-decoration: none;
}

.command-wide {
 grid-column: 1 / -1;
}

.command-money-panel {
 grid-area: money;
 padding: 18px;
 background: linear-gradient(135deg, #fff7ed, #ffffff 70%) !important;
 border-color: #fed7aa !important;
}

.command-money-panel strong {
 display: block;
 margin-top: 8px;
 color: #0f172a;
 font-size: clamp(28px, 3vw, 42px);
 line-height: 1;
}

.command-money-panel small,
.command-notes-panel small {
 display: block;
 margin-top: 10px;
 color: #64748b;
 font-weight: 800;
 line-height: 1.35;
}

.command-notes-panel {
 grid-area: notes;
 padding: 18px;
 background: linear-gradient(135deg, #f5f3ff, #ffffff 72%) !important;
 border-color: #ddd6fe !important;
}

.command-map-panel {
 grid-area: map;
 display: grid;
 grid-template-columns: minmax(220px, 0.65fr) minmax(260px, 1fr);
 gap: 12px;
 padding: 14px;
 background: linear-gradient(90deg, #eff6ff, #ffffff 72%) !important;
 border-color: #bfdbfe !important;
}

.command-map-panel span {
 display: block;
 color: #64748b;
 font-size: 12px;
 font-weight: 950;
 text-transform: uppercase;
}

.command-map-panel strong {
 display: block;
 margin-top: 7px;
 color: #0f172a;
 font-size: 15px;
 line-height: 1.35;
 overflow-wrap: anywhere;
}

.order-map-navigation-link {
 display: inline-flex;
 align-items: center;
 width: fit-content;
 margin-top: 11px;
 color: #075985;
 font-size: 12px;
 font-weight: 900;
 line-height: 1.25;
 text-decoration: none;
}

.order-map-navigation-link:hover,
.order-map-navigation-link:focus-visible {
 color: #0369a1;
 text-decoration: underline;
}

.order-map-unavailable {
 display: grid;
 place-items: center;
 min-height: 150px;
 padding: 18px;
 border: 1px dashed #93c5fd;
 border-radius: 14px;
 background: #f8fbff;
 color: #475569;
 font-size: 12px;
 font-weight: 800;
 line-height: 1.4;
 text-align: center;
}

.command-map-panel .order-map-unavailable {
 min-height: 170px;
}

.command-map-panel iframe {
 width: 100%;
 min-height: 170px;
 border: 0;
 border-radius: 14px;
}

@media (max-width: 1100px) {
 .order-info-grid {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .order-command-board {
 grid-template-columns: 1fr 1fr;
 grid-template-areas:
 "status status"
 "progress money"
 "estimate estimate"
 "client client"
 "notes notes"
 "map map";
 }
}

@media (max-width: 760px) {
 .order-hero-top {
 flex-direction: column;
 gap: 12px;
 }

 .order-quick-actions {
 width: 100%;
 display: grid;
 grid-template-columns: repeat(4, minmax(0, 1fr));
 gap: 7px;
 }

 .quick-action-btn {
 min-width: 0;
 min-height: 50px;
 padding: 6px 3px;
 border-radius: 14px;
 }

 .order-info-grid {
 grid-template-columns: 1fr;
 gap: 8px;
 }

 .order-info-tile {
 padding: 11px;
 border-radius: 16px;
 }

 .order-info-tile strong {
 font-size: 14px;
 }

 .order-hero-card-test-2 {
 padding: 12px;
 }

 .order-command-board {
 grid-template-columns: 1fr;
 grid-template-areas:
 "status"
 "progress"
 "estimate"
 "money"
 "client"
 "notes"
 "map";
 }

 .command-client-panel {
 grid-template-columns: 1fr;
 padding: 14px;
 }

 .command-status-panel,
 .command-progress-panel,
 .command-estimate-panel,
 .command-money-panel,
 .command-notes-panel,
 .command-map-panel {
 padding: 14px;
 border-radius: 18px;
 }

 .command-edge-action {
 padding-right: 14px !important;
 }

 .command-edge-action::after {
 top: auto;
 right: 0;
 bottom: 0;
 width: 28px;
 height: 28px;
 }

 .command-edge-action::before {
 right: 1px;
 bottom: 1px;
 width: 21px;
 height: 21px;
 font-size: 15px;
 }

 .command-map-panel {
 grid-template-columns: 1fr;
 }

 .command-map-panel iframe {
 min-height: 150px;
 }

 .command-status-panel strong,
 .command-money-panel strong {
 font-size: 28px;
 }
}

/* Sectiune 7 - orders compact / extended mobile view */

.orders-page {
 display: grid;
 gap: 12px;
}

.orders-sticky-tools {
 position: sticky;
 top: calc(var(--topbar-height) + 8px);
 z-index: 70;
 display: grid;
 gap: 10px;
 padding: 10px;
 border: 1px solid rgba(226, 232, 240, 0.9);
 border-radius: 20px;
 background: rgba(248, 250, 252, 0.92);
 backdrop-filter: blur(18px);
 box-shadow: 0 16px 35px rgba(15, 23, 42, 0.08);
}

.orders-actions-row {
 display: flex;
 flex-wrap: wrap;
 gap: 8px;
}

.orders-view-toggle {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 6px;
 padding: 4px;
 border-radius: 16px;
 background: #e5e7eb;
}

.orders-toggle-btn {
 min-height: 38px;
 padding: 8px 10px;
 border: 0;
 border-radius: 13px;
 background: transparent;
 color: #334155;
 font-size: 13px;
 font-weight: 900;
 cursor: pointer;
 transition:
 background 0.18s ease,
 color 0.18s ease,
 transform 0.18s ease,
 box-shadow 0.18s ease;
}

.orders-toggle-btn.is-active {
 background: #ffffff;
 color: #ea580c;
 box-shadow: 0 8px 20px rgba(15, 23, 42, 0.1);
}

.orders-toggle-btn:active {
 transform: scale(0.97);
}

.orders-compact-list,
.orders-extended-list {
 display: none;
}

.orders-list-shell.is-compact .orders-compact-list {
 display: grid;
 gap: 5px;
}

.orders-list-shell.is-extended .orders-extended-list {
 display: grid;
 gap: 8px;
}

.order-compact-row {
 position: relative;
 display: grid;
 grid-template-columns: 74px minmax(0, 1.05fr) minmax(0, 1.15fr) auto;
 gap: 6px;
 align-items: center;
 min-height: 44px;
 padding: 5px 7px 5px 10px;
 border: 1px solid rgba(226, 232, 240, 0.95);
 border-radius: 12px;
 background: #ffffff;
 box-shadow: 0 4px 12px rgba(15, 23, 42, 0.035);
 cursor: pointer;
 overflow: hidden;
 transition:
 transform 0.14s ease,
 box-shadow 0.14s ease,
 border-color 0.14s ease,
 background 0.14s ease;
}

.order-compact-row:active,
.order-compact-row:hover {
 transform: scale(0.995);
 border-color: rgba(249, 115, 22, 0.45);
 box-shadow: 0 8px 20px rgba(249, 115, 22, 0.08);
}

.order-compact-accent {
 position: absolute;
 top: 0;
 left: 0;
 width: 4px;
 height: 100%;
 background: #cbd5e1;
}

.order-compact-id {
 display: flex;
 align-items: center;
 gap: 4px;
 min-width: 0;
 font-size: 12px;
 font-weight: 900;
 white-space: nowrap;
}

.order-type-icon {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-width: 18px;
 font-size: 14px;
}

.order-type-icon.large {
 width: 28px;
 height: 28px;
 min-width: 28px;
 border-radius: 9px;
 background: #f8fafc;
 font-size: 15px;
 line-height: 1;
 text-align: center;
}

.order-compact-client {
 min-width: 0;
 line-height: 1.12;
}

.order-compact-client strong {
 display: block;
 overflow: hidden;
 color: #0f172a;
 font-size: 12px;
 font-weight: 900;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.order-compact-client span {
 display: block;
 overflow: hidden;
 margin-top: 2px;
 color: #64748b;
 font-size: 11px;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.order-compact-client .order-list-separator,
.order-extended-client .order-list-separator {
 display: inline !important;
 margin: 0 3px;
 color: #94a3b8;
 font-weight: 850;
}

.order-list-location {
 display: inline !important;
 color: #334155;
 font-weight: 950;
 text-transform: uppercase;
}

.order-compact-status {
 min-width: 0;
 overflow: hidden;
 padding: 5px 7px;
 border-radius: 10px;
 background: rgba(241, 245, 249, 0.85);
 color: #334155;
 font-size: 11px;
 font-weight: 800;
 line-height: 1.1;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.order-compact-summary {
 display: grid;
 gap: 3px;
 min-width: 0;
}

.order-compact-foot {
 display: flex;
 align-items: center;
 justify-content: flex-end;
 gap: 5px;
 min-width: 0;
}

.order-compact-foot .order-schedule-chip {
 margin-right: auto;
}

.order-compact-total {
 justify-self: end;
 flex: 0 0 auto;
 max-width: 100%;
 overflow: hidden;
 padding: 2px 6px;
 border-radius: 999px;
 background: #fff7ed;
 color: #9a3412;
 font-size: 10.5px;
 font-weight: 950;
 line-height: 1.1;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.order-schedule-chip {
 display: inline-flex;
 align-items: center;
 min-width: 0;
 max-width: 82px;
 overflow: hidden;
 padding: 2px 5px;
 border-radius: 999px;
 font-size: 9.8px;
 font-weight: 950;
 line-height: 1.1;
 text-overflow: ellipsis;
 white-space: nowrap;
 box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.06);
}

.order-schedule-chip:before {
 content: "\1F4C5";
 flex: 0 0 auto;
 margin-right: 3px;
 font-size: 10px;
 line-height: 1;
}

.order-schedule-chip.is-today {
 background: linear-gradient(135deg, #fff7ed 0%, #fed7aa 45%, #fb923c 100%);
 background-size: 180% 180%;
 color: #9a3412;
 box-shadow: inset 0 0 0 1px rgba(249, 115, 22, 0.28);
 transform-origin: center;
 animation: orderScheduleTodayPulse 1.35s ease-in-out infinite;
}

.order-schedule-chip.is-tomorrow {
 background: linear-gradient(135deg, #fffde7 0%, #fef08a 48%, #facc15 100%);
 background-size: 180% 180%;
 color: #854d0e;
 box-shadow: inset 0 0 0 1px rgba(234, 179, 8, 0.3);
 transform-origin: center;
 animation: orderScheduleTomorrowPulse 1.9s ease-in-out infinite;
}

.order-schedule-chip.is-overdue {
 background: linear-gradient(135deg, #7f1d1d 0%, #dc2626 45%, #ef4444 100%);
 background-size: 180% 180%;
 color: #ffffff;
 box-shadow:
 inset 0 0 0 1px rgba(127, 29, 29, 0.55),
 0 0 14px rgba(220, 38, 38, 0.38);
 transform-origin: center;
 animation: orderScheduleOverduePulse 1.05s ease-in-out infinite;
}

@keyframes orderScheduleTodayPulse {
 0%,
 100% {
 background-position: 0% 50%;
 box-shadow:
 inset 0 0 0 1px rgba(249, 115, 22, 0.34),
 0 0 0 rgba(249, 115, 22, 0);
 filter: brightness(1) saturate(1);
 transform: scale(1);
 }

 50% {
 background-position: 100% 50%;
 box-shadow:
 inset 0 0 0 1px rgba(249, 115, 22, 0.58),
 0 0 16px rgba(249, 115, 22, 0.44);
 filter: brightness(1.08) saturate(1.18);
 transform: scale(1.045);
 }
}

@keyframes orderScheduleTomorrowPulse {
 0%,
 100% {
 background-position: 0% 50%;
 box-shadow:
 inset 0 0 0 1px rgba(234, 179, 8, 0.3),
 0 0 0 rgba(234, 179, 8, 0);
 filter: brightness(1);
 transform: scale(1);
 }

 50% {
 background-position: 100% 50%;
 box-shadow:
 inset 0 0 0 1px rgba(234, 179, 8, 0.52),
 0 0 12px rgba(234, 179, 8, 0.3);
 filter: brightness(1.06);
 transform: scale(1.03);
 }
}

@keyframes orderScheduleOverduePulse {
 0%,
 100% {
 background-position: 0% 50%;
 box-shadow:
 inset 0 0 0 1px rgba(127, 29, 29, 0.68),
 0 0 0 rgba(220, 38, 38, 0);
 filter: brightness(1) saturate(1.05);
 transform: scale(1);
 }

 50% {
 background-position: 100% 50%;
 box-shadow:
 inset 0 0 0 1px rgba(248, 113, 113, 0.82),
 0 0 18px rgba(239, 68, 68, 0.62);
 filter: brightness(1.12) saturate(1.25);
 transform: scale(1.055);
 }
}

.order-schedule-chip.is-pending {
 background: #f1f5f9;
 color: #64748b;
 box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.24);
}

.order-desktop-type-cell {
 vertical-align: middle;
 min-width: 120px;
}

.order-desktop-type-label {
 display: block;
 color: #0f172a;
 font-weight: 800;
 line-height: 1.15;
}

.order-schedule-chip-desktop {
 margin-top: 5px;
 max-width: 132px;
 padding: 3px 7px;
 font-size: 10.5px;
}

.order-compact-extra {
 display: grid;
 justify-items: end;
 min-width: 58px;
 line-height: 1.05;
}

.order-compact-extra strong {
 color: #0f172a;
 font-size: 11px;
 font-weight: 900;
 white-space: nowrap;
}

.order-compact-extra span {
 margin-top: 3px;
 color: #94a3b8;
 font-size: 10px;
 white-space: nowrap;
}

.order-extended-card {
 position: relative;
 display: grid;
 gap: 8px;
 padding: 10px;
 border: 1px solid rgba(226, 232, 240, 0.96);
 border-radius: 16px;
 background: #ffffff;
 box-shadow: 0 8px 20px rgba(15, 23, 42, 0.045);
 cursor: pointer;
 overflow: hidden;
 transition:
 transform 0.16s ease,
 box-shadow 0.16s ease,
 border-color 0.16s ease;
}

.order-extended-card:before {
 content: "";
 position: absolute;
 top: 0;
 left: 0;
 width: 5px;
 height: 100%;
 background: #cbd5e1;
}

.order-extended-card:active,
.order-extended-card:hover {
 transform: translateY(-1px);
 border-color: rgba(249, 115, 22, 0.45);
 box-shadow: 0 12px 28px rgba(249, 115, 22, 0.09);
}

.order-extended-head,
.order-extended-body,
.order-extended-meta {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 8px;
 min-width: 0;
}

.order-extended-title {
 display: flex;
 align-items: center;
 gap: 8px;
 min-width: 0;
}

.order-extended-title strong,
.order-extended-client strong {
 display: block;
 color: #0f172a;
 font-size: 14px;
 font-weight: 900;
}

.order-extended-title span,
.order-extended-client span,
.order-extended-meta span {
 display: block;
 color: #64748b;
 font-size: 11px;
}

.order-extended-total {
 padding: 6px 8px;
 border-radius: 10px;
 background: #fff7ed;
 color: #9a3412;
 font-size: 12px;
 font-weight: 900;
 white-space: nowrap;
}

.order-extended-head-actions {
 display: flex;
 align-items: center;
 justify-content: flex-end;
 gap: 6px;
 min-width: 0;
 flex: 0 1 auto;
}

.order-extended-head-actions .order-schedule-chip {
 max-width: 120px;
 font-size: 10.5px;
}

.order-extended-client {
 min-width: 0;
}

.order-extended-state {
 display: grid;
 justify-items: end;
 gap: 5px;
 min-width: 0;
 max-width: 52%;
}

.order-extended-state .order-schedule-chip {
 max-width: 118px;
 font-size: 10.5px;
}

.order-extended-status {
 max-width: 100%;
 overflow: hidden;
 padding: 6px 8px;
 border-radius: 11px;
 background: #f1f5f9;
 color: #334155;
 font-size: 12px;
 font-weight: 900;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.order-extended-meta {
 justify-content: flex-start;
 flex-wrap: wrap;
 padding-top: 6px;
 border-top: 1px dashed #e2e8f0;
}

.order-extended-meta span {
 padding: 4px 7px;
 border-radius: 999px;
 background: #f8fafc;
}

.order-extended-meta-head {
 flex: 1 1 auto;
 justify-content: center;
 flex-wrap: nowrap;
 padding-top: 0;
 border-top: 0;
 min-width: 0;
}

.order-extended-meta-head span {
 max-width: 100%;
 overflow: hidden;
 padding: 4px 8px;
 background: #f8fafc;
 color: #64748b;
 font-size: 11px;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.order-list-progress-mini {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 6px;
 padding: 6px 7px;
 border: 1px solid rgba(226, 232, 240, 0.86);
 border-radius: 11px;
 background: linear-gradient(
 135deg,
 rgba(248, 250, 252, 0.98),
 rgba(255, 247, 237, 0.72)
 );
}

.order-list-progress-line {
 min-width: 0;
}

.order-list-progress-line span,
.order-list-progress-line strong {
 display: inline-block;
 vertical-align: baseline;
 font-size: 10px;
 line-height: 1.05;
}

.order-list-progress-line span {
 max-width: calc(100% - 34px);
 overflow: hidden;
 color: #64748b;
 font-weight: 950;
 text-overflow: ellipsis;
 text-transform: uppercase;
 white-space: nowrap;
}

.order-list-progress-line strong {
 float: right;
 color: #0f172a;
 font-weight: 950;
}

.order-list-progress-line i {
 display: block;
 clear: both;
 overflow: hidden;
 height: 4px;
 margin-top: 4px;
 border-radius: 999px;
 background: #e2e8f0;
}

.order-list-progress-line b {
 display: block;
 height: 100%;
 border-radius: inherit;
 background: linear-gradient(90deg, #ff8a00, #fbbf24);
}

.order-list-progress-line i.labeled b {
 background: linear-gradient(90deg, #6366f1, #a5b4fc);
}

.order-list-progress-line i.ready b {
 background: linear-gradient(90deg, #22c55e, #86efac);
}

.order-desktop-progress-cell {
 width: 210px;
 min-width: 190px;
}

.order-desktop-progress-cell .order-list-progress-mini {
 min-width: 190px;
 padding: 5px 6px;
 box-shadow: none;
}

.status-wash .order-compact-accent,
.status-wash:before {
 background: #38bdf8;
}

.status-wash .order-compact-status,
.status-wash .order-extended-status {
 background: #e0f2fe;
 color: #075985;
}

.status-delivery .order-compact-accent,
.status-delivery:before {
 background: #22c55e;
}

.status-delivery .order-compact-status,
.status-delivery .order-extended-status {
 background: #dcfce7;
 color: #166534;
}

.status-pickup .order-compact-accent,
.status-pickup:before {
 background: #facc15;
}

.status-pickup .order-compact-status,
.status-pickup .order-extended-status {
 background: #fef9c3;
 color: #854d0e;
}

.status-waiting .order-compact-accent,
.status-waiting:before {
 background: #a855f7;
}

.status-waiting .order-compact-status,
.status-waiting .order-extended-status {
 background: #f3e8ff;
 color: #6b21a8;
}

.status-done .order-compact-accent,
.status-done:before {
 background: #94a3b8;
}

.status-done .order-compact-status,
.status-done .order-extended-status {
 background: #f1f5f9;
 color: #475569;
}

.status-cancelled .order-compact-accent,
.status-cancelled:before {
 background: #ef4444;
}

.status-cancelled .order-compact-status,
.status-cancelled .order-extended-status {
 background: #fee2e2;
 color: #991b1b;
}

.compact-orders-table td,
.compact-orders-table th {
 padding-top: 8px;
 padding-bottom: 8px;
}

.compact-orders-table .status-line {
 display: inline-block;
 max-width: 280px;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

@media (min-width: 901px) {
 .orders-compact-list,
 .orders-extended-list {
 display: none !important;
 }

 .orders-view-toggle {
 max-width: 420px;
 }
}

@media (max-width: 900px) {
 .orders-page {
 gap: 8px;
 }

 .orders-sticky-tools {
 top: calc(var(--topbar-height) + 4px);
 gap: 7px;
 padding: 7px;
 border-radius: 16px;
 }

 .orders-actions-row {
 display: grid;
 grid-template-columns: 1fr;
 }

 .desktop-only-action {
 display: none;
 }

 .orders-sticky-tools .btn {
 min-height: 36px;
 padding: 8px 10px;
 border-radius: 12px;
 font-size: 13px;
 }

 .orders-toggle-btn {
 min-height: 34px;
 padding: 7px 8px;
 font-size: 12px;
 }

 .orders-desktop-table {
 display: none !important;
 }
}

@media (max-width: 520px) {
 .order-compact-row {
 grid-template-columns: 76px minmax(0, 1fr) minmax(0, 0.98fr);
 min-height: 42px;
 gap: 5px;
 padding: 4px 6px 4px 9px;
 border-radius: 10px;
 }

 .order-compact-extra {
 display: none;
 }

 .order-compact-id {
 gap: 3px;
 }

 .order-type-icon {
 min-width: 15px;
 font-size: 12px;
 }

 .order-compact-status {
 padding: 5px 7px;
 }

 .order-compact-total {
 padding: 3px 6px;
 }

 .order-schedule-chip {
 max-width: 74px;
 padding: 2px 4px;
 font-size: 9.4px;
 }

 .order-extended-card {
 gap: 7px;
 padding: 9px 9px 9px 11px;
 border-radius: 14px;
 }

 .order-extended-state {
 max-width: 52%;
 }

 .order-extended-status {
 max-width: 100%;
 padding: 5px 7px;
 }

 .order-extended-total {
 padding: 5px 7px;
 }

 .order-extended-meta {
 gap: 5px;
 }

 .order-extended-meta span {
 padding: 3px 6px;
 }
}

@media (max-width: 380px) {
 .order-compact-row {
 grid-template-columns: 58px minmax(0, 0.95fr) minmax(0, 1fr);
 }

 .orders-toggle-btn {
 font-size: 11px;
 }
}

/* Sectiune 8 - desktop detailed list + automatic mobile compact list */

.topbar {
 grid-template-columns: minmax(0, 1fr) auto;
}

.topbar-main {
 gap: 10px;
}

.topbar-main .header-shortcuts {
 order: 0;
 display: flex;
 align-items: center;
 flex: 0 0 auto;
 gap: 7px;
 margin: 0;
 padding: 0;
 border: 0;
 overflow: visible;
}

.topbar-main .header-icon-btn {
 width: 40px;
 height: 40px;
 border-radius: 13px;
 font-size: 18px;
}

.orders-view-toggle {
 display: none !important;
}

.orders-list-mode-bar {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 5px;
 width: 100%;
 padding: 4px;
 margin: 0 0 8px;
 border-radius: 14px;
 background: #e5e7eb;
}

.orders-quick-filter-bar {
 display: flex;
 flex-wrap: wrap;
 gap: 7px;
 width: 100%;
 margin: 0 0 8px;
}

.orders-quick-filter-bar-modal {
 margin: 2px 0 14px;
 padding: 10px;
 border: 1px solid rgba(226, 232, 240, 0.86);
 border-radius: 16px;
 background: rgba(248, 250, 252, 0.82);
}

.orders-quick-filter-chip {
 --quick-bg: #ffffff;
 --quick-line: #cbd5e1;
 --quick-text: #182033;
 display: inline-flex;
 align-items: center;
 justify-content: space-between;
 gap: 8px;
 min-height: 34px;
 padding: 5px 7px 5px 10px;
 border: 1px solid rgba(203, 213, 225, 0.88);
 border-left: 4px solid var(--quick-line);
 border-radius: 13px;
 background: var(--quick-bg);
 color: var(--quick-text);
 font-size: 12px;
 font-weight: 900;
 line-height: 1;
 text-decoration: none;
 box-shadow: 0 6px 16px rgba(15, 23, 42, 0.045);
 transition:
 transform 0.16s ease,
 box-shadow 0.16s ease,
 border-color 0.16s ease,
 background 0.16s ease;
}

.orders-quick-filter-chip span {
 white-space: nowrap;
}

.orders-quick-filter-chip strong {
 display: inline-grid;
 min-width: 26px;
 height: 24px;
 place-items: center;
 padding: 0 7px;
 border-radius: 999px;
 background: rgba(15, 23, 42, 0.08);
 color: #0f172a;
 font-size: 12px;
}

.orders-quick-filter-chip:hover,
.orders-quick-filter-chip.is-active {
 transform: translateY(-1px);
 border-color: color-mix(in srgb, var(--quick-line) 70%, #ffffff);
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.11);
}

.orders-quick-filter-chip.is-active {
 background: linear-gradient(135deg, var(--quick-bg), #ffffff 72%);
 outline: 2px solid color-mix(in srgb, var(--quick-line) 28%, transparent);
}

.orders-quick-filter-chip.tone-neutral {
 --quick-bg: #f8fafc;
 --quick-line: #64748b;
}
.orders-quick-filter-chip.tone-info {
 --quick-bg: #eff6ff;
 --quick-line: #3b82f6;
}
.orders-quick-filter-chip.tone-warning {
 --quick-bg: #fffbeb;
 --quick-line: #f59e0b;
}
.orders-quick-filter-chip.tone-success {
 --quick-bg: #ecfdf5;
 --quick-line: #22c55e;
}
.orders-quick-filter-chip.tone-cyan {
 --quick-bg: #ecfeff;
 --quick-line: #06b6d4;
}
.orders-quick-filter-chip.tone-purple {
 --quick-bg: #faf5ff;
 --quick-line: #a855f7;
}
.orders-quick-filter-chip.tone-blue {
 --quick-bg: #eff6ff;
 --quick-line: #0ea5e9;
}

@media (max-width: 760px) {
 .orders-quick-filter-bar {
 flex-wrap: nowrap;
 gap: 6px;
 margin-left: -2px;
 margin-right: -2px;
 padding: 0 2px 4px;
 overflow-x: auto;
 overscroll-behavior-x: contain;
 scrollbar-width: none;
 }

 .orders-quick-filter-bar::-webkit-scrollbar {
 display: none;
 }

 .orders-quick-filter-chip {
 flex: 0 0 auto;
 min-height: 32px;
 padding: 4px 6px 4px 9px;
 font-size: 11px;
 }

 .orders-quick-filter-chip strong {
 min-width: 24px;
 height: 22px;
 font-size: 11px;
 }
}

.orders-list-shell {
 display: block;
}

.orders-extended-list {
 display: none !important;
}

.orders-compact-list {
 display: none;
}

.orders-desktop-table {
 display: block;
}

.detailed-orders-table th,
.detailed-orders-table td {
 padding-top: 7px;
 padding-bottom: 7px;
 vertical-align: middle;
 font-size: 13px;
}

.detailed-orders-table .tiny-text {
 margin-top: 3px;
 font-size: 11px;
 line-height: 1.15;
}

.detailed-orders-table .status-line {
 max-width: 320px;
}

.orders-sticky-tools-simple {
 position: sticky;
 top: calc(var(--topbar-height) + 8px);
 z-index: 40;
}

@media (min-width: 901px) {
 .orders-compact-list {
 display: none !important;
 }

 .orders-desktop-table {
 display: block !important;
 }
}

@media (max-width: 900px) {
 .orders-sticky-tools-simple {
 top: calc(var(--topbar-height) + 4px);
 }

 .orders-list-shell .orders-compact-list,
 .orders-list-shell .orders-extended-list {
 display: none !important;
 }

 .orders-list-shell.is-compact .orders-compact-list {
 display: grid !important;
 gap: 4px;
 }

 .orders-list-shell.is-extended .orders-extended-list {
 display: grid !important;
 gap: 7px;
 }

 .orders-desktop-table {
 display: none !important;
 }
}

@media (max-width: 760px) {
 .topbar {
 grid-template-columns: minmax(0, 1fr) auto;
 min-height: 58px;
 padding: 7px 9px;
 }

 .topbar-main {
 gap: 7px;
 }

 .topbar-main .header-shortcuts {
 grid-column: auto;
 width: auto;
 padding: 0;
 border: 0;
 overflow: visible;
 gap: 5px;
 }

 .topbar-main .header-icon-btn,
 .menu-trigger {
 width: 36px;
 height: 36px;
 min-width: 36px;
 border-radius: 12px;
 font-size: 16px;
 }

 .header-title-block h1 {
 font-size: 16px;
 }

 .userbox {
 display: none;
 }
}

@media (max-width: 430px) {
 .topbar-main .header-icon-btn,
 .menu-trigger {
 width: 33px;
 height: 33px;
 min-width: 33px;
 border-radius: 11px;
 font-size: 15px;
 }

 .topbar-main {
 gap: 5px;
 }

 .order-compact-row {
 min-height: 34px;
 grid-template-columns: 60px minmax(0, 1fr) minmax(0, 0.9fr);
 padding-top: 3px;
 padding-bottom: 3px;
 }
}

/* Sectiune 9 - etichete si scanare QR */
.quick-action-btn {
 text-decoration: none;
}

.label-print-page {
 margin: 0;
 background: #f3f4f6;
 color: #111827;
}

.label-print-toolbar {
 position: sticky;
 top: 0;
 z-index: 50;
 display: flex;
 gap: 10px;
 justify-content: center;
 padding: 12px;
 background: rgba(255, 255, 255, 0.92);
 backdrop-filter: blur(12px);
 border-bottom: 1px solid #e5e7eb;
}

.label-sheet {
 width: 100mm;
 min-height: 100mm;
 margin: 12px auto;
 page-break-after: always;
}

.carpet-label {
 width: 100mm;
 height: 100mm;
 position: relative;
 overflow: hidden;
 background: #ffffff;
 border: 3px solid #111827;
 border-radius: 14px;
 padding: 10px;
 box-sizing: border-box;
 font-family: Arial, sans-serif;
}

.label-top-strip {
 display: flex;
 justify-content: space-between;
 align-items: center;
 font-size: 13px;
 font-weight: 800;
 text-transform: uppercase;
 letter-spacing: 0.05em;
 padding-bottom: 6px;
 border-bottom: 2px solid #111827;
}

.label-main-grid {
 display: grid;
 grid-template-columns: 38mm 1fr;
 gap: 8px;
 align-items: center;
 margin-top: 8px;
}

.label-qr-box {
 display: flex;
 align-items: center;
 justify-content: center;
 border: 2px solid #111827;
 border-radius: 12px;
 padding: 4px;
}

.label-qr-box img {
 width: 34mm;
 height: 34mm;
 display: block;
}

.label-client-box {
 min-width: 0;
}

.label-city {
 font-size: 18px;
 font-weight: 900;
 line-height: 1.05;
}

.label-client-name {
 margin-top: 5px;
 font-size: 19px;
 font-weight: 900;
 line-height: 1.05;
 word-break: break-word;
}

.label-phone {
 margin-top: 5px;
 font-size: 18px;
 font-weight: 900;
}

.label-order-number {
 grid-column: 1 / -1;
 font-size: 28px;
 font-weight: 900;
 text-align: center;
 line-height: 1;
 padding: 4px;
 border-radius: 10px;
 background: #f3f4f6;
}

.label-item-title {
 margin-top: 8px;
 font-size: 17px;
 font-weight: 900;
 text-align: center;
 line-height: 1.1;
 min-height: 19px;
}

.label-info-grid {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 6px;
 margin-top: 8px;
}

.label-info-grid div {
 border: 1px solid #111827;
 border-radius: 8px;
 padding: 5px;
 min-height: 30px;
}

.label-info-grid strong {
 display: block;
 font-size: 10px;
 text-transform: uppercase;
 color: #4b5563;
}

.label-info-grid span {
 display: block;
 font-size: 12px;
 font-weight: 800;
 line-height: 1.15;
}

.label-address,
.label-notes {
 margin-top: 6px;
 font-size: 12px;
 font-weight: 700;
 line-height: 1.15;
 padding: 5px;
 border-radius: 8px;
 background: #f9fafb;
}

.scanner-page {
 min-height: 100vh;
 margin: 0;
 background: radial-gradient(
 circle at top,
 #1e293b 0,
 #0f172a 45%,
 #020617 100%
 );
 color: #ffffff;
}

.scanner-shell {
 width: min(620px, 100%);
 margin: 0 auto;
 padding: 12px;
 box-sizing: border-box;
}

.scanner-topbar {
 height: 54px;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
}

.scanner-back {
 color: #ffffff;
 text-decoration: none;
 font-weight: 800;
 opacity: 0.85;
}

.scanner-alert {
 margin: 8px 0 12px;
 padding: 12px;
 border-radius: 14px;
 background: rgba(239, 68, 68, 0.18);
 border: 1px solid rgba(248, 113, 113, 0.45);
}

.scanner-card {
 background: rgba(255, 255, 255, 0.08);
 border: 1px solid rgba(255, 255, 255, 0.16);
 border-radius: 24px;
 padding: 14px;
 box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
 backdrop-filter: blur(18px);
}

.scanner-video-wrap {
 position: relative;
 overflow: hidden;
 border-radius: 20px;
 background: #000000;
 aspect-ratio: 3 / 4;
}

.scanner-video-wrap video {
 width: 100%;
 height: 100%;
 object-fit: cover;
 display: block;
}

.scanner-frame {
 position: absolute;
 inset: 18%;
 border: 3px solid rgba(255, 255, 255, 0.9);
 border-radius: 24px;
 box-shadow: 0 0 0 999px rgba(0, 0, 0, 0.24);
}

.scanner-frame:after {
 content: "";
 position: absolute;
 left: 12px;
 right: 12px;
 top: 50%;
 height: 2px;
 background: rgba(34, 197, 94, 0.95);
 box-shadow: 0 0 18px rgba(34, 197, 94, 0.9);
 animation: scannerLine 1.5s ease-in-out infinite;
}

@keyframes scannerLine {
 0%,
 100% {
 transform: translateY(-70px);
 opacity: 0.25;
 }

 50% {
 transform: translateY(70px);
 opacity: 1;
 }
}

.scanner-status {
 margin: 14px 0;
 font-weight: 800;
 text-align: center;
}

.scanner-manual {
 display: flex;
 flex-direction: column;
 gap: 8px;
}

.scanner-manual label {
 font-size: 13px;
 font-weight: 800;
 opacity: 0.85;
}

.scanner-manual-row {
 display: flex;
 gap: 8px;
}

.scanner-manual-row .input {
 flex: 1;
}

@media print {
 body {
 background: #ffffff !important;
 }

 .no-print {
 display: none !important;
 }

 .label-sheet {
 margin: 0;
 page-break-after: always;
 }

 @page {
 size: 100mm 100mm;
 margin: 0;
 }
}

@media (max-width: 520px) {
 .scanner-shell {
 padding: 8px;
 }

 .scanner-card {
 border-radius: 18px;
 padding: 10px;
 }

 .scanner-manual-row {
 flex-direction: column;
 }
}

/* Sectiune 10 - Scanner avansat cu zoom / torch / camera selector */
.scanner-card-pro {
 gap: 12px;
}

.scanner-video-wrap-pro {
 background: #020617;
 overflow: hidden;
}

.scanner-video-wrap-pro video {
 transform-origin: center center;
 transition: transform 0.18s ease;
}

.scanner-corners {
 position: absolute;
 inset: 24%;
 border: 2px solid rgba(255, 255, 255, 0.65);
 border-radius: 18px;
 pointer-events: none;
 box-shadow: 0 0 0 999px rgba(0, 0, 0, 0.18);
}

.scanner-controls {
 display: grid;
 grid-template-columns: 44px 1fr 44px 44px;
 align-items: center;
 gap: 8px;
}

.scanner-control-btn {
 width: 44px;
 height: 44px;
 border: 0;
 border-radius: 14px;
 background: #111827;
 color: #ffffff;
 font-size: 20px;
 font-weight: 900;
 cursor: pointer;
}

.scanner-control-btn.active {
 background: #f59e0b;
 color: #111827;
}

.scanner-zoom-wrap {
 display: flex;
 flex-direction: column;
 gap: 4px;
 font-size: 12px;
 font-weight: 800;
 color: #475569;
}

.scanner-zoom-wrap input {
 width: 100%;
}

.scanner-camera-row {
 display: block;
}

.scanner-camera-row select {
 width: 100%;
}

@media (max-width: 768px) {
 .scanner-shell-pro {
 padding: 8px;
 }

 .scanner-video-wrap-pro {
 min-height: 56vh;
 }

 .scanner-corners {
 inset: 20%;
 }

 .scanner-controls {
 grid-template-columns: 42px 1fr 42px 42px;
 }
}

.product-qty-line {
 display: flex;
 align-items: center;
 gap: 6px;
}

.product-dim-line {
 display: flex;
 align-items: center;
 gap: 6px;
}

.product-total-inline {
 margin-left: auto;
 white-space: nowrap;
 font-weight: 800;
}

/* Sectiune 26 - inline product editor final */
.order-products-card {
 overflow: visible;
}

.products-section-head {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 margin-bottom: 10px;
}

.products-section-title h3 {
 margin: 0;
}

.products-inline-actions {
 display: flex;
 gap: 8px;
 align-items: center;
}

.product-summary-list {
 display: flex;
 flex-direction: column;
 counter-reset: product-row;
 border: 1px solid #e5e7eb;
 border-radius: 14px;
 overflow: hidden;
 background: #ffffff;
}

.product-row-compact {
 counter-increment: product-row;
 position: relative;
 display: grid;
 grid-template-columns: minmax(0, 1fr);
 gap: 3px;
 padding: 8px 10px 8px 46px;
 border-bottom: 1px solid #edf0f3;
 transition:
 background 0.18s ease,
 transform 0.18s ease,
 opacity 0.18s ease;
}

.product-row-compact::before {
 content: counter(product-row);
 position: absolute;
 left: 0;
 top: 0;
 bottom: 0;
 width: 34px;
 display: grid;
 place-items: center;
 background: #374151;
 color: #ffffff;
 font-size: 14px;
 font-weight: 900;
}

.product-row-compact:nth-child(odd) {
 background: #ffffff;
}

.product-row-compact:nth-child(even) {
 background: #f4f6f8;
}

.product-row-compact:last-child {
 border-bottom: 0;
}

.product-row-compact:hover {
 background: #f8fafc;
}

.product-main-line,
.product-dim-line {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto auto;
 align-items: center;
 gap: 6px;
 min-width: 0;
 white-space: nowrap;
}

.product-name {
 max-width: 100%;
 overflow: hidden;
 text-overflow: ellipsis;
 font-size: 17px;
 line-height: 1.15;
 font-weight: 950;
}

.product-chip {
 display: inline-flex;
 align-items: center;
 height: 20px;
 padding: 0 7px;
 border-radius: 999px;
 background: #eef6ff;
 color: #1e3a8a;
 font-size: 13px;
 font-weight: 900;
 white-space: nowrap;
}

.product-main-line [data-measure-chip],
.product-main-line .product-status-chip {
 display: none;
}

.product-main-line .product-unit-price-chip {
 background: #fff7ed;
 color: #9a3412;
}

.product-main-line .product-type-chip,
.product-main-line .product-unit-price-chip {
 display: inline-flex;
 align-self: center;
}

.product-chip.soft {
 background: #f1f5f9;
 color: #475569;
}

.product-dim-line {
 color: #475569;
 font-size: 12px;
 overflow: hidden;
 text-overflow: ellipsis;
}

.product-total-inline {
 margin-left: auto;
 color: #111827;
 font-size: 18px;
 font-weight: 900;
 white-space: nowrap;
}

.product-dim-text {
 min-width: 0;
 font-size: 15px;
 line-height: 1.2;
 font-weight: 800;
 color: #475569;
}

.product-edit-fields {
 display: none;
 grid-template-columns: repeat(4, minmax(90px, 1fr));
 gap: 8px;
 padding: 8px;
 border-radius: 12px;
 background: #f8fafc;
 animation: productsEditorOpen 0.18s ease both;
}

.product-edit-fields label,
.carpet-edit-fields label,
.fixed-edit-fields label {
 display: flex;
 flex-direction: column;
 gap: 4px;
 color: #64748b;
 font-size: 11px;
 font-weight: 800;
}

.product-edit-fields input,
.product-edit-fields select,
.product-edit-fields textarea {
 width: 100%;
 min-height: 32px;
 border: 1px solid #cbd5e1;
 border-radius: 9px;
 padding: 5px 8px;
 background: #ffffff;
 color: #0f172a;
 font-size: 13px;
}

.product-edit-fields textarea {
 min-height: 32px;
 resize: vertical;
}

.carpet-edit-fields,
.fixed-edit-fields {
 display: contents;
}

.readonly-calc {
 min-height: 32px;
 display: flex;
 align-items: center;
 padding: 5px 8px;
 border-radius: 9px;
 background: #fff7ed;
 color: #111827;
 font-size: 13px;
 font-weight: 900;
}

.product-edit-fields .notes-field {
 grid-column: span 2;
}

.product-summary-list.is-editing .product-edit-fields {
 display: grid;
}

.product-summary-list.is-editing .product-row-compact {
 background: #fbfdff;
}

.product-summary-list.is-editing .product-row-compact:nth-child(odd) {
 background: #ffffff;
}

.product-summary-list.is-editing .product-row-compact:nth-child(even) {
 background: #f4f6f8;
}

.product-row-compact[data-is-carpet="1"] [data-fixed-fields] {
 display: none;
}

.product-row-compact[data-is-carpet="0"] [data-carpet-fields] {
 display: none;
}

.products-totals {
 margin-top: 10px;
 border: 1px solid #e5e7eb;
 border-radius: 14px;
 overflow: hidden;
 background: #ffffff;
}

.products-total-row {
 display: flex;
 justify-content: space-between;
 gap: 12px;
 padding: 8px 12px;
 border-bottom: 1px solid #edf0f3;
 font-size: 14px;
}

.products-total-row:last-child {
 border-bottom: 0;
}

.products-total-row.discount strong {
 color: #b45309;
}

.products-total-row.grand-total {
 background: #f8fafc;
 font-size: 17px;
 font-weight: 900;
}

.products-editor-footer {
 position: sticky;
 bottom: 8px;
 z-index: 20;
 display: none;
 align-items: center;
 justify-content: space-between;
 gap: 10px;
 margin-top: 10px;
 padding: 10px;
 border: 1px solid #e5e7eb;
 border-radius: 14px;
 background: rgba(255, 255, 255, 0.96);
 backdrop-filter: blur(8px);
 box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
}

.order-products-card.is-editing .products-editor-footer {
 display: flex;
 animation: productsEditorOpen 0.18s ease both;
}

.product-save-status {
 color: #64748b;
 font-size: 12px;
 font-weight: 800;
}

@keyframes productsEditorOpen {
 from {
 opacity: 0.75;
 transform: translateY(4px);
 }

 to {
 opacity: 1;
 transform: none;
 }
}

@media (max-width: 768px) {
 .products-section-head {
 position: sticky;
 top: 62px;
 z-index: 19;
 margin: -6px -4px 8px;
 padding: 8px 4px;
 background: #f8fafc;
 }

 .products-inline-actions .btn {
 padding: 8px 10px;
 font-size: 12px;
 }

 .product-row-compact {
 gap: 5px;
 padding: 8px 10px 8px 44px;
 }

 .product-row-compact::before {
 width: 36px;
 font-size: 16px;
 }

 .product-main-line {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto auto;
 gap: 5px;
 min-height: 22px;
 }

 .product-name {
 max-width: 100%;
 min-width: 0;
 font-size: 15px;
 line-height: 1.15;
 font-weight: 900;
 }

 .product-chip {
 height: 18px;
 padding: 0 5px;
 font-size: 10px;
 }

 .product-main-line [data-measure-chip],
 .product-main-line .product-status-chip {
 display: none;
 }

 .product-main-line .product-type-chip,
 .product-main-line .product-unit-price-chip {
 display: inline-flex;
 flex: 0 0 auto;
 align-self: center;
 }

 .product-main-line .product-unit-price-chip {
 background: #fff7ed;
 color: #9a3412;
 }

 .product-inline-info {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 grid-template-rows: auto auto;
 align-items: center;
 column-gap: 8px;
 row-gap: 2px;
 color: #475569;
 font-size: 15px;
 line-height: 1.2;
 font-weight: 800;
 }

 .product-dim-text {
 grid-column: 1;
 grid-row: 1 / span 2;
 align-self: center;
 min-width: 0;
 overflow: hidden;
 text-overflow: ellipsis;
 font-size: 15px;
 line-height: 1.18;
 font-weight: 800;
 }

 .product-total-inline {
 grid-column: 2;
 grid-row: 1;
 margin-left: 0;
 justify-self: end;
 align-self: center;
 font-size: 17px;
 line-height: 1.1;
 }

 .product-edit-fields {
 grid-template-columns: 1fr 1fr;
 gap: 7px;
 padding: 7px;
 }

 .product-edit-fields .notes-field {
 grid-column: 1 / -1;
 }

 .products-editor-footer {
 bottom: 8px;
 flex-direction: column;
 align-items: stretch;
 }
}

@media (min-width: 901px) {
 .order-products-card form[data-products-form] {
 display: grid;
 grid-template-columns: minmax(0, 1fr) 260px;
 gap: 14px;
 align-items: start;
 }

 .order-products-card .product-summary-list {
 grid-column: 1;
 }

 .order-products-card .products-totals {
 grid-column: 2;
 margin-top: 0;
 position: sticky;
 top: calc(var(--topbar-height) + 20px);
 }

 .order-products-card .products-editor-footer {
 grid-column: 1 / -1;
 }

 .product-row-compact {
 grid-template-columns: minmax(0, 1fr);
 gap: 6px;
 padding: 10px 12px 10px 52px;
 align-items: stretch;
 }

 .product-row-compact::before {
 width: 40px;
 font-size: 18px;
 }

 .product-main-line,
 .product-inline-info {
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
 }

 .product-inline-info {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 align-items: center;
 gap: 14px;
 color: #475569;
 font-size: 15px;
 }

 .product-dim-text {
 font-size: 16px;
 }

 .product-total-inline {
 margin-left: auto;
 color: #111827;
 font-size: 20px;
 }
}

@media (min-width: 769px) and (max-width: 900px) {
 .product-inline-info {
 display: flex;
 justify-content: space-between;
 gap: 8px;
 color: #475569;
 }

 .product-dim-text {
 font-size: 15px;
 }
}

.delete-field {
 align-self: end;
}

.product-row-compact.is-deleted {
 opacity: 0.35;
 background: #fee2e2;
}

/* Sectiune 27 - adaugare produs + lista produse pe un singur rand */
.product-new-row {
 display: grid;
 grid-template-columns: minmax(180px, 1.4fr) 110px 110px 90px auto;
 gap: 8px;
 align-items: center;
 margin-top: 10px;
 padding: 10px;
 border: 1px dashed #cbd5e1;
 border-radius: 14px;
 background: #f8fafc;
}

.product-new-row input,
.product-new-row select {
 min-height: 38px;
}

.product-inline-info {
 min-width: 0;
}

.product-row-compact.is-deleted .product-total-inline {
 text-decoration: line-through;
}

@media (max-width: 900px) {
 .product-new-row {
 grid-template-columns: 1fr 1fr;
 }

 .product-new-row select,
 .product-new-row button {
 grid-column: 1 / -1;
 }
}

/* =========================================================
 Sectiune 30 CLEAN MODALS - EDIT CLIENT + PRODUSE
 IMPORTANT: acest bloc inlocuieste complet Sectiune 28/29 modal.
 Nu foloseste backdrop-filter ca sa nu mai apara modalul blurat.
 ========================================================= */

html.modal-hard-lock,
body.modal-open,
body.products-measure-modal-open,
body.order-edit-modal-open {
 overflow: hidden !important;
}

/* -----------------------------
 MODAL EDIT CLIENT / COMANDA
 HTML real: .order-edit-modal-backdrop > .order-edit-modal-card
 ----------------------------- */
.order-edit-modal-backdrop {
 position: fixed !important;
 inset: var(--topbar-height, 76px) 0 0 0 !important;
 z-index: 9000 !important;

 display: none !important;
 align-items: flex-start !important;
 justify-content: center !important;

 width: 100vw !important;
 height: calc(100vh - var(--topbar-height, 76px)) !important;
 height: calc(100dvh - var(--topbar-height, 76px)) !important;

 padding: 14px 18px 18px !important;
 overflow: hidden !important;

 background: rgba(15, 23, 42, 0.68) !important;
 backdrop-filter: none !important;
 -webkit-backdrop-filter: none !important;
}

.order-edit-modal-backdrop.is-open {
 display: flex !important;
}

.order-edit-modal-card {
 position: relative !important;
 z-index: 9001 !important;

 width: min(1180px, calc(100vw - 36px)) !important;
 max-width: min(1180px, calc(100vw - 36px)) !important;

 height: auto !important;
 max-height: calc(100vh - var(--topbar-height, 76px) - 32px) !important;
 max-height: calc(100dvh - var(--topbar-height, 76px) - 32px) !important;

 margin: 0 auto !important;
 padding: 0 !important;

 display: flex !important;
 flex-direction: column !important;

 overflow: hidden !important;

 border: 1px solid #e5e7eb !important;
 border-radius: 22px !important;
 background: #ffffff !important;
 color: #0f172a !important;
 box-shadow: 0 30px 100px rgba(0, 0, 0, 0.42) !important;

 filter: none !important;
 backdrop-filter: none !important;
 -webkit-backdrop-filter: none !important;
}

.order-edit-modal-head {
 flex: 0 0 auto !important;
 position: relative !important;
 z-index: 2 !important;

 display: flex !important;
 align-items: flex-start !important;
 justify-content: space-between !important;
 gap: 14px !important;

 padding: 16px 18px !important;
 border-bottom: 1px solid #e5e7eb !important;
 background: #ffffff !important;
 overflow: hidden !important;
 isolation: isolate;
 transition:
 border-color 0.25s ease,
 box-shadow 0.25s ease !important;
}

.order-edit-modal-head::before,
.order-edit-modal-head::after {
 content: "";
 position: absolute;
 inset: 0;
 z-index: 0;
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;
 opacity: 0;
 transform: scale(1.02);
 transition:
 opacity 0.35s ease,
 transform 0.6s ease;
}

.order-edit-modal-head::before {
 background-image: url("../img/order-edit-head-inhouse.jpg");
}

.order-edit-modal-head::after {
 background-image: url("../img/order-edit-head-delivery.jpg");
}

.order-edit-modal-backdrop.is-flow-inhouse .order-edit-modal-head::before,
.order-edit-modal-backdrop.is-flow-delivery .order-edit-modal-head::after {
 opacity: 0.42;
 transform: scale(1);
}

.order-edit-modal-head > * {
 position: relative;
 z-index: 1;
}

.order-edit-modal-head::selection {
 background: rgba(255, 122, 0, 0.25);
}

.order-edit-modal-head:before {
 filter: saturate(1.04) contrast(1.02);
}

.order-edit-modal-backdrop.is-flow-delivery .order-edit-modal-head {
 border-bottom-color: rgba(37, 99, 235, 0.22) !important;
 box-shadow: inset 0 -1px 0 rgba(37, 99, 235, 0.08) !important;
}

.order-edit-modal-backdrop.is-flow-inhouse .order-edit-modal-head {
 border-bottom-color: rgba(255, 122, 0, 0.22) !important;
 box-shadow: inset 0 -1px 0 rgba(255, 122, 0, 0.08) !important;
}

.order-edit-modal-head > div:first-child {
 max-width: 720px;
 padding: 10px 14px;
 border-radius: 16px;
 background: rgba(255, 255, 255, 0.62);
 box-shadow: 0 12px 34px rgba(15, 23, 42, 0.08);
 backdrop-filter: blur(7px);
 -webkit-backdrop-filter: blur(7px);
}

.order-edit-modal-head h3 {
 margin: 0 !important;
}

.order-edit-form {
 flex: 1 1 auto !important;
 min-height: 0 !important;

 display: flex !important;
 flex-direction: column !important;

 overflow: hidden !important;
 background: #f8fafc !important;
}

.order-edit-grid {
 flex: 1 1 auto !important;
 min-height: 0 !important;

 display: grid !important;
 grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
 gap: 12px !important;

 padding: 14px !important;
 overflow-y: auto !important;
 overflow-x: hidden !important;
 -webkit-overflow-scrolling: touch !important;
}

.order-edit-section {
 display: grid !important;
 gap: 10px !important;
 align-content: start !important;

 min-width: 0 !important;
 padding: 14px !important;

 border: 1px solid #e5e7eb !important;
 border-radius: 16px !important;
 background: #ffffff !important;
}

.order-edit-section h4 {
 margin: 0 0 2px !important;
 font-size: 15px !important;
}

.order-edit-section label {
 display: grid !important;
 gap: 5px !important;
 color: #64748b !important;
 font-size: 12px !important;
 font-weight: 900 !important;
}

.order-edit-section label.wide,
.order-edit-section .wide {
 grid-column: 1 / -1 !important;
}

.order-edit-section input,
.order-edit-section select,
.order-edit-section textarea {
 width: 100% !important;
 min-height: 42px !important;
 border: 1px solid #cbd5e1 !important;
 border-radius: 12px !important;
 padding: 10px 11px !important;
 background: #ffffff !important;
 color: #0f172a !important;
 font: inherit !important;
}

.order-edit-section input[name="pickup_scheduled_date"]:disabled,
.order-edit-section input[name="pickup_scheduled_time"]:disabled {
 background: #e2e8f0 !important;
 border-color: #cbd5e1 !important;
 color: #64748b !important;
 -webkit-text-fill-color: #64748b !important;
 box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.08) !important;
 cursor: not-allowed !important;
 opacity: 1 !important;
}

.order-edit-section textarea {
 min-height: 78px !important;
 resize: vertical !important;
}

.order-edit-check {
 display: flex !important;
 grid-template-columns: none !important;
 align-items: center !important;
 gap: 8px !important;
}

.order-edit-check input {
 width: auto !important;
 min-height: 0 !important;
}

.order-edit-form .is-hidden-for-inhouse {
 display: none !important;
}

.order-edit-modal-backdrop.is-flow-inhouse [data-address-field],
.order-edit-modal-backdrop.is-flow-inhouse [data-logistics-field] {
 display: none !important;
}

.order-flow-choice-field {
 display: grid;
 gap: 7px;
}

.order-flow-choice-field > span {
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
}

.order-flow-choice {
 width: fit-content;
 display: inline-flex;
 align-items: center;
 gap: 4px;
 padding: 4px;
 border: 1px solid rgba(226, 232, 240, 0.9);
 border-radius: 999px;
 background: rgba(255, 255, 255, 0.76);
 box-shadow: 0 8px 18px rgba(15, 23, 42, 0.07);
}

.order-flow-choice button {
 min-width: 68px;
 height: 28px;
 border: 0;
 border-radius: 999px;
 padding: 0 11px;
 background: transparent;
 color: #64748b;
 font-size: 12px;
 font-weight: 950;
 cursor: pointer;
}

.order-flow-choice button:hover {
 background: #f1f5f9;
 color: #0f172a;
}

.order-flow-choice button.is-active {
 background: #0f172a;
 color: #ffffff;
 box-shadow: 0 6px 14px rgba(15, 23, 42, 0.18);
}

.order-edit-modal-footer {
 flex: 0 0 auto !important;

 display: flex !important;
 justify-content: flex-end !important;
 gap: 10px !important;

 padding: 14px 16px !important;
 border-top: 1px solid #e5e7eb !important;
 background: #ffffff !important;
}

/* -----------------------------
 MODAL PRODUSE / MASURARE
 HTML real: cardul .order-products-card devine modal cand are .is-editing
 ----------------------------- */
body.products-measure-modal-open::before {
 content: "" !important;
 display: block !important;
 position: fixed !important;
 inset: 0 !important;
 z-index: 9100 !important;
 background: rgba(15, 23, 42, 0.62) !important;
 backdrop-filter: none !important;
 -webkit-backdrop-filter: none !important;
 pointer-events: none !important;
}

body.products-measure-modal-open .order-products-card.is-editing {
 position: fixed !important;
 z-index: 9101 !important;

 top: 16px !important;
 left: 50% !important;
 right: auto !important;
 bottom: auto !important;

 width: min(1220px, calc(100vw - 32px)) !important;
 max-width: min(1220px, calc(100vw - 32px)) !important;
 height: calc(100vh - 32px) !important;
 height: calc(100dvh - 32px) !important;
 max-height: calc(100vh - 32px) !important;
 max-height: calc(100dvh - 32px) !important;

 margin: 0 !important;
 padding: 0 !important;
 transform: translateX(-50%) !important;

 display: flex !important;
 flex-direction: column !important;

 overflow: hidden !important;

 border: 1px solid #e5e7eb !important;
 border-radius: 22px !important;
 background: #ffffff !important;
 color: #0f172a !important;
 box-shadow: 0 30px 100px rgba(0, 0, 0, 0.42) !important;

 filter: none !important;
 backdrop-filter: none !important;
 -webkit-backdrop-filter: none !important;
}

body.products-measure-modal-open .order-products-card.is-editing:hover {
 transform: translateX(-50%) !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .products-section-head {
 flex: 0 0 auto !important;
 position: relative !important;
 top: auto !important;
 z-index: 2 !important;

 margin: 0 !important;
 padding: 14px 16px !important;
 border-bottom: 1px solid #e5e7eb !important;
 background: #ffffff !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 form[data-products-form] {
 flex: 1 1 auto !important;
 min-height: 0 !important;

 display: grid !important;
 grid-template-columns: minmax(0, 1fr) 290px !important;
 grid-template-rows: minmax(0, 1fr) auto !important;
 gap: 12px !important;

 padding: 12px !important;
 overflow: hidden !important;
 background: #f8fafc !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .product-summary-list {
 grid-column: 1 !important;
 grid-row: 1 !important;

 min-height: 0 !important;
 height: auto !important;
 max-height: none !important;

 overflow-y: auto !important;
 overflow-x: hidden !important;
 -webkit-overflow-scrolling: touch !important;
 overscroll-behavior: contain !important;

 border-radius: 16px !important;
 background: #ffffff !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .products-totals {
 grid-column: 2 !important;
 grid-row: 1 !important;
 align-self: start !important;

 width: 100% !important;
 margin: 0 !important;
 position: relative !important;
 top: auto !important;

 border-radius: 16px !important;
 background: #ffffff !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .products-editor-footer {
 grid-column: 1 / -1 !important;
 grid-row: 2 !important;

 flex: 0 0 auto !important;
 position: relative !important;
 bottom: auto !important;
 z-index: 2 !important;

 display: flex !important;
 margin: 0 !important;

 border-radius: 16px !important;
 background: #ffffff !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .product-edit-fields {
 grid-template-columns: repeat(4, minmax(100px, 1fr)) !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 [data-product-width],
body.products-measure-modal-open
 .order-products-card.is-editing
 [data-product-length] {
 min-height: 52px !important;
 font-size: 24px !important;
 font-weight: 900 !important;
 text-align: center !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .readonly-calc {
 min-height: 52px !important;
 justify-content: center !important;
 font-size: 17px !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row {
 grid-column: 1 / -1 !important;
 margin: 0 !important;
 background: #fff7ed !important;
 border-color: #fed7aa !important;
}

@media (max-width: 900px) {
 body.products-measure-modal-open::before {
 inset: var(--topbar-height) 0 0 0 !important;
 background: rgba(15, 23, 42, 0.48) !important;
 }

 .order-edit-modal-backdrop {
 inset: var(--topbar-height, 58px) 0 0 0 !important;
 height: calc(100vh - var(--topbar-height, 58px)) !important;
 height: calc(100dvh - var(--topbar-height, 58px)) !important;
 padding: 8px 0 0 !important;
 align-items: stretch !important;
 }

 .order-edit-modal-card {
 width: 100vw !important;
 max-width: 100vw !important;
 min-height: 0 !important;
 height: calc(100vh - var(--topbar-height, 58px) - 8px) !important;
 height: calc(100dvh - var(--topbar-height, 58px) - 8px) !important;
 max-height: calc(100vh - var(--topbar-height, 58px) - 8px) !important;
 max-height: calc(100dvh - var(--topbar-height, 58px) - 8px) !important;
 border-radius: 0 !important;
 top: auto !important;
 }

 .order-edit-grid {
 grid-template-columns: 1fr !important;
 gap: 10px !important;
 padding: 10px !important;
 }

 .order-edit-modal-footer {
 display: grid !important;
 grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
 flex: 0 0 auto !important;
 gap: 8px !important;
 padding: 10px !important;
 padding-bottom: calc(12px + env(safe-area-inset-bottom)) !important;
 }

 .order-edit-modal-footer .btn,
 body.products-measure-modal-open
 .order-products-card.is-editing
 .products-editor-footer
 .btn {
 width: 100% !important;
 min-width: 0 !important;
 min-height: 38px !important;
 padding: 8px 10px !important;
 font-size: 13px !important;
 line-height: 1.1 !important;
 white-space: nowrap !important;
 }

 /* FIX: modalul de produse este fixed, deci trebuie sa inceapa sub topbar.
 Nu folosim inset:0/top:0 pentru ca intra sub headerul sticky. */
 body.products-measure-modal-open .order-products-card.is-editing {
 top: var(--products-modal-mobile-top) !important;
 left: 0 !important;
 right: 0 !important;
 bottom: auto !important;

 width: 100vw !important;
 max-width: 100vw !important;
 min-height: 0 !important;

 height: calc(100vh - var(--products-modal-mobile-top)) !important;
 height: calc(100dvh - var(--products-modal-mobile-top)) !important;
 max-height: calc(100vh - var(--products-modal-mobile-top)) !important;
 max-height: calc(100dvh - var(--products-modal-mobile-top)) !important;

 border-radius: 0 !important;
 box-shadow: none !important;
 transform: none !important;
 }

 body.products-measure-modal-open .order-products-card.is-editing:hover {
 transform: none !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .products-section-head {
 position: relative !important;
 top: auto !important;
 padding: 12px 14px !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 form[data-products-form] {
 flex: 1 1 auto !important;
 min-height: 0 !important;
 height: auto !important;
 display: flex !important;
 flex-direction: column !important;
 gap: 10px !important;
 padding: 10px !important;
 overflow: hidden !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-summary-list {
 flex: 1 1 auto !important;
 min-height: 0 !important;
 width: 100% !important;
 grid-column: auto !important;
 grid-row: auto !important;
 overflow-y: auto !important;
 overflow-x: hidden !important;
 -webkit-overflow-scrolling: touch !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .products-totals,
 body.products-measure-modal-open
 .order-products-card.is-editing
 .products-editor-footer {
 flex: 0 0 auto !important;
 width: 100% !important;
 grid-column: auto !important;
 grid-row: auto !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .products-editor-footer {
 display: grid !important;
 grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
 flex: 0 0 auto !important;
 gap: 8px !important;
 margin: 0 !important;
 padding: 10px !important;
 padding-bottom: calc(10px + env(safe-area-inset-bottom)) !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-save-status {
 display: none !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .products-editor-footer
 [data-products-cancel-footer] {
 grid-column: 1 !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .products-editor-footer
 [data-products-save] {
 grid-column: 2 !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-edit-fields {
 grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
 gap: 8px !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-type-field,
 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-status-field,
 body.products-measure-modal-open .order-products-card.is-editing .notes-field,
 body.products-measure-modal-open
 .order-products-card.is-editing
 .delete-field {
 grid-column: 1 / -1 !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 [data-carpet-fields],
 body.products-measure-modal-open
 .order-products-card.is-editing
 [data-fixed-fields] {
 display: grid !important;
 grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
 grid-column: 1 / -1 !important;
 gap: 8px !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 [data-carpet-fields]
 label,
 body.products-measure-modal-open
 .order-products-card.is-editing
 [data-fixed-fields]
 label {
 min-width: 0 !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-row-compact[data-is-carpet="1"]
 [data-fixed-fields] {
 display: none !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-row-compact[data-is-carpet="0"]
 [data-carpet-fields] {
 display: none !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 [data-product-width],
 body.products-measure-modal-open
 .order-products-card.is-editing
 [data-product-length] {
 min-height: 46px !important;
 font-size: 20px !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row {
 display: grid;
 grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
 gap: 8px !important;
 margin: 0 10px 10px !important;
 padding: 12px !important;
 border: 1px solid #fed7aa !important;
 border-radius: 16px !important;
 background: #fff7ed !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row[style*="display:none"] {
 display: none !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row
 select,
 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row
 input {
 min-width: 0 !important;
 min-height: 42px !important;
 border: 1px solid #cbd5e1 !important;
 border-radius: 12px !important;
 padding: 8px 10px !important;
 background: #ffffff !important;
 font-weight: 900 !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row
 select {
 grid-column: 1 / -1 !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row
 [name="quantity"] {
 grid-column: 1 / -1 !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row
 .btn {
 width: 100% !important;
 min-width: 0 !important;
 min-height: 38px !important;
 padding: 8px 10px !important;
 font-size: 13px !important;
 white-space: nowrap !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row
 .btn.good {
 grid-column: 1 !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row
 [data-new-product-cancel] {
 grid-column: 2 !important;
 }
}

/* Orders list day separators stay sticky under the fixed topbar */
.order-day-mobile-separator,
.orders-table-alpha36 .order-day-separator-cell {
 position: sticky !important;
 top: calc(var(--topbar-height) + 2px) !important;
 z-index: 95 !important;
}

.orders-table-alpha36 .order-day-separator-row {
 position: sticky !important;
 top: calc(var(--topbar-height) + 2px) !important;
 z-index: 94 !important;
}

.orders-page,
.orders-list-shell,
.orders-desktop-table.table-wrap,
.orders-desktop-table.card {
 overflow: visible !important;
 transform: none !important;
}

.page:has(.orders-page),
.orders-page,
.orders-list-shell,
.orders-list-shell.is-compact,
.orders-compact-list {
 overflow: visible !important;
 overflow-x: visible !important;
 overflow-y: visible !important;
 transform: none !important;
}

.orders-compact-list .order-day-mobile-separator {
 position: sticky !important;
 top: calc(var(--topbar-height) + 2px) !important;
 z-index: 110 !important;
 align-self: start !important;
}

.order-day-mobile-separator-fixed {
 position: fixed !important;
 display: none;
 z-index: 1300 !important;
 margin: 0 !important;
 pointer-events: none;
 transition: transform 0.12s ease;
}

.order-day-mobile-separator-fixed.is-active {
 display: block;
}

/* Order view sections + topbar filter */
.topbar-filter-btn {
 flex: 0 0 auto;
 border-color: #fed7aa;
 background: #fff7ed;
 color: #111827;
}

.topbar-filter-btn:hover,
.topbar-filter-btn:focus {
 border-color: #ff7a00;
 box-shadow: 0 10px 24px rgba(249, 115, 22, 0.18);
 outline: none;
}

.order-mode-pill {
 gap: 4px;
 font-size: 20px !important;
}

.order-number-badge {
 font-size: 22px !important;
}

.order-location-map {
 display: grid;
 grid-template-columns: minmax(0, 0.9fr) minmax(220px, 1.1fr);
 gap: 12px;
 align-items: stretch;
 margin-top: 12px;
 border: 1px solid #bfdbfe;
 border-radius: 18px;
 padding: 10px;
 background: linear-gradient(135deg, #eff6ff, #ffffff 68%);
}

.order-location-map > div {
 display: grid;
 align-content: center;
 gap: 4px;
 min-width: 0;
}

.order-location-map strong {
 color: #0f172a;
 font-size: 14px;
}

.order-location-map span {
 color: #475569;
 font-size: 12px;
 font-weight: 800;
 overflow-wrap: anywhere;
}

.order-location-map .order-map-unavailable {
 min-height: 150px;
}

.order-location-map iframe {
 width: 100%;
 min-height: 150px;
 border: 0;
 border-radius: 14px;
 background: #e5e7eb;
}

.order-hero-card,
.order-products-card,
.previous-orders-card,
.order-history-card,
.status-panel {
 animation: orderSectionIn 0.28s ease both;
 transition:
 background 0.22s ease,
 box-shadow 0.22s ease,
 transform 0.22s ease;
}

.order-hero-card {
 background: linear-gradient(180deg, #ffffff, #fff7ed);
}

.order-products-card {
 background: linear-gradient(180deg, #ffffff, #f8fafc);
}

.previous-orders-card {
 background: linear-gradient(180deg, #ffffff, #eef6ff);
}

.order-history-card {
 background: linear-gradient(180deg, #ffffff, #f8fafc);
}

.status-panel {
 background: linear-gradient(180deg, #ffffff, #f0fdf4);
}

@keyframes orderSectionIn {
 from {
 opacity: 0.82;
 transform: translateY(6px);
 }

 to {
 opacity: 1;
 transform: none;
 }
}

@media (max-width: 760px) {
 .layout-order {
 gap: 12px;
 }

 .order-location-map {
 grid-template-columns: 1fr;
 gap: 8px;
 border-radius: 16px;
 }

 .order-location-map iframe {
 min-height: 136px;
 }

 .order-hero-card {
 position: sticky;
 top: var(--topbar-height);
 z-index: 20;
 max-height: 42vh;
 overflow: auto;
 }

 .order-products-card .products-section-head,
 .previous-orders-card .card-toolbar,
 .order-history-card .order-history-toolbar,
 .status-panel > h3 {
 position: sticky;
 z-index: 19;
 margin-left: -10px;
 margin-right: -10px;
 padding: 10px 12px;
 border-radius: 14px;
 backdrop-filter: blur(12px);
 -webkit-backdrop-filter: blur(12px);
 box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08);
 }

 .order-products-card .products-section-head {
 top: calc(var(--topbar-height) + 8px);
 background: rgba(248, 250, 252, 0.94);
 }

 .previous-orders-card .card-toolbar {
 top: calc(var(--topbar-height) + 48px);
 background: rgba(239, 246, 255, 0.94);
 }

 .order-history-card .order-history-toolbar {
 top: calc(var(--topbar-height) + 88px);
 background: rgba(255, 247, 237, 0.95);
 }

 .status-panel {
 position: static;
 }

 .status-panel > h3 {
 top: calc(var(--topbar-height) + 128px);
 background: rgba(240, 253, 244, 0.95);
 margin-top: 0;
 }
}

/* =========================================================
 Sectiune 31 - HEADER DREAPTA + NOTIFICARI + UTILIZATORI
 ========================================================= */
.topbar {
 grid-template-columns: minmax(0, 1fr) auto !important;
 align-items: center !important;
}

.topbar-main {
 min-width: 0 !important;
}

.header-right-actions {
 display: flex;
 align-items: center;
 justify-content: flex-end;
 gap: 12px;
 min-width: 0;
}

.header-shortcuts {
 display: flex !important;
 align-items: center !important;
 justify-content: flex-end !important;
 gap: 8px !important;
 order: initial !important;
 grid-column: auto !important;
 width: auto !important;
 padding: 0 !important;
 border: 0 !important;
 overflow: visible !important;
}

.header-icon-btn {
 position: relative;
 flex: 0 0 auto;
 text-decoration: none;
}

.header-notifications {
 position: relative;
 flex: 0 0 auto;
}

.notification-toggle {
 position: relative;
}

.notification-badge {
 position: absolute;
 top: -7px;
 left: -7px;
 min-width: 21px;
 height: 21px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 padding: 0 6px;
 border-radius: 999px;
 background: #dc2626;
 color: #ffffff;
 font-size: 11px;
 font-weight: 950;
 line-height: 1;
 box-shadow: 0 4px 12px rgba(220, 38, 38, 0.32);
}

.notification-menu {
 position: absolute;
 top: calc(100% + 10px);
 right: 0;
 z-index: 200;
 width: min(340px, calc(100vw - 24px));
 display: none;
 overflow: hidden;
 border: 1px solid #e5e7eb;
 border-radius: 18px;
 background: #ffffff;
 box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
}

.header-notifications.is-open .notification-menu {
 display: block;
}

.notification-head {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 10px;
 padding: 13px 14px;
 border-bottom: 1px solid #e5e7eb;
 background: #f8fafc;
}

.notification-head span {
 min-width: 22px;
 height: 22px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border-radius: 999px;
 background: #fee2e2;
 color: #991b1b;
 font-size: 12px;
 font-weight: 950;
}

.notification-item {
 display: grid;
 grid-template-columns: 32px minmax(0, 1fr);
 gap: 10px;
 padding: 12px 14px;
 border-bottom: 1px solid #f1f5f9;
}

.notification-item:last-child {
 border-bottom: 0;
}

.notification-item > span {
 width: 32px;
 height: 32px;
 display: grid;
 place-items: center;
 border-radius: 12px;
 background: #fff7ed;
}

.notification-item strong,
.notification-item small {
 display: block;
 min-width: 0;
}

.notification-item strong {
 color: #0f172a;
 font-size: 13px;
 line-height: 1.2;
}

.notification-item small {
 margin-top: 3px;
 color: #64748b;
 font-size: 12px;
 line-height: 1.35;
}

.notification-empty {
 padding: 18px 14px;
 color: #64748b;
 text-align: center;
 font-weight: 800;
}

/* Users admin */
.users-toolbar {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 margin-bottom: 14px;
}

.users-grid {
 display: grid;
 grid-template-columns: minmax(0, 1fr) 390px;
 gap: 16px;
 align-items: start;
}

.users-table td,
.users-table th {
 vertical-align: middle;
}

.role-pill {
 display: inline-flex;
 align-items: center;
 border-radius: 999px;
 padding: 6px 10px;
 background: #eef2ff;
 color: #3730a3;
 font-size: 12px;
 font-weight: 900;
}

.user-form-card {
 position: sticky;
 top: calc(var(--topbar-height) + 18px);
}

.user-form-card h3 {
 margin: 0 0 10px;
}

.user-form-grid {
 display: grid;
 gap: 10px;
}

.user-form-grid label {
 display: grid;
 gap: 5px;
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
}

.user-actions-inline {
 display: flex;
 flex-wrap: wrap;
 justify-content: flex-end;
 gap: 8px;
}

@media (max-width: 900px) {
 .topbar {
 grid-template-columns: minmax(0, 1fr) auto !important;
 gap: 8px !important;
 }

 .header-title-block p {
 display: none !important;
 }

 .header-right-actions {
 gap: 6px;
 }

 .header-shortcuts {
 gap: 5px !important;
 }

 .header-icon-btn,
 .menu-trigger {
 width: 38px !important;
 height: 38px !important;
 min-width: 38px !important;
 border-radius: 13px !important;
 font-size: 17px !important;
 }

 .userbox {
 display: none !important;
 }

 .notification-menu {
 right: -6px;
 width: min(320px, calc(100vw - 16px));
 }

 .users-grid {
 grid-template-columns: 1fr;
 }

 .user-form-card {
 position: static;
 }
}

@media (max-width: 430px) {
 .header-icon-btn,
 .menu-trigger {
 width: 34px !important;
 height: 34px !important;
 min-width: 34px !important;
 border-radius: 11px !important;
 font-size: 15px !important;
 }

 .notification-badge {
 top: -6px;
 left: -6px;
 min-width: 18px;
 height: 18px;
 font-size: 10px;
 }
}

/* =========================================================
 Sectiune 31.1 - FIX HEADER DREAPTA + USER MENU
 Pune la finalul app.css sau foloseste fisierul inclus in zip.
 ========================================================= */
.topbar {
 grid-template-columns: minmax(0, 1fr) auto !important;
 align-items: center !important;
}

.header-right-actions {
 display: flex !important;
 align-items: center !important;
 justify-content: flex-end !important;
 gap: 10px !important;
 min-width: max-content !important;
}

.header-right-actions .header-shortcuts {
 display: flex !important;
 align-items: center !important;
 justify-content: flex-end !important;
 flex-wrap: nowrap !important;
 gap: 7px !important;
 width: auto !important;
 min-width: max-content !important;
 padding: 0 !important;
 margin: 0 !important;
 border: 0 !important;
 overflow: visible !important;
}

.header-right-actions .header-icon-btn,
.header-right-actions .notification-toggle {
 display: inline-flex !important;
 align-items: center !important;
 justify-content: center !important;
 flex: 0 0 auto !important;
 width: 42px !important;
 height: 42px !important;
 min-width: 42px !important;
 padding: 0 !important;
 text-decoration: none !important;
 line-height: 1 !important;
}

.userbox-dropdown {
 position: relative !important;
 display: flex !important;
 align-items: center !important;
 flex: 0 0 auto !important;
}

.userbox-trigger {
 display: flex !important;
 align-items: center !important;
 gap: 10px !important;
 border: 0 !important;
 padding: 0 !important;
 background: transparent !important;
 cursor: pointer !important;
}

.user-menu {
 position: absolute !important;
 top: calc(100% + 10px) !important;
 right: 0 !important;
 z-index: 250 !important;
 width: 260px !important;
 display: none !important;
 overflow: hidden !important;
 border: 1px solid #e5e7eb !important;
 border-radius: 18px !important;
 background: #ffffff !important;
 box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22) !important;
}

.userbox-dropdown:hover .user-menu,
.userbox-dropdown:focus-within .user-menu {
 display: block !important;
}

.user-menu-head {
 padding: 13px 14px !important;
 border-bottom: 1px solid #e5e7eb !important;
 background: #f8fafc !important;
}

.user-menu-head strong,
.user-menu-head small {
 display: block !important;
}

.user-menu-head small {
 margin-top: 3px !important;
 color: #64748b !important;
 font-size: 12px !important;
}

.user-menu a {
 display: flex !important;
 align-items: center !important;
 gap: 8px !important;
 padding: 12px 14px !important;
 border-bottom: 1px solid #f1f5f9 !important;
 color: #0f172a !important;
 text-decoration: none !important;
 font-weight: 800 !important;
}

.user-menu a:hover {
 background: #fff7ed !important;
}

.user-menu a:last-child {
 border-bottom: 0 !important;
}

@media (max-width: 900px) {
 .topbar {
 grid-template-columns: minmax(0, 1fr) auto !important;
 }

 .header-right-actions {
 gap: 6px !important;
 }

 .header-right-actions .header-shortcuts {
 gap: 5px !important;
 }

 .header-right-actions .header-icon-btn,
 .header-right-actions .notification-toggle,
 .menu-trigger {
 width: 36px !important;
 height: 36px !important;
 min-width: 36px !important;
 border-radius: 12px !important;
 font-size: 16px !important;
 }

 .userbox-dropdown {
 display: flex !important;
 }

 .userbox-text {
 display: none !important;
 }

 .avatar {
 width: 34px !important;
 height: 34px !important;
 }

 .user-menu {
 right: 0 !important;
 width: min(260px, calc(100vw - 16px)) !important;
 }
}

@media (max-width: 430px) {
 .header-title-block h1 {
 max-width: 120px !important;
 }

 .header-right-actions .header-icon-btn,
 .header-right-actions .notification-toggle,
 .menu-trigger {
 width: 33px !important;
 height: 33px !important;
 min-width: 33px !important;
 font-size: 15px !important;
 }
}

.orders-filter-modal-backdrop {
 position: fixed;
 inset: 0;
 z-index: 9500;
 display: none;
 align-items: center;
 justify-content: center;
 min-height: 100vh;
 min-height: 100dvh;
 padding: calc(var(--topbar-height, 64px) + 14px) 18px 18px;
 overflow-y: auto;
 background: rgba(15, 23, 42, 0.58);
}

.orders-filter-modal-backdrop.is-open {
 display: flex;
}

.orders-filter-modal-card {
 width: min(760px, calc(100vw - 36px));
 max-height: calc(100dvh - var(--topbar-height, 64px) - 32px);
 margin: auto;

 overflow: hidden;
 display: flex;
 flex-direction: column;

 background: #fff;
 border-radius: 24px;
 box-shadow: 0 30px 100px rgba(0, 0, 0, 0.38);

 transform: scale(1);
 transform-origin: center center;
 opacity: 1;

 animation: none;
}

.orders-filter-modal-backdrop.is-closing .orders-filter-modal-card {
 animation: filterModalZoomOut 0.18s ease forwards;
}

@keyframes filterModalZoomIn {
 from {
 transform: scale(0.12);
 opacity: 0;
 }
 to {
 transform: scale(1);
 opacity: 1;
 }
}

@keyframes filterModalZoomOut {
 from {
 transform: scale(1);
 opacity: 1;
 }
 to {
 transform: scale(0.12);
 opacity: 0;
 }
}

.orders-filter-modal-head {
 display: flex;
 justify-content: space-between;
 gap: 16px;
 padding: 22px;
 border-bottom: 1px solid #e5e7eb;
}

.orders-filter-modal-head h3 {
 margin: 0;
 font-size: 22px;
}

.orders-filter-modal-head p {
 margin: 6px 0 0;
 color: #64748b;
}

.orders-filter-form {
 flex: 1;
 min-height: 0;
 display: flex;
 flex-direction: column;
}

.orders-filter-grid {
 flex: 1;
 min-height: 0;
 overflow-y: auto;
 padding: 22px;
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 16px;
}

.orders-filter-grid label {
 display: grid;
 gap: 7px;
 font-weight: 800;
 color: #475569;
}

.orders-filter-grid input,
.orders-filter-grid select {
 width: 100%;
 min-height: 46px;
 border-radius: 14px;
 border: 1px solid #cbd5e1;
 padding: 0 14px;
 font-weight: 800;
 background: #fff;
}

.orders-filter-actions {
 display: flex;
 justify-content: flex-end;
 gap: 12px;
 padding: 16px 22px;
 border-top: 1px solid #e5e7eb;
 background: #fff;
}

@media (max-width: 760px) {
 .orders-filter-modal-backdrop {
 align-items: center;
 justify-content: center;
 padding: calc(var(--topbar-height, 58px) + 10px) 10px 12px;
 }

 .orders-filter-modal-card {
 width: min(100%, 560px);
 min-height: 0;
 height: auto;
 max-height: calc(100vh - var(--topbar-height, 58px) - 22px);
 max-height: calc(100dvh - var(--topbar-height, 58px) - 22px);
 border-radius: 20px;
 }

 .orders-filter-form {
 min-height: 0;
 }

 .orders-filter-actions {
 flex: 0 0 auto;
 position: relative;
 z-index: 2;
 gap: 8px;
 padding: 10px;
 padding-bottom: calc(12px + env(safe-area-inset-bottom));
 }

 .orders-filter-grid {
 grid-template-columns: 1fr;
 padding: 14px;
 gap: 12px;
 }

 .orders-filter-actions {
 display: grid;
 grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
 }

 .orders-filter-actions .btn {
 width: 100%;
 min-width: 0;
 min-height: 38px;
 padding: 8px 10px;
 font-size: 13px;
 line-height: 1.1;
 white-space: nowrap;
 }
}

/* Emergency rollback: order view mobile uses one page scroll, no sticky cards */
@media (max-width: 760px) {
 .layout-order,
 .layout-order .grid,
 .order-head-card,
 .order-hero-card,
 .order-products-card,
 .previous-orders-card,
 .order-history-card,
 .status-panel {
 position: relative !important;
 top: auto !important;
 bottom: auto !important;
 z-index: auto !important;
 height: auto !important;
 max-height: none !important;
 min-height: 0 !important;
 overflow: visible !important;
 overflow-x: visible !important;
 overflow-y: visible !important;
 }

 .order-hero-card .order-hero-top,
 .order-products-card .products-section-head,
 .previous-orders-card .card-toolbar,
 .order-history-card .order-history-toolbar,
 .status-panel > h3,
 .products-section-head {
 position: static !important;
 top: auto !important;
 bottom: auto !important;
 z-index: auto !important;
 margin-left: 0 !important;
 margin-right: 0 !important;
 border-radius: 0 !important;
 box-shadow: none !important;
 backdrop-filter: none !important;
 -webkit-backdrop-filter: none !important;
 }

 .order-hero-card .order-hero-top {
 display: flex !important;
 flex-direction: column !important;
 align-items: flex-start !important;
 gap: 12px !important;
 margin-bottom: 16px !important;
 padding: 0 !important;
 border: 0 !important;
 background: transparent !important;
 }

 .order-products-card .products-section-head,
 .previous-orders-card .card-toolbar,
 .order-history-card .order-history-toolbar {
 padding: 0 0 10px !important;
 background: transparent !important;
 }
}

/* Order view mobile spacing + products header sticky only */
@media (max-width: 760px) {
 .page:has(.layout-order) {
 padding-left: 6px !important;
 padding-right: 6px !important;
 }

 .layout-order {
 gap: 10px !important;
 }

 .layout-order > .grid {
 gap: 10px !important;
 }

 .order-head-card,
 .order-products-card,
 .previous-orders-card,
 .order-history-card,
 .status-panel {
 padding-left: 10px !important;
 padding-right: 10px !important;
 margin-left: 0 !important;
 margin-right: 0 !important;
 width: 100% !important;
 max-width: 100% !important;
 overflow: visible !important;
 height: auto !important;
 max-height: none !important;
 }

 .order-hero-card,
 .order-hero-card .order-hero-top,
 .previous-orders-card .card-toolbar,
 .order-history-card .order-history-toolbar,
 .status-panel > h3 {
 position: static !important;
 top: auto !important;
 z-index: auto !important;
 overflow: visible !important;
 max-height: none !important;
 }

 .order-products-card .products-section-head {
 position: sticky !important;
 top: calc(var(--topbar-height) + 6px) !important;
 z-index: 24 !important;
 margin-left: -10px !important;
 margin-right: -10px !important;
 padding: 10px !important;
 border-radius: 14px !important;
 background: rgba(255, 255, 255, 0.96) !important;
 box-shadow: 0 8px 22px rgba(15, 23, 42, 0.1) !important;
 backdrop-filter: blur(12px) !important;
 -webkit-backdrop-filter: blur(12px) !important;
 }

 .order-info-grid,
 .previous-orders-list,
 .product-summary-list {
 max-height: none !important;
 overflow: visible !important;
 }
}

/* Order view mobile hard width clamp */
@media (max-width: 760px) {
 html,
 body {
 overflow-x: hidden;
 }

 .main,
 .page:has(.layout-order),
 .layout-order,
 .layout-order > .grid {
 width: 100% !important;
 max-width: 100% !important;
 min-width: 0 !important;
 box-sizing: border-box !important;
 }

 .page:has(.layout-order) {
 padding-left: 4px !important;
 padding-right: 4px !important;
 overflow-x: hidden !important;
 }

 .layout-order,
 .layout-order > .grid {
 grid-template-columns: minmax(0, 1fr) !important;
 gap: 10px !important;
 }

 .layout-order .card,
 .order-head-card,
 .order-products-card,
 .previous-orders-card,
 .order-history-card,
 .status-panel {
 width: 100% !important;
 max-width: 100% !important;
 min-width: 0 !important;
 box-sizing: border-box !important;
 overflow: visible !important;
 }

 .order-head-card.order-hero-card {
 position: relative !important;
 top: auto !important;
 z-index: auto !important;
 height: auto !important;
 max-height: none !important;
 overflow: visible !important;
 }

 .order-hero-top,
 .order-identity,
 .order-number-line,
 .order-contact-line,
 .order-quick-actions,
 .order-info-grid,
 .order-info-tile,
 .previous-orders-list,
 .product-summary-list {
 width: 100% !important;
 max-width: 100% !important;
 min-width: 0 !important;
 box-sizing: border-box !important;
 }

 .order-number-line,
 .order-contact-line {
 flex-wrap: wrap !important;
 }

 .order-quick-actions {
 display: grid !important;
 grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
 gap: 8px !important;
 }

 .quick-action-btn {
 width: 100% !important;
 min-width: 0 !important;
 }

 .order-products-card .products-section-head {
 position: sticky !important;
 top: calc(var(--topbar-height) + 6px) !important;
 z-index: 24 !important;
 margin-left: -10px !important;
 margin-right: -10px !important;
 padding: 10px !important;
 border-radius: 14px !important;
 background: rgba(255, 255, 255, 0.96) !important;
 box-shadow: 0 8px 22px rgba(15, 23, 42, 0.1) !important;
 backdrop-filter: blur(12px) !important;
 -webkit-backdrop-filter: blur(12px) !important;
 }
}

/* Order view mobile descendant min-width reset */
@media (max-width: 760px) {
 .topbar,
 .topbar-main,
 .header-title-block,
 .header-shortcuts,
 .userbox,
 .page:has(.layout-order) *,
 .layout-order *,
 .order-head-card *,
 .order-products-card * {
 min-width: 0 !important;
 box-sizing: border-box !important;
 }

 .topbar,
 .main,
 .page:has(.layout-order) {
 max-width: 100vw !important;
 }

 .page:has(.layout-order) {
 width: 100vw !important;
 margin-left: 0 !important;
 margin-right: 0 !important;
 }

 .order-head-card .pill,
 .order-head-card .badge,
 .order-type-chip,
 .delivery-mode-chip,
 .contact-chip {
 max-width: 100% !important;
 white-space: normal !important;
 }

 .order-products-card {
 overflow: visible !important;
 }

 .order-products-card .products-section-head {
 position: sticky !important;
 top: calc(var(--topbar-height) + 6px) !important;
 z-index: 30 !important;
 }
}

/* Keep product header sticky: sticky breaks when page ancestors own overflow */
@media (max-width: 760px) {
 .page:has(.layout-order),
 .page:has(.layout-order) .order-hero-card,
 .page:has(.layout-order) .order-products-card,
 .page:has(.layout-order) .previous-orders-card,
 .page:has(.layout-order) .order-history-card,
 .page:has(.layout-order) .status-panel {
 animation: none !important;
 transform: none !important;
 }

 .page:has(.layout-order),
 .layout-order,
 .layout-order > .grid,
 .order-products-card {
 overflow: visible !important;
 overflow-x: visible !important;
 overflow-y: visible !important;
 }

 .order-products-card .products-section-head {
 position: -webkit-sticky !important;
 position: sticky !important;
 top: calc(var(--topbar-height) + 6px) !important;
 z-index: 40 !important;
 align-self: start !important;
 }
}

.products-section-head-fixed-spacer {
 display: none;
}

@media (max-width: 760px) {
 .order-products-card .products-section-head.is-scroll-fixed {
 position: fixed !important;
 top: var(
 --products-head-fixed-top,
 calc(var(--topbar-height) + 6px)
 ) !important;
 left: var(--products-head-fixed-left, 10px) !important;
 width: var(--products-head-fixed-width, calc(100vw - 20px)) !important;
 z-index: 80 !important;
 margin: 0 !important;
 padding: 10px !important;
 border-radius: 14px !important;
 background: rgba(255, 255, 255, 0.97) !important;
 box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14) !important;
 backdrop-filter: blur(12px) !important;
 -webkit-backdrop-filter: blur(12px) !important;
 }

 .products-section-head-fixed-spacer.is-active {
 display: block;
 }

 body.products-measure-modal-open
 .order-products-card
 .products-section-head.is-scroll-fixed {
 position: static !important;
 width: auto !important;
 margin: 0 0 10px !important;
 }
}

/* Order view section-linked sticky bars */
.layout-order .order-head-card,
.layout-order .previous-orders-card,
.layout-order .order-products-card,
.layout-order .order-message-history-card,
.layout-order .order-history-card,
.layout-order .status-panel {
 --section-accent: #ff8a00;
 border-left: 5px solid var(--section-accent);
}

.layout-order .order-head-card {
 --section-accent: #ff7a00;
}

.layout-order .previous-orders-card {
 --section-accent: #2563eb;
}

.layout-order .order-products-card {
 --section-accent: #374151;
}

.layout-order .order-message-history-card {
 --section-accent: #0ea5e9;
}

.layout-order .order-history-card {
 --section-accent: #7c3aed;
}

.layout-order .status-panel {
 --section-accent: #16a34a;
}

.section-sticky-spacer {
 display: none;
}

@media (max-width: 760px) {
 .section-sticky-spacer.is-active {
 display: block;
 }

 .layout-order .order-quick-actions.is-scroll-fixed,
 .layout-order .card-toolbar.is-scroll-fixed,
 .layout-order .products-section-head.is-scroll-fixed,
 .layout-order .order-history-toolbar.is-scroll-fixed,
 .layout-order .status-panel > h3.is-scroll-fixed {
 position: fixed !important;
 top: var(
 --section-head-fixed-top,
 calc(var(--topbar-height) + 6px)
 ) !important;
 left: var(--section-head-fixed-left, 10px) !important;
 width: var(--section-head-fixed-width, calc(100vw - 20px)) !important;
 z-index: 90 !important;
 margin: 0 !important;
 border-left: 5px solid var(--section-accent, #ff8a00) !important;
 border-radius: 13px !important;
 background: rgba(255, 255, 255, 0.96) !important;
 box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12) !important;
 backdrop-filter: blur(12px) !important;
 -webkit-backdrop-filter: blur(12px) !important;
 transform: translateY(0) scale(0.96);
 transform-origin: top left;
 transition:
 transform 0.16s ease,
 box-shadow 0.16s ease,
 background 0.16s ease;
 }

 .layout-order .card-toolbar.is-scroll-fixed,
 .layout-order .products-section-head.is-scroll-fixed,
 .layout-order .order-history-toolbar.is-scroll-fixed,
 .layout-order .status-panel > h3.is-scroll-fixed {
 padding: 8px 10px !important;
 }

 .layout-order .order-quick-actions.is-scroll-fixed {
 display: grid !important;
 grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
 gap: 6px !important;
 padding: 7px !important;
 }

 .layout-order .order-quick-actions.is-scroll-fixed .quick-action-btn {
 min-height: 38px !important;
 padding: 4px 3px !important;
 border-radius: 11px !important;
 box-shadow: none !important;
 font-size: 13px !important;
 }

 .layout-order .order-quick-actions.is-scroll-fixed .quick-action-btn span {
 margin-top: 0 !important;
 font-size: 10px !important;
 }

 .layout-order .card-toolbar.is-scroll-fixed h3,
 .layout-order .products-section-head.is-scroll-fixed h3,
 .layout-order .order-history-toolbar.is-scroll-fixed h3,
 .layout-order .status-panel > h3.is-scroll-fixed {
 font-size: 16px !important;
 line-height: 1.15 !important;
 }

 .layout-order .products-section-head.is-scroll-fixed .muted,
 .layout-order .card-toolbar.is-scroll-fixed .muted,
 .layout-order .order-history-toolbar.is-scroll-fixed .muted {
 font-size: 12px !important;
 }

 .layout-order .products-section-head.is-scroll-fixed .btn,
 .layout-order .card-toolbar.is-scroll-fixed .btn {
 min-height: 34px !important;
 padding: 7px 10px !important;
 font-size: 13px !important;
 }

 body.products-measure-modal-open .layout-order .is-scroll-fixed {
 position: static !important;
 width: auto !important;
 transform: none !important;
 }
}

/* Global topbar lock: header stays visible on every page */
.app-shell,
.main {
 overflow: visible !important;
 transform: none !important;
}

/* Keep the header visible even when page/card sticky systems are active */
.main {
 padding-top: var(--topbar-height) !important;
}

.topbar.alpha31-topbar-fixed {
 position: fixed !important;
 inset: 0 0 auto 0 !important;
 z-index: 1200 !important;
}

body.modal-open .topbar.alpha31-topbar-fixed,
body.sidebar-open .topbar.alpha31-topbar-fixed,
body.products-measure-modal-open .topbar.alpha31-topbar-fixed,
body.order-edit-modal-open .topbar.alpha31-topbar-fixed {
 position: fixed !important;
 inset: 0 0 auto 0 !important;
 z-index: 1200 !important;
}

/* Section rail polish: sticky bars should feel attached to each card rail */
.layout-order .order-head-card,
.layout-order .previous-orders-card,
.layout-order .order-products-card,
.layout-order .order-message-history-card,
.layout-order .order-history-card,
.layout-order .status-panel {
 --section-line: #fb923c;
 --section-rail-size: 4px;
 position: relative !important;
 border-left: 0 !important;
 overflow: visible !important;
}

.layout-order .order-head-card::before,
.layout-order .previous-orders-card::before,
.layout-order .order-products-card::before,
.layout-order .order-message-history-card::before,
.layout-order .order-history-card::before,
.layout-order .status-panel::before {
 content: "";
 position: absolute;
 top: 1px;
 bottom: 1px;
 left: 0;
 width: var(--section-rail-size, 3px);
 border-radius: calc(var(--radius) - 1px) 0 0 calc(var(--radius) - 1px);
 background: var(--section-accent, #ff8a00);
 pointer-events: none;
 z-index: 2;
}

.layout-order .order-head-card {
 --section-line: #f59e0b;
}

.layout-order .previous-orders-card {
 --section-line: #60a5fa;
}

.layout-order .order-products-card {
 --section-accent: #374151;
 --section-line: #4b5563;
}

.layout-order .order-message-history-card {
 --section-accent: #0ea5e9;
 --section-line: #38bdf8;
}

.layout-order .order-history-card {
 --section-line: #a78bfa;
}

.layout-order .status-panel {
 --section-line: #4ade80;
}

.layout-order .card-toolbar h3,
.layout-order .products-section-title h3,
.layout-order .status-panel > h3 {
 display: inline-block;
 padding-bottom: 5px;
 border-bottom: 2px solid var(--section-line, var(--section-accent, #ff8a00));
}

/* Same title anatomy as the other order-view section headers. */
.layout-order .status-panel > h3.status-panel-title {
 display: inline-flex;
 align-items: center;
 gap: 8px;
}

.layout-order .status-panel-title .order-section-icon {
 display: inline-grid;
 place-items: center;
 flex: 0 0 auto;
 width: 1.15em;
 height: 1.15em;
 font-size: 1em;
 line-height: 1;
}

.layout-order .status-panel-title-text {
 min-width: 0;
}

.layout-order .is-scroll-fixed h3,
.layout-order .status-panel > h3.is-scroll-fixed {
 padding-bottom: 0 !important;
 border-bottom: 0 !important;
}

@media (max-width: 760px) {
 .layout-order .order-quick-actions.is-scroll-fixed,
 .layout-order .card-toolbar.is-scroll-fixed,
 .layout-order .products-section-head.is-scroll-fixed,
 .layout-order .order-history-toolbar.is-scroll-fixed,
 .layout-order .status-panel > h3.is-scroll-fixed {
 overflow: visible !important;
 border-left: 0 !important;
 border-top: var(--section-rail-size, 3px) solid
 var(--section-accent, #ff8a00) !important;
 border-right: var(--section-rail-size, 3px) solid
 var(--section-accent, #ff8a00) !important;
 border-bottom: var(--section-rail-size, 3px) solid
 var(--section-accent, #ff8a00) !important;
 border-radius: 0 15px 15px 0 !important;
 box-shadow: 0 10px 26px rgba(15, 23, 42, 0.16) !important;
 }

 .layout-order .order-quick-actions.is-scroll-fixed::before,
 .layout-order .card-toolbar.is-scroll-fixed::before,
 .layout-order .products-section-head.is-scroll-fixed::before,
 .layout-order .order-history-toolbar.is-scroll-fixed::before,
 .layout-order .status-panel > h3.is-scroll-fixed::before {
 content: "";
 position: absolute;
 top: 0;
 bottom: calc(var(--section-rail-size, 3px) * -1);
 left: 0;
 width: var(--section-rail-size, 3px);
 border-radius: 13px 0 0 13px;
 background: var(--section-accent, #ff8a00);
 }

 .layout-order .order-quick-actions.is-scroll-fixed::after,
 .layout-order .card-toolbar.is-scroll-fixed::after,
 .layout-order .products-section-head.is-scroll-fixed::after,
 .layout-order .order-history-toolbar.is-scroll-fixed::after,
 .layout-order .status-panel > h3.is-scroll-fixed::after {
 content: "";
 position: absolute;
 left: var(--section-rail-size, 3px);
 bottom: calc((var(--section-rail-size, 3px) + 13px) * -1);
 width: 18px;
 height: 18px;
 pointer-events: none;
 background:
 radial-gradient(
 circle at bottom right,
 transparent 0 12px,
 var(--section-accent, #ff8a00) 12.4px 13.7px,
 transparent 14.2px
 ),
 linear-gradient(
 var(--section-accent, #ff8a00),
 var(--section-accent, #ff8a00)
 );
 background-size:
 18px 18px,
 var(--section-rail-size, 3px) 100%;
 background-position:
 0 0,
 0 0;
 background-repeat: no-repeat;
 opacity: 1;
 }

 .layout-order .order-quick-actions.is-scroll-fixed,
 .layout-order .card-toolbar.is-scroll-fixed,
 .layout-order .products-section-head.is-scroll-fixed,
 .layout-order .order-history-toolbar.is-scroll-fixed,
 .layout-order .status-panel > h3.is-scroll-fixed {
 border-top: 0 !important;
 border-right: 0 !important;
 }

 .layout-order .order-quick-actions.is-scroll-fixed::after,
 .layout-order .card-toolbar.is-scroll-fixed::after,
 .layout-order .products-section-head.is-scroll-fixed::after,
 .layout-order .order-history-toolbar.is-scroll-fixed::after,
 .layout-order .status-panel > h3.is-scroll-fixed::after {
 content: none !important;
 display: none !important;
 background: none !important;
 }
}

.previous-orders-compact-list {
 position: relative;
 display: grid !important;
 gap: 6px !important;
 border: 0 !important;
 border-radius: 0 !important;
 overflow: visible !important;
 background: transparent !important;
}

.previous-orders-compact-list .previous-order-compact-row {
 display: grid !important;
 grid-template-columns: 92px minmax(0, 1fr) minmax(0, 0.95fr) !important;
 min-height: 74px !important;
 text-decoration: none !important;
}

.previous-orders-compact-list .previous-order-compact-row span,
.previous-orders-compact-list .previous-order-compact-row small,
.previous-orders-compact-list .previous-order-compact-row strong {
 min-width: 0;
}

.previous-order-compact-row .order-compact-id strong,
.previous-order-compact-row .order-compact-client strong {
 font-size: 16px;
 line-height: 1.15;
}

.previous-order-compact-row .order-compact-client span {
 font-size: 14px;
 line-height: 1.2;
}

.previous-order-compact-row .order-compact-status {
 font-size: 13px;
 line-height: 1.15;
 min-height: 26px;
}

@media (min-width: 901px) {
 .previous-orders-compact-list .previous-order-compact-row {
 min-height: 78px !important;
 padding-top: 12px !important;
 padding-bottom: 12px !important;
 }

 .previous-order-compact-row .order-compact-id strong,
 .previous-order-compact-row .order-compact-client strong {
 font-size: 18px;
 }

 .previous-order-compact-row .order-compact-client span {
 font-size: 15px;
 }

 .previous-order-compact-row .order-compact-status {
 font-size: 14px;
 min-height: 30px;
 }
}

@media (max-width: 760px) {
 .previous-orders-compact-list .previous-order-compact-row {
 grid-template-columns: 86px minmax(0, 1fr) !important;
 min-height: 72px !important;
 padding: 10px 9px !important;
 gap: 8px !important;
 }

 .previous-order-compact-row .order-compact-id strong,
 .previous-order-compact-row .order-compact-client strong {
 font-size: 15px;
 }

 .previous-order-compact-row .order-compact-client span {
 font-size: 13px;
 }

 .previous-orders-compact-list
 .previous-order-compact-row
 .order-compact-status {
 grid-column: 2 !important;
 width: 100% !important;
 font-size: 12px;
 padding-inline: 7px;
 }

}

.layout-order .history-table {
 border-collapse: separate !important;
 border-spacing: 0 !important;
 overflow: hidden;
}

.layout-order .history-table th:nth-child(1),
.layout-order .history-table td:nth-child(1) {
 width: 230px;
}

.layout-order .history-table th,
.layout-order .history-table td {
 font-size: 14px;
}

.layout-order .history-main-row.is-odd,
.layout-order .history-note-row.is-odd {
 background: #ffffff !important;
}

.layout-order .history-main-row.is-even,
.layout-order .history-note-row.is-even {
 background: #f8fafc !important;
}

.layout-order .history-main-row td {
 padding: 15px 16px 8px !important;
 border-bottom: 0 !important;
 vertical-align: top;
}

.layout-order .history-note-row td {
 padding: 0 16px 15px !important;
 border-top: 0 !important;
 border-bottom: 1px solid #e5e7eb !important;
 color: #64748b;
 font-size: 14px;
 line-height: 1.45;
}

.layout-order .history-date-value {
 display: block;
 color: #0f172a;
 font-size: 14px;
 line-height: 1.2;
}

.layout-order .history-user-inline {
 display: block;
 margin-top: 5px;
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
 line-height: 1.2;
}

.layout-order .history-status-pill {
 display: inline-flex;
 align-items: center;
 max-width: 100%;
 min-height: 32px;
 padding: 8px 12px;
 font-size: 13px;
 white-space: normal;
}

.layout-order .history-note-label {
 display: inline-flex;
 margin-right: 8px;
 color: #334155;
 font-size: 11px;
 font-weight: 900;
 text-transform: uppercase;
}

.layout-order .history-note-text {
 color: #475569;
 font-weight: 700;
}

@media (min-width: 901px) {
 .layout-order .history-table th,
 .layout-order .history-table td {
 font-size: 15px;
 }

 .layout-order .history-date-value {
 font-size: 15px;
 }

 .layout-order .history-user-inline {
 font-size: 13px;
 }

 .layout-order .history-status-pill {
 min-height: 34px;
 font-size: 14px;
 }
}

@media (max-width: 760px) {
 .layout-order .history-table th:nth-child(1),
 .layout-order .history-table td:nth-child(1) {
 width: 126px;
 }

 .layout-order .history-table th,
 .layout-order .history-table td {
 font-size: 13px;
 }

 .layout-order .history-main-row td {
 padding: 12px 10px 7px !important;
 }

 .layout-order .history-note-row td {
 padding: 0 10px 13px !important;
 font-size: 13px;
 }

 .layout-order .history-date-value {
 font-size: 12px;
 }

 .layout-order .history-user-inline {
 font-size: 11px;
 }

 .layout-order .history-status-pill {
 min-height: 30px;
 padding: 7px 9px;
 font-size: 12px;
 }

 .layout-order .history-note-label {
 display: block;
 margin: 0 0 5px;
 }
}

.layout-order .history-product-change-list {
 display: inline-flex;
 flex-direction: column;
 gap: 5px;
 max-width: 100%;
 vertical-align: top;
}

.layout-order .history-product-change-line {
 display: grid;
 grid-template-columns: 24px 76px minmax(0, 1fr);
 align-items: center;
 gap: 8px;
 min-height: 26px;
}

.layout-order .history-product-change-index {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 22px;
 height: 22px;
 border-radius: 7px;
 background: #334155;
 color: #ffffff;
 font-size: 12px;
 font-weight: 900;
}

.layout-order .history-product-change-action {
 color: #64748b;
 font-size: 11px;
 font-weight: 900;
 text-transform: uppercase;
}

.layout-order .history-product-change-name {
 min-width: 0;
 color: #0f172a;
 font-weight: 900;
}

/* Keep the order status panel aligned with the left order column on desktop. */
.layout-order {
 align-items: stretch !important;
}

.layout-order > .grid {
 align-self: stretch !important;
}

.layout-order > .status-panel {
 grid-column: 2 !important;
 grid-row: 1 !important;
 align-self: stretch !important;
 position: sticky !important;
 top: 0 !important;
 height: auto !important;
 min-height: 100% !important;
 max-height: none !important;
 margin-top: 0 !important;
}

@media (min-width: 981px) {
 .layout-order {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px) !important;
  grid-template-rows: auto auto;
  align-items: start !important;
 }

 .layout-order > .grid {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: start !important;
 }

 .layout-order > .status-panel {
  align-self: start !important;
  position: sticky !important;
  top: calc(var(--topbar-height, 76px) + 16px) !important;
  min-height: 0 !important;
  max-height: calc(100vh - var(--topbar-height, 76px) - 32px) !important;
  max-height: calc(100dvh - var(--topbar-height, 76px) - 32px) !important;
  overflow: auto !important;
 }

}

.driver-route-label-form {
 display: flex;
 margin: 0;
}

.driver-route-label-form .btn {
 width: 100%;
}

@media (max-width: 760px) {
 .driver-route-label-form {
 flex: 1 1 118px;
 }
}

@media (max-width: 980px) {
 .layout-order > .status-panel {
 grid-column: auto !important;
 grid-row: auto !important;
 }
}

/* Routes driver */
.routes-driver-page {
 display: grid;
 gap: 16px;
}

.driver-route-hero {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 18px;
 border-left: 4px solid #ff8a00;
}

.driver-route-hero h2 {
 margin: 4px 0;
 font-size: 30px;
}

.driver-route-hero p {
 margin: 0;
 color: #64748b;
}

.driver-progress-box {
 min-width: 230px;
 padding: 14px;
 border: 1px solid #e2e8f0;
 border-radius: 16px;
 background: #f8fafc;
}

.driver-progress-box strong {
 display: block;
 font-size: 28px;
}

.driver-progress-box span {
 display: block;
 margin-bottom: 10px;
 color: #64748b;
 font-weight: 800;
}

.driver-stop-list {
 position: relative;
 display: grid;
 gap: 12px;
}

.driver-stop-list::before {
 content: "";
 position: absolute;
 top: 26px;
 bottom: 26px;
 left: 29px;
 width: 3px;
 border-radius: 999px;
 background: linear-gradient(180deg, #2563eb, #94a3b8 55%, #16a34a);
 opacity: 0.26;
}

.driver-stop-card {
 position: relative;
 z-index: 1;
 display: grid;
 grid-template-columns: 58px minmax(0, 1fr);
 gap: 14px;
 border-left: 4px solid #2563eb;
}

.driver-stop-card.is-done {
 opacity: 0.68;
 border-left-color: #16a34a;
 background: #f8fafc;
}

.driver-stop-card.is-rescheduled {
 border-left-color: #f59e0b;
}

.driver-stop-number {
 position: relative;
 z-index: 2;
 width: 52px;
 height: 52px;
 border-radius: 16px;
 display: grid;
 place-items: center;
 background: #111827;
 color: #fff;
 font-size: 22px;
 font-weight: 950;
}

.driver-stop-content {
 min-width: 0;
}

.driver-stop-head {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 color: #64748b;
 font-weight: 900;
}

.driver-stop-head strong {
 color: #0f172a;
 font-size: 17px;
}

.driver-stop-content h3 {
 margin: 8px 0 4px;
 font-size: 28px;
}

.driver-stop-content p {
 margin: 0;
 color: #475569;
 font-weight: 700;
 font-size: 17px;
}

.driver-stop-links,
.driver-status-actions {
 display: flex;
 flex-wrap: wrap;
 gap: 8px;
 margin-top: 12px;
}

.driver-status-current {
 margin-top: 12px;
}

.driver-status-actions form {
 margin: 0;
}

.driver-status-actions .status-action {
 min-height: 42px;
 padding: 10px 14px;
}

@media (max-width: 760px) {
 .driver-route-hero {
 align-items: stretch;
 flex-direction: column;
 }

 .driver-progress-box {
 min-width: 0;
 }

 .driver-stop-card {
 grid-template-columns: 44px minmax(0, 1fr);
 gap: 10px;
 padding: 12px !important;
 }

 .driver-stop-number {
 width: 40px;
 height: 40px;
 border-radius: 12px;
 font-size: 18px;
 }

 .driver-stop-head {
 align-items: flex-start;
 flex-direction: column;
 gap: 3px;
 }

 .driver-stop-content h3 {
 font-size: 24px;
 }

 .driver-stop-links .btn {
 flex: 1 1 118px;
 min-height: 46px;
 padding: 11px 12px;
 font-size: 14px;
 }
}

.driver-money-btn {
 background: #16a34a !important;
 color: #fff !important;
}

/* Product measuring is compact-only on every device. */
@media (max-width: 760px) {
 body.products-measure-modal-open
 .order-products-card.is-editing
 .products-inline-actions
 > [data-products-cancel]:not([data-products-cancel-footer]) {
 display: none !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-summary-list.is-editing {
 gap: 6px !important;
 border: 0 !important;
 border-radius: 0 !important;
 background: transparent !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-row-compact {
 min-height: 78px !important;
 padding: 7px 8px 8px 42px !important;
 border: 1px solid rgba(226, 232, 240, 0.95) !important;
 border-radius: 12px !important;
 overflow: hidden !important;
 box-shadow: 0 4px 12px rgba(15, 23, 42, 0.035) !important;
 transition:
 border-color 0.18s ease,
 background 0.18s ease,
 box-shadow 0.18s ease !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-row-compact::before {
 width: 34px !important;
 font-size: 15px !important;
 transition:
 background 0.18s ease,
 box-shadow 0.18s ease !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-row-compact.is-measuring-active {
 border-color: #ff8a00 !important;
 background: #fff7ed !important;
 box-shadow: 0 8px 20px rgba(249, 115, 22, 0.18) !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-row-compact.is-measuring-active::before {
 background: #ff8a00 !important;
 box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.35) !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-inline-info {
 display: none !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-main-line {
 display: flex !important;
 min-width: 0 !important;
 margin-bottom: 4px !important;
 white-space: nowrap !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-name {
 max-width: 100% !important;
 overflow: hidden !important;
 text-overflow: ellipsis !important;
 font-size: 13px !important;
 font-weight: 950 !important;
 line-height: 1.15 !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-main-line
 .product-chip {
 display: none !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-edit-fields {
 display: grid !important;
 grid-template-columns: minmax(0, 1fr) !important;
 gap: 0 !important;
 padding: 0 !important;
 border-radius: 0 !important;
 background: transparent !important;
 animation: none !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-type-field,
 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-status-field,
 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .notes-field,
 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .delete-field,
 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 [data-fixed-fields],
 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 [data-carpet-fields]
 label:nth-child(n + 3) {
 display: none !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-row-compact[data-is-carpet="1"]
 [data-carpet-fields] {
 display: grid !important;
 grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
 gap: 6px !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 [data-carpet-fields]
 label {
 gap: 2px !important;
 color: #64748b !important;
 font-size: 9px !important;
 line-height: 1 !important;
 }

 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 [data-product-width],
 body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 [data-product-length] {
 min-height: 30px !important;
 height: 30px !important;
 border-radius: 8px !important;
 padding: 3px 7px !important;
 font-size: 15px !important;
 font-weight: 900 !important;
 text-align: center !important;
 }
}

/* Desktop measuring modal: keep the product list scrollable. */
@media (min-width: 761px) {
 body.products-measure-modal-open
 .order-products-card.is-editing
 form[data-products-form] {
 grid-template-rows: minmax(0, 1fr) auto !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-summary-list {
 min-height: 0 !important;
 height: 100% !important;
 max-height: 100% !important;
 overflow-y: auto !important;
 overflow-x: hidden !important;
 }
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .product-row-compact {
 transition:
 border-color 0.18s ease,
 background 0.18s ease,
 box-shadow 0.18s ease !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .product-row-compact::before {
 transition:
 background 0.18s ease,
 box-shadow 0.18s ease !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .product-row-compact.is-measuring-active {
 border-color: #ff8a00 !important;
 background: #fff7ed !important;
 box-shadow: 0 8px 20px rgba(249, 115, 22, 0.18) !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .product-row-compact.is-measuring-active::before {
 background: #ff8a00 !important;
 box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.35) !important;
}

/* Product measuring compact mode works on desktop and mobile. */
body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-summary-list.is-editing {
 gap: 6px !important;
 border: 0 !important;
 border-radius: 0 !important;
 background: transparent !important;
}

body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-row-compact {
 min-height: 78px !important;
 padding: 7px 8px 8px 42px !important;
 border: 1px solid rgba(226, 232, 240, 0.95) !important;
 border-radius: 12px !important;
 overflow: hidden !important;
 box-shadow: 0 4px 12px rgba(15, 23, 42, 0.035) !important;
}

body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-row-compact::before {
 width: 34px !important;
 font-size: 15px !important;
}

body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-inline-info {
 display: none !important;
}

body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-main-line {
 display: flex !important;
 min-width: 0 !important;
 margin-bottom: 4px !important;
 white-space: nowrap !important;
}

body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-name {
 max-width: 100% !important;
 overflow: hidden !important;
 text-overflow: ellipsis !important;
 font-size: 13px !important;
 font-weight: 950 !important;
 line-height: 1.15 !important;
}

body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-main-line
 .product-chip {
 display: none !important;
}

body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-edit-fields {
 display: grid !important;
 grid-template-columns: minmax(0, 1fr) !important;
 gap: 0 !important;
 padding: 0 !important;
 border-radius: 0 !important;
 background: transparent !important;
 animation: none !important;
}

body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-type-field,
body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-status-field,
body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .notes-field,
body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .delete-field,
body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 [data-fixed-fields],
body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 [data-carpet-fields]
 label:nth-child(n + 3) {
 display: none !important;
}

body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 .product-row-compact[data-is-carpet="1"]
 [data-carpet-fields] {
 display: grid !important;
 grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
 gap: 6px !important;
}

body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 [data-carpet-fields]
 label {
 gap: 2px !important;
 color: #64748b !important;
 font-size: 9px !important;
 line-height: 1 !important;
}

body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 [data-product-width],
body.products-measure-modal-open
 .order-products-card.products-measure-mode-compact.is-editing
 [data-product-length] {
 min-height: 30px !important;
 height: 30px !important;
 border-radius: 8px !important;
 padding: 3px 7px !important;
 font-size: 15px !important;
 font-weight: 900 !important;
 text-align: center !important;
}

/* Header smart order search */
.header-smart-search {
 position: relative !important;
 display: inline-flex !important;
 flex: 0 0 auto !important;
}

.header-smart-search-panel {
 position: absolute !important;
 top: calc(100% + 8px) !important;
 right: 0 !important;
 z-index: 1800 !important;
 width: min(360px, calc(100vw - 24px)) !important;
 display: none !important;
 padding: 8px !important;
 border: 1px solid #e5e7eb !important;
 border-radius: 16px !important;
 background: rgba(255, 255, 255, 0.98) !important;
 box-shadow: 0 18px 42px rgba(15, 23, 42, 0.18) !important;
 backdrop-filter: blur(14px) !important;
 -webkit-backdrop-filter: blur(14px) !important;
}

.header-smart-search.is-open .header-smart-search-panel {
 display: block !important;
}

.header-smart-search-panel input {
 width: 100% !important;
 min-height: 42px !important;
 border: 1px solid #cbd5e1 !important;
 border-radius: 12px !important;
 padding: 9px 12px !important;
 background: #ffffff !important;
 color: #0f172a !important;
 font-size: 14px !important;
 font-weight: 800 !important;
 outline: none !important;
}

.header-smart-search-panel input:focus {
 border-color: #ff8a00 !important;
 box-shadow: 0 0 0 3px rgba(255, 138, 0, 0.16) !important;
}

/* Order view internal notes alert */
.order-internal-note-alert {
 position: fixed;
 inset: 0;
 z-index: 1700;
 display: none;
 align-items: flex-start;
 justify-content: center;
 padding: calc(var(--topbar-height) + 18px) 16px 16px;
 background: rgba(15, 23, 42, 0.28);
}

.order-internal-note-alert.is-open {
 display: flex;
}

.order-internal-note-card {
 position: relative;
 width: min(560px, 100%);
 display: grid;
 grid-template-columns: 52px minmax(0, 1fr);
 gap: 14px;
 padding: 18px 54px 18px 18px;
 border: 1px solid #fed7aa;
 border-left: 6px solid #ff8a00;
 border-radius: 18px;
 background: #fff7ed;
 color: #0f172a;
 box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
}

.order-internal-note-icon {
 width: 52px;
 height: 52px;
 display: grid;
 place-items: center;
 border-radius: 16px;
 background: #ffffff;
 color: #b45309;
 font-size: 24px;
 box-shadow: inset 0 0 0 1px #fed7aa;
}

.order-internal-note-card h3 {
 margin: 0 0 6px;
 font-size: 20px;
}

.order-internal-note-card p {
 margin: 0;
 color: #475569;
 font-size: 15px;
 font-weight: 750;
 line-height: 1.45;
}

.order-internal-note-close {
 position: absolute;
 top: 10px;
 right: 10px;
 width: 36px !important;
 height: 36px !important;
 min-width: 36px !important;
}

@media (max-width: 760px) {
 .order-internal-note-alert {
 padding: calc(var(--topbar-height) + 8px) 10px 10px;
 }

 .order-internal-note-card {
 grid-template-columns: 42px minmax(0, 1fr);
 gap: 10px;
 padding: 14px 48px 14px 14px;
 border-radius: 16px;
 }

 .order-internal-note-icon {
 width: 42px;
 height: 42px;
 border-radius: 14px;
 font-size: 20px;
 }
}

.smart-search-toggle-btn {
 border-color: #fed7aa !important;
 background: #fff7ed !important;
}

.smart-search-toggle-btn svg {
 display: block;
}

@media (max-width: 760px) {
 .header-smart-search-panel {
 position: fixed !important;
 top: calc(var(--topbar-height) + 6px) !important;
 left: 8px !important;
 right: 8px !important;
 width: auto !important;
 max-width: none !important;
 border-color: #ff8a00 !important;
 }

 .header-smart-search-panel input {
 min-height: 40px !important;
 font-size: 13px !important;
 }
}

/* Sectiune 64 - QR scanner template refresh */
.scanner-page {
 min-height: 100vh;
 margin: 0;
 background:
 radial-gradient(
 circle at top left,
 rgba(255, 138, 0, 0.08),
 transparent 34rem
 ),
 linear-gradient(180deg, #f4f8ff 0%, #eef4fb 100%) !important;
 color: #111827 !important;
}

.scanner-shell,
.scanner-shell-pro {
 width: min(560px, 100%) !important;
 margin: 0 auto !important;
 padding: max(12px, env(safe-area-inset-top)) 12px
 max(16px, env(safe-area-inset-bottom)) !important;
}

.scanner-topbar {
 height: auto !important;
 min-height: 60px;
 display: grid !important;
 grid-template-columns: auto minmax(0, 1fr);
 align-items: center !important;
 justify-content: start !important;
 gap: 12px !important;
 padding: 4px 0 12px;
}

.scanner-back {
 width: auto;
 min-height: 42px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 7px;
 padding: 0 14px;
 border: 1px solid #dbe4f0;
 border-radius: 16px;
 background: rgba(255, 255, 255, 0.92);
 color: #111827 !important;
 text-decoration: none;
 font-size: 14px;
 font-weight: 900;
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
 opacity: 1 !important;
}

.scanner-title-block {
 display: flex;
 flex-direction: column;
 gap: 2px;
 min-width: 0;
}

.scanner-title-block strong {
 color: #111827;
 font-size: 20px;
 line-height: 1.1;
}

.scanner-title-block small {
 color: #64748b;
 font-size: 13px;
 font-weight: 750;
}

.scanner-alert {
 margin: 0 0 12px !important;
 padding: 12px 14px !important;
 border-radius: 16px !important;
 background: #fff1f2 !important;
 border: 1px solid #fecdd3 !important;
 color: #9f1239 !important;
 font-weight: 850;
}

.scanner-card,
.scanner-card-pro {
 display: flex;
 flex-direction: column;
 gap: 12px;
 padding: 14px !important;
 border: 1px solid #dbe4f0 !important;
 border-left: 4px solid #ff8a00 !important;
 border-radius: 22px !important;
 background: rgba(255, 255, 255, 0.96) !important;
 box-shadow: 0 22px 60px rgba(15, 23, 42, 0.13) !important;
 backdrop-filter: none !important;
}

.scanner-card-head {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 padding-bottom: 10px;
 border-bottom: 1px solid #e5edf6;
}

.scanner-card-title {
 display: flex;
 align-items: center;
 gap: 10px;
 min-width: 0;
}

.scanner-card-title strong,
.scanner-card-title small {
 display: block;
}

.scanner-card-title strong {
 color: #111827;
 font-size: 16px;
 font-weight: 950;
}

.scanner-card-title small {
 margin-top: 2px;
 color: #64748b;
 font-size: 12px;
 font-weight: 750;
}

.scanner-card-icon {
 width: 40px;
 height: 40px;
 flex: 0 0 40px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border-radius: 14px;
 background: #fff7ed;
 color: #ff8a00;
 font-size: 21px;
 font-weight: 950;
}

.scanner-live-badge {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-height: 30px;
 padding: 0 11px;
 border-radius: 999px;
 background: #dcfce7;
 color: #166534;
 font-size: 12px;
 font-weight: 950;
 white-space: nowrap;
}

.scanner-video-wrap,
.scanner-video-wrap-pro {
 border: 1px solid #dbe4f0;
 border-radius: 18px !important;
 background: #020617 !important;
 aspect-ratio: 1 / 1 !important;
 min-height: 0 !important;
 overflow: hidden;
 box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}

.scanner-frame {
 inset: 17% !important;
 border: 3px solid rgba(255, 255, 255, 0.95) !important;
 border-radius: 20px !important;
 box-shadow: 0 0 0 999px rgba(15, 23, 42, 0.3) !important;
}

.scanner-frame:after {
 background: #ff8a00 !important;
 box-shadow: 0 0 18px rgba(255, 138, 0, 0.9) !important;
}

.scanner-corners {
 inset: 17% !important;
 border: 0 !important;
 border-radius: 20px !important;
 box-shadow: none !important;
}

.scanner-status {
 margin: 0 !important;
 padding: 10px 12px;
 border-radius: 14px;
 background: #f1f5f9;
 color: #334155;
 font-size: 13px;
 font-weight: 850;
 text-align: center;
}

.account-scanner-mode-row {
 display: grid;
 gap: 14px;
 padding: 16px;
 border: 1px solid #dbe4f0;
 border-radius: 20px;
 background:
 linear-gradient(135deg, rgba(255, 138, 0, 0.08), rgba(255, 255, 255, 0.96));
 box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

.account-scanner-mode-options {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 12px;
}

.account-scanner-mode-option {
 min-height: 84px;
 display: grid;
 grid-template-columns: auto minmax(0, 1fr);
 align-items: center;
 gap: 12px;
 padding: 12px;
 border: 1px solid #dbe4f0;
 border-radius: 18px;
 background: rgba(255, 255, 255, 0.92);
 cursor: pointer;
}

.account-scanner-mode-option input {
 position: absolute;
 opacity: 0;
 pointer-events: none;
}

.account-scanner-mode-option strong,
.account-scanner-mode-option small {
 display: block;
}

.account-scanner-mode-option strong {
 color: #111827;
 font-size: 15px;
 font-weight: 950;
}

.account-scanner-mode-option small {
 margin-top: 3px;
 color: #64748b;
 font-size: 12px;
 font-weight: 800;
 line-height: 1.25;
}

.account-scanner-mode-option input:checked + .account-toggle-ui {
 background: linear-gradient(135deg, #ff8a00, #ffbd00);
}

.account-scanner-mode-option input:checked + .account-toggle-ui:after {
 transform: translateX(28px);
}

.scanner-controls {
 display: grid !important;
 grid-template-columns: 40px minmax(0, 1fr) 40px 40px !important;
 gap: 8px !important;
 align-items: stretch !important;
}

.scanner-control-btn {
 width: 40px !important;
 height: 40px !important;
 border: 1px solid #dbe4f0 !important;
 border-radius: 14px !important;
 background: #ffffff !important;
 color: #111827 !important;
 font-size: 18px !important;
 font-weight: 950 !important;
 box-shadow: 0 8px 18px rgba(15, 23, 42, 0.07);
}

.scanner-control-btn.active {
 border-color: #ff8a00 !important;
 background: #fff7ed !important;
 color: #9a3412 !important;
}

.scanner-zoom-wrap {
 min-height: 40px;
 display: flex !important;
 flex-direction: row !important;
 align-items: center;
 gap: 9px !important;
 padding: 0 12px;
 border: 1px solid #dbe4f0;
 border-radius: 14px;
 background: #ffffff;
 color: #475569 !important;
 font-size: 12px !important;
 font-weight: 900 !important;
}

.scanner-zoom-wrap input {
 flex: 1;
 min-width: 0;
}

.scanner-camera-row select,
.scanner-manual-row .input {
 min-height: 44px;
 border: 1px solid #dbe4f0 !important;
 border-radius: 14px !important;
 background: #ffffff !important;
 color: #111827 !important;
 font-size: 14px;
 font-weight: 800;
}

.scanner-manual {
 gap: 8px !important;
 padding-top: 2px;
}

.scanner-manual label {
 color: #64748b !important;
 font-size: 12px !important;
 font-weight: 900 !important;
 letter-spacing: 0 !important;
 opacity: 1 !important;
}

.scanner-manual-row {
 display: grid !important;
 grid-template-columns: minmax(0, 1fr) auto;
 gap: 8px !important;
}

.scanner-manual-row .btn {
 min-height: 44px;
 border-radius: 14px !important;
 padding-inline: 18px;
}

@media (max-width: 520px) {
 .scanner-shell,
 .scanner-shell-pro {
 padding: max(8px, env(safe-area-inset-top)) 8px
 max(10px, env(safe-area-inset-bottom)) !important;
 }

 .scanner-topbar {
 grid-template-columns: 42px minmax(0, 1fr);
 gap: 9px !important;
 padding-bottom: 8px;
 }

 .scanner-back {
 width: 42px;
 min-width: 42px;
 padding: 0;
 border-radius: 14px;
 }

 .scanner-back span:last-child {
 display: none;
 }

 .scanner-title-block strong {
 font-size: 18px;
 }

 .scanner-title-block small {
 font-size: 12px;
 }

  .scanner-card,
  .scanner-card-pro {
 padding: 10px !important;
 border-radius: 18px !important;
 }

 .scanner-video-wrap,
 .scanner-video-wrap-pro {
 aspect-ratio: 4 / 5 !important;
 }

 .scanner-manual-row {
 grid-template-columns: minmax(0, 1fr) 84px;
 }

 .scanner-manual-row .btn {
 padding-inline: 10px;
 }
}

/* Sectiune 65 - adaugare rapida produse in modalul de masurare */
body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row {
 grid-template-columns: minmax(0, 1.35fr) 84px auto auto !important;
 align-items: center !important;
 gap: 8px !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row
 [data-new-product-type] {
 grid-column: auto !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row
 [data-new-quantity] {
 grid-column: auto !important;
 text-align: center;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .product-row-compact.is-quick-added {
 border-color: #fed7aa !important;
 background: #fffaf3 !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 .product-row-compact.is-quick-added::before {
 background: #ff8a00 !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing
 [data-quick-product-remove] {
 min-height: 42px;
 color: #9a3412 !important;
}

@media (max-width: 760px) {
 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row {
 grid-template-columns: minmax(0, 1fr) 72px !important;
 margin: 0 10px 10px !important;
 padding: 10px !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row
 [data-new-product-type] {
 grid-column: 1 / -1 !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row
 .btn.good {
 grid-column: 1 !important;
 }

 body.products-measure-modal-open
 .order-products-card.is-editing
 .product-new-row
 [data-new-product-cancel] {
 grid-column: 2 !important;
 padding-inline: 6px !important;
 font-size: 12px !important;
 }
}

/* Sectiune 66 - stergere rapida produs in compact cu confirmare */
.product-compact-delete-btn {
 display: none;
}

body.products-measure-modal-open
 .order-products-card.is-editing.products-measure-mode-compact
 .product-compact-delete-btn {
 width: 21px;
 height: 21px;
 min-width: 21px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border: 1px solid #fecaca;
 border-radius: 7px;
 background: #fee2e2;
 color: #991b1b;
 font-size: 15px;
 line-height: 1;
 font-weight: 950;
 cursor: pointer;
 box-shadow: 0 4px 10px rgba(153, 27, 27, 0.1);
}

body.products-measure-modal-open
 .order-products-card.is-editing.products-measure-mode-compact
 .product-compact-delete-btn:hover {
 background: #fecaca;
 border-color: #fca5a5;
}

body.products-measure-modal-open
 .order-products-card.is-editing.products-measure-mode-compact
 .product-main-line {
 display: grid !important;
 grid-template-columns: minmax(0, 1fr) auto !important;
 align-items: center;
 column-gap: 8px !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing.products-measure-mode-compact
 .product-main-line
 .product-name {
 grid-column: 1 !important;
 justify-self: start !important;
 min-width: 0;
}

body.products-measure-modal-open
 .order-products-card.is-editing.products-measure-mode-compact
 .product-main-line
 .product-compact-delete-btn {
 grid-column: 2 !important;
 grid-row: 1 !important;
 justify-self: end !important;
}

body.products-measure-modal-open
 .order-products-card.is-editing.products-measure-mode-compact
 .product-main-line
 .product-chip {
 grid-column: auto;
}

.product-delete-confirm-modal {
 position: fixed;
 inset: 0;
 z-index: 12000;
 display: none;
 align-items: center;
 justify-content: center;
 padding: 16px;
 background: rgba(15, 23, 42, 0.58);
}

.product-delete-confirm-modal.is-open {
 display: flex;
}

.product-delete-confirm-card {
 position: relative;
 width: min(420px, 100%);
 display: grid;
 grid-template-columns: 48px minmax(0, 1fr);
 gap: 12px;
 padding: 18px;
 border: 1px solid #fecaca;
 border-left: 4px solid #dc2626;
 border-radius: 20px;
 background: #ffffff;
 box-shadow: 0 26px 80px rgba(15, 23, 42, 0.34);
}

.product-delete-confirm-icon {
 width: 48px;
 height: 48px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border-radius: 16px;
 background: #fee2e2;
 color: #991b1b;
 font-size: 30px;
 font-weight: 950;
}

.product-delete-confirm-copy strong {
 display: block;
 margin-bottom: 6px;
 color: #111827;
 font-size: 20px;
 font-weight: 950;
}

.product-delete-confirm-copy p {
 margin: 0;
 color: #475569;
 font-size: 14px;
 font-weight: 750;
 line-height: 1.4;
}

.product-delete-confirm-actions {
 grid-column: 1 / -1;
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 10px;
 margin-top: 4px;
}

.product-delete-confirm-actions .btn {
 min-height: 42px;
 border-radius: 14px;
}

.product-delete-confirm-x {
 position: absolute;
 top: 10px;
 right: 10px;
 width: 32px;
 height: 32px;
 border: 1px solid #e5e7eb;
 border-radius: 12px;
 background: #ffffff;
 color: #111827;
 font-size: 20px;
 font-weight: 950;
 cursor: pointer;
}

.products-save-confirm-modal {
 position: fixed;
 inset: 0;
 z-index: 12020;
 display: none;
 align-items: center;
 justify-content: center;
 padding: 16px;
 background: rgba(15, 23, 42, 0.54);
}

.products-save-confirm-modal.is-open {
 display: flex;
}

.products-save-confirm-card {
 position: relative;
 width: min(680px, 100%);
 display: grid;
 grid-template-columns: 48px minmax(0, 1fr);
 gap: 12px;
 max-height: min(760px, calc(100dvh - 32px));
 overflow: auto;
 padding: 18px;
 border: 1px solid #fed7aa;
 border-left: 4px solid #ff8a00;
 border-radius: 20px;
 background: #ffffff;
 box-shadow: 0 26px 80px rgba(15, 23, 42, 0.34);
}

.products-save-confirm-icon {
 width: 48px;
 height: 48px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border-radius: 16px;
 background: #fff7ed;
 color: #c2410c;
 font-size: 28px;
 font-weight: 950;
}

.products-save-confirm-copy strong {
 display: block;
 margin-bottom: 6px;
 color: #111827;
 font-size: 20px;
 font-weight: 950;
}

.products-save-confirm-copy p {
 margin: 0;
 color: #64748b;
 font-size: 14px;
 font-weight: 750;
 line-height: 1.4;
}

.products-save-confirm-card ol {
 grid-column: 1 / -1;
 display: grid;
 gap: 7px;
 max-height: 300px;
 overflow: auto;
 margin: 4px 0 0;
 padding: 10px 12px 10px 34px;
 border: 1px solid #e5e7eb;
 border-radius: 14px;
 background: #f8fafc;
}

.products-save-confirm-card li {
 color: #111827;
 font-size: 14px;
 font-weight: 850;
 line-height: 1.35;
}

.products-save-confirm-actions {
 grid-column: 1 / -1;
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 8px;
 margin-top: 4px;
}

.products-save-confirm-actions .btn {
 min-height: 42px;
 width: 100%;
 padding: 8px 9px;
 border-radius: 14px;
 font-size: 12.5px;
 line-height: 1.12;
 white-space: normal;
}

.products-save-confirm-actions .products-save-yellow {
 border: 1px solid #fde68a;
 background: linear-gradient(135deg, #fef3c7, #facc15);
 color: #713f12;
 box-shadow: 0 10px 22px rgba(250, 204, 21, 0.2);
}

.products-save-confirm-actions .products-save-orange {
 border: 1px solid #fb923c;
 background: linear-gradient(135deg, #ffb020, #ff8a00);
 color: #111827;
 box-shadow: 0 12px 26px rgba(255, 138, 0, 0.24);
}

.products-save-confirm-x {
 position: absolute;
 top: 10px;
 right: 10px;
 width: 32px;
 height: 32px;
 border: 1px solid #e5e7eb;
 border-radius: 12px;
 background: #ffffff;
 color: #111827;
 font-size: 20px;
 font-weight: 950;
 cursor: pointer;
}

.history-device-details {
 display: inline-block;
 margin-left: 10px;
 margin-top: 0;
 vertical-align: middle;
}

.history-device-details summary {
 display: inline-flex;
 align-items: center;
 min-height: 24px;
 padding: 4px 9px;
 border: 1px solid #dbeafe;
 border-radius: 999px;
 background: #eff6ff;
 cursor: pointer;
 color: #2563eb;
 font-size: 11px;
 font-weight: 900;
 line-height: 1;
 list-style: none;
}

.history-device-details summary::-webkit-details-marker {
 display: none;
}

.history-device-details[open] summary {
 border-color: #93c5fd;
 background: #dbeafe;
}

.history-device-details.is-empty summary {
 border-color: #e5e7eb;
 background: #f8fafc;
 color: #64748b;
}

.history-device-content {
 display: grid;
 grid-template-columns: minmax(0, 1fr);
 gap: 10px;
}

.history-device-content.has-map {
 grid-template-columns: minmax(280px, 1fr) minmax(260px, 0.8fr);
 align-items: stretch;
}

.history-device-details dl {
 display: grid;
 grid-template-columns: 120px minmax(0, 1fr);
 gap: 6px 10px;
 min-width: min(620px, calc(100vw - 52px));
 margin: 8px 0 0;
 padding: 10px;
 border: 1px solid #e5e7eb;
 border-radius: 12px;
 background: #ffffff;
}

.history-device-details dt {
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
}

.history-device-details dd {
 min-width: 0;
 margin: 0;
 color: #334155;
 font-size: 12px;
 font-weight: 750;
 overflow-wrap: anywhere;
}

.history-json-meta {
 max-height: 220px;
 margin: 0;
 overflow: auto;
 white-space: pre-wrap;
 word-break: break-word;
 font:
 12px/1.45 ui-monospace,
 SFMono-Regular,
 Menlo,
 Consolas,
 monospace;
}

.history-device-empty {
 min-width: min(420px, calc(100vw - 52px));
 margin-top: 8px;
 padding: 10px;
 border: 1px solid #e5e7eb;
 border-radius: 12px;
 background: #ffffff;
 color: #64748b;
 font-size: 12px;
 font-weight: 800;
}

@media (max-width: 760px) {
 body.products-measure-modal-open
 .order-products-card.is-editing.products-measure-mode-compact
 .product-compact-delete-btn {
 width: 20px;
 height: 20px;
 min-width: 20px;
 border-radius: 7px;
 font-size: 14px;
 }

 .product-delete-confirm-card {
 grid-template-columns: 42px minmax(0, 1fr);
 padding: 14px;
 border-radius: 18px;
 }

 .product-delete-confirm-icon {
 width: 42px;
 height: 42px;
 border-radius: 14px;
 font-size: 26px;
 }

 .products-save-confirm-card {
 grid-template-columns: 42px minmax(0, 1fr);
 padding: 14px;
 border-radius: 18px;
 }

 .products-save-confirm-actions {
 gap: 6px;
 }

 .products-save-confirm-actions .btn {
 min-height: 40px;
 padding: 7px 5px;
 border-radius: 12px;
 font-size: 10.5px;
 }

 .products-save-confirm-icon {
 width: 42px;
 height: 42px;
 border-radius: 14px;
 font-size: 24px;
 }

 .history-device-details dl {
 grid-template-columns: 1fr;
 }

 .history-device-details {
 display: block;
 margin-left: 0;
 margin-top: 8px;
 }
}

/* Sectiune 67 - setari firma */
.company-settings-page {
 display: grid;
 gap: 18px;
}

.company-settings-hero {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 18px;
 border-left: 4px solid #ff8a00;
}

.company-settings-hero h2,
.company-settings-card h3 {
 margin: 0;
 color: #111827;
}

.company-settings-hero h2 {
 font-size: 28px;
}

.company-settings-grid {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 18px;
 align-items: start;
}

.company-settings-card {
 --company-accent: #ff8a00;
 border-left: 4px solid var(--company-accent);
}

.company-settings-card-profile {
 --company-accent: #ff8a00;
}
.company-settings-card-operations {
 --company-accent: #334155;
}
.company-settings-card-print {
 --company-accent: #0ea5e9;
}
.company-settings-card-notifications {
 --company-accent: #22c55e;
}

.notification-item {
 color: inherit;
 text-decoration: none;
}

.whatsapp-webhooks-page {
 display: grid;
 gap: 16px;
}

.whatsapp-webhook-tabs {
 justify-content: flex-start;
}

.whatsapp-webhook-stats {
 display: grid;
 grid-template-columns: repeat(4, minmax(0, 1fr));
 gap: 12px;
}

.whatsapp-webhook-stat {
 background: rgba(255, 255, 255, 0.92);
 border: 1px solid var(--line);
 border-left: 4px solid #22c55e;
 border-radius: 14px;
 padding: 14px 16px;
 box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08);
}

.whatsapp-webhook-stat span {
 display: block;
 color: var(--muted);
 font-size: 12px;
 font-weight: 900;
 text-transform: uppercase;
}

.whatsapp-webhook-stat strong {
 display: block;
 margin-top: 6px;
 color: var(--text);
 font-size: 30px;
 line-height: 1;
}

.whatsapp-webhook-card {
 --section-accent: #22c55e;
}

.whatsapp-webhook-list {
 display: grid;
 gap: 10px;
}

.whatsapp-webhook-row {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto auto;
 gap: 14px;
 align-items: start;
 padding: 14px;
 border: 1px solid var(--line);
 border-left: 4px solid #94a3b8;
 border-radius: 14px;
 background: #fff;
}

.whatsapp-webhook-row.is-open {
 border-left-color: #22c55e;
 background: linear-gradient(90deg, rgba(34, 197, 94, 0.08), #fff 42%);
}

.whatsapp-webhook-row-main {
 display: flex;
 gap: 12px;
 min-width: 0;
}

.whatsapp-webhook-icon {
 width: 38px;
 height: 38px;
 border-radius: 12px;
 display: grid;
 place-items: center;
 flex: 0 0 auto;
 background: #ecfdf5;
 color: #166534;
 font-weight: 950;
}

.whatsapp-webhook-copy {
 min-width: 0;
}

.whatsapp-webhook-meta,
.whatsapp-webhook-phone,
.whatsapp-webhook-state,
.whatsapp-webhook-actions {
 display: flex;
 align-items: center;
 gap: 8px;
 flex-wrap: wrap;
}

.whatsapp-webhook-meta strong {
 color: var(--text);
}

.whatsapp-webhook-meta span,
.whatsapp-webhook-phone small {
 color: var(--muted);
 font-weight: 800;
}

.whatsapp-webhook-phone a {
 color: #166534;
 font-weight: 950;
 text-decoration: none;
}

.whatsapp-webhook-phone .whatsapp-webhook-order-link {
 display: inline-flex;
 align-items: center;
 min-height: 24px;
 padding: 3px 9px;
 border: 1px solid #bfdbfe;
 border-radius: 999px;
 background: #eff6ff;
 color: #1d4ed8;
 font-size: 12px;
 line-height: 1;
}

.whatsapp-webhook-missing-client {
 display: inline-flex;
 align-items: center;
 min-height: 24px;
 padding: 3px 9px;
 border: 1px solid #fed7aa;
 border-radius: 999px;
 background: #fff7ed;
 color: #9a3412;
 font-size: 12px;
 font-weight: 950;
 line-height: 1;
}

.whatsapp-webhook-copy p {
 margin: 8px 0 0;
 color: #334155;
 font-weight: 750;
}

.whatsapp-webhook-message-preview {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 max-width: 100%;
 padding: 8px 11px;
 border: 1px solid #e2e8f0;
 border-radius: 14px;
 background: #ffffff;
}

.whatsapp-webhook-message-preview.is-media {
 border-color: #bfdbfe;
 background: #eff6ff;
 color: #1e3a8a;
}

.whatsapp-webhook-message-preview.is-reaction {
 border-color: #fed7aa;
 background: #fff7ed;
 color: #9a3412;
}

.whatsapp-webhook-message-preview small {
 color: #64748b;
 font-size: 12px;
 font-weight: 850;
}

.webhook-preview-icon {
 display: inline-grid;
 place-items: center;
 min-width: 24px;
 height: 24px;
 font-size: 20px;
 line-height: 1;
}

.webhook-preview-media-btn {
 appearance: none;
 display: inline-flex;
 align-items: center;
 gap: 8px;
 margin: -8px -11px;
 padding: 8px 11px;
 border: 0;
 border-radius: 14px;
 background: transparent;
 color: inherit;
 font: inherit;
 font-weight: 950;
 cursor: pointer;
}

.webhook-preview-media-btn:hover {
 background: rgba(37, 99, 235, 0.08);
}

.whatsapp-image-modal[hidden] {
 display: none !important;
}

.whatsapp-image-modal {
 position: fixed;
 inset: 0;
 z-index: 9999;
 display: grid;
 align-items: center;
 justify-items: center;
 padding: calc(var(--topbar-height, 64px) + 14px) 18px 18px;
 overflow-y: auto;
}

.whatsapp-image-modal-backdrop {
 position: absolute;
 inset: 0;
 background: rgba(15, 23, 42, 0.72);
 backdrop-filter: blur(10px);
}

.whatsapp-image-modal-card {
 position: relative;
 z-index: 1;
 width: min(760px, 100%);
 max-height: calc(100vh - var(--topbar-height, 64px) - 32px);
 overflow: hidden;
 border: 1px solid rgba(255, 255, 255, 0.56);
 border-radius: 24px;
 background: #ffffff;
 box-shadow: 0 30px 90px rgba(15, 23, 42, 0.35);
 animation: whatsappImageModalIn 0.16s ease both;
}

.whatsapp-image-modal-close {
 position: absolute;
 top: 10px;
 right: 10px;
 z-index: 2;
 width: 42px;
 height: 42px;
 border: 1px solid #e2e8f0;
 border-radius: 999px;
 background: rgba(255, 255, 255, 0.92);
 color: #0f172a;
 font-size: 28px;
 font-weight: 900;
 line-height: 1;
 cursor: pointer;
 box-shadow: 0 12px 24px rgba(15, 23, 42, 0.16);
}

.whatsapp-image-modal-head {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 padding: 16px 62px 14px 18px;
 border-bottom: 1px solid #e2e8f0;
 background: linear-gradient(135deg, #ecfdf5, #ffffff);
}

.whatsapp-image-modal-head strong {
 font-size: 18px;
 font-weight: 950;
}

.whatsapp-image-modal-head a {
 color: #166534;
 font-size: 13px;
 font-weight: 950;
 text-decoration: none;
}

.whatsapp-image-modal-body {
 display: grid;
 gap: 10px;
 padding: 14px;
 background: #f8fafc;
}

.whatsapp-image-modal-body img {
 display: block;
 width: 100%;
 max-height: calc(100vh - var(--topbar-height, 64px) - 150px);
 object-fit: contain;
 border-radius: 16px;
 background: #ffffff;
}

.whatsapp-image-modal-body p {
 margin: 0;
 padding: 10px 12px;
 border-radius: 14px;
 background: #ffffff;
 color: #334155;
 font-weight: 850;
}

.whatsapp-image-modal-error {
 padding: 18px;
 border: 1px solid #fecaca;
 border-radius: 16px;
 background: #fef2f2;
 color: #991b1b;
 font-weight: 900;
 line-height: 1.45;
}

body.whatsapp-image-modal-open {
 overflow: hidden;
}

@media (max-width: 760px) {
 .whatsapp-image-modal {
 align-items: center;
 padding: calc(var(--topbar-height, 58px) + 8px) 10px 12px;
 }

 .whatsapp-image-modal-card {
 width: 100%;
 max-height: calc(100vh - var(--topbar-height, 58px) - 20px);
 border-radius: 18px;
 }

 .whatsapp-image-modal-head {
 padding: 13px 54px 12px 14px;
 }

 .whatsapp-image-modal-body {
 padding: 10px;
 }

 .whatsapp-image-modal-body img {
 max-height: calc(100vh - var(--topbar-height, 58px) - 130px);
 border-radius: 13px;
 }
}

.qr-status-suggestion-modal[hidden] {
 display: none !important;
}

.qr-status-suggestion-modal {
 position: fixed;
 inset: 0;
 z-index: 10030;
 display: none;
 align-items: flex-start;
 justify-content: center;
 padding: clamp(18px, 5dvh, 54px) 18px 18px;
 background: rgba(15, 23, 42, 0.55);
}

.qr-status-suggestion-modal.is-open {
 display: flex;
}

.qr-status-suggestion-card {
 position: relative;
 width: min(620px, 100%);
 max-height: calc(100dvh - clamp(36px, 10dvh, 108px));
 overflow-x: hidden;
 overflow-y: auto;
 border: 1px solid rgba(255, 255, 255, 0.72);
 border-radius: 28px;
 background:
 radial-gradient(
 circle at 18% 12%,
 rgba(255, 138, 0, 0.08),
 transparent 28%
 ),
 linear-gradient(145deg, #ffffff 0%, #fbfdff 58%, #f8fafc 100%);
 box-shadow: 0 26px 84px rgba(15, 23, 42, 0.34);
 padding: 34px 36px 28px;
}

.qr-status-suggestion-list {
 max-height: min(330px, 46dvh);
 overflow-y: auto;
 padding-right: 2px;
}

.qr-status-suggestion-close {
 position: absolute;
 top: 20px;
 right: 20px;
 width: 44px;
 height: 44px;
 border: 1px solid rgba(226, 232, 240, 0.9);
 border-radius: 999px;
 background: #ffffff;
 color: #111827;
 font-size: 30px;
 font-weight: 900;
 line-height: 1;
 cursor: pointer;
 box-shadow: 0 8px 22px rgba(15, 23, 42, 0.12);
}

.qr-status-suggestion-icon {
 width: 46px;
 height: 46px;
 display: grid;
 place-items: center;
 border-radius: 16px;
 background: var(--status-accent, #ff8a00);
 color: #ffffff;
 font-size: 26px;
 font-weight: 900;
 margin-bottom: 14px;
}

.qr-status-suggestion-head {
 display: grid;
 grid-template-columns: 82px minmax(0, 1fr);
 align-items: center;
 gap: 26px;
 padding-right: 52px;
}

.qr-status-suggestion-mark {
 display: grid;
 place-items: center;
 width: 82px;
 height: 82px;
 border: 1px solid #fed7aa;
 border-radius: 999px;
 background: #fff7ed;
 color: #f97316;
 font-size: 42px;
 font-weight: 900;
}

.qr-status-suggestion-copy strong {
 display: block;
 color: #111827;
 font-size: 34px;
 line-height: 1.08;
 margin-bottom: 12px;
}

.qr-status-suggestion-copy p {
 max-width: 390px;
 margin: 0;
 color: #64748b;
 font-size: 18px;
 line-height: 1.35;
}

.qr-status-current-flow {
 display: flex;
 align-items: center;
 gap: 18px;
 margin: 22px 0 20px;
 padding: 22px 24px;
 border: 1px solid color-mix(in srgb, var(--status-accent-color, #93c5fd) var(--status-surface-color-weight, 54%), #ffffff);
 border-radius: 22px;
 background: linear-gradient(
 105deg,
 color-mix(in srgb, var(--status-parent-color, #eff6ff) var(--status-surface-color-weight, 54%), #ffffff),
 color-mix(in srgb, var(--status-accent-color, #93c5fd) var(--status-surface-color-weight, 54%), #ffffff)
 );
 box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.76);
 color: var(--status-text-color, #0f172a);
 text-shadow: var(--status-text-glow, 0 1px 8px rgba(255, 255, 255, 0.82));
}

.qr-status-current-icon {
 display: grid;
 place-items: center;
 width: 58px;
 height: 58px;
 flex: 0 0 auto;
 border-radius: 999px;
 background: color-mix(in srgb, var(--status-accent-color, #2563eb) var(--status-surface-color-weight, 54%), #ffffff);
 color: var(--status-text-color, #0f172a);
 text-shadow: var(--status-text-glow, 0 1px 8px rgba(255, 255, 255, 0.82));
 font-size: 28px;
 box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.12);
}

.qr-status-current-flow span,
.qr-status-current-flow em {
 color: var(--status-muted-text-color, #475569);
 text-shadow: var(--status-text-glow, 0 1px 7px rgba(255, 255, 255, 0.72));
 font-size: 14px;
 font-style: normal;
 font-weight: 950;
 text-transform: uppercase;
 letter-spacing: 0.02em;
}

.qr-status-current-flow strong {
 display: block;
 color: var(--status-text-color, #0f172a);
 text-shadow: var(--status-text-glow, 0 1px 8px rgba(255, 255, 255, 0.82));
 font-size: 26px;
 line-height: 1.15;
}

.status-panel-current {
 gap: 12px;
 margin: 14px 0 16px;
 padding: 14px 15px;
 border-color: color-mix(
 in srgb,
 var(--status-accent-color, #ff8a00) var(--status-surface-color-weight, 54%),
 #ffffff
 );
 border-radius: 18px;
 background: linear-gradient(
 105deg,
 color-mix(in srgb, var(--status-parent-color, #fff7ed) var(--status-surface-color-weight, 54%), #ffffff),
 color-mix(in srgb, var(--status-accent-color, var(--status-parent-color, #fff7ed)) var(--status-surface-color-weight, 54%), #ffffff)
 );
 box-shadow:
 inset 0 0 0 1px rgba(255, 255, 255, 0.76),
 0 8px 20px rgba(15, 23, 42, 0.07);
}

.status-panel-current .qr-status-current-icon {
 width: 42px;
 height: 42px;
 background: color-mix(
 in srgb,
 var(--status-accent-color, #ff8a00) var(--status-surface-color-weight, 54%),
 #ffffff
 );
 color: var(--status-text-color, #0f172a);
 text-shadow: var(--status-text-glow, 0 1px 8px rgba(255, 255, 255, 0.82));
 font-size: 20px;
}

.status-panel-current span {
 font-size: 11px;
}

.status-panel-current strong {
 font-size: 16px;
 line-height: 1.18;
}

.qr-status-auto-row {
 display: flex;
 align-items: center;
 gap: 18px;
 margin: 26px 0 22px;
 color: #ea580c;
 font-size: 18px;
 font-weight: 850;
}

.qr-status-auto-info {
 display: grid;
 place-items: center;
 width: 24px;
 height: 24px;
 border: 2px solid #94a3b8;
 border-radius: 999px;
 background: #ffffff;
 color: #64748b;
 font-size: 14px;
 font-weight: 950;
}

.qr-status-auto-pill {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 min-height: 36px;
 padding: 7px 14px;
 border: 0;
 border-radius: 999px;
 background: #ffedd5;
 color: #ea580c;
 font: inherit;
 font-size: 16px;
 font-weight: 900;
 cursor: pointer;
}

.qr-status-auto-pill span {
 display: grid;
 place-items: center;
 width: 24px;
 height: 24px;
 border-radius: 999px;
 background: #f97316;
 color: #ffffff;
 font-size: 14px;
}

.qr-status-auto-pill.is-auto-disabled {
 background: #dcfce7;
 color: #166534;
}

.qr-status-auto-pill.is-auto-disabled span {
 background: #22c55e;
}

.qr-status-next-label {
 margin: 0 0 12px;
 color: #64748b;
 font-size: 17px;
 font-weight: 800;
}

.qr-status-flow-list {
 display: block;
}

.qr-status-suggestion-list {
 display: grid;
 gap: 17px;
 margin-top: 4px;
}

.qr-status-suggestion-list form {
 margin: 0;
}

.qr-status-suggestion-list .status-action {
 width: 100%;
 min-height: 0;
}

/* Suprafața comună pentru o alegere de status. Paleta/fade-ul rămâne în
   .status-action-gradient; această regulă păstrează aceeași profunzime
   vizuală în fluxul operațional și în administrarea statusurilor. */
.status-gradient-surface,
.qr-status-choice {
 border-radius: 22px;
 box-shadow:
 inset 7px 0 0 color-mix(in srgb, var(--status-accent-color, #ff8a00) var(--status-surface-color-weight, 54%), #ffffff),
 0 10px 24px rgba(15, 23, 42, 0.08) !important;
 transition:
 transform 0.18s ease,
 box-shadow 0.18s ease,
 border-color 0.18s ease;
}

.status-gradient-surface:hover,
.status-gradient-surface:focus-visible,
.qr-status-choice:hover,
.qr-status-choice:focus-visible {
 transform: translateY(-1px);
 box-shadow:
 0 12px 26px rgba(15, 23, 42, 0.13),
 inset 5px 0 0 color-mix(in srgb, var(--status-parent-color, #fff7ed) var(--status-surface-color-weight, 54%), #ffffff),
 inset -10px 0 0 color-mix(in srgb, var(--status-accent-color, var(--status-parent-color, #fff7ed)) var(--status-surface-color-weight, 54%), #ffffff) !important;
}

.qr-status-choice {
 display: grid !important;
 grid-template-columns: 54px minmax(0, 1fr) auto 20px;
 align-items: center;
 gap: 16px;
 min-height: 74px !important;
 padding: 12px 16px !important;
 text-align: left;
}

.qr-status-choice-icon {
 display: grid;
 place-items: center;
 width: 50px;
 height: 50px;
 border-radius: 999px;
 background: color-mix(
 in srgb,
 var(--status-accent-color, #ff8a00) var(--status-surface-color-weight, 54%),
 #ffffff
 );
 box-shadow: inset 0 0 0 1px
 color-mix(in srgb, var(--status-accent-color, #ff8a00) var(--status-surface-color-weight, 54%), #ffffff);
 color: var(--status-text-color, #0f172a);
 text-shadow: var(--status-text-glow, 0 1px 8px rgba(255, 255, 255, 0.82));
 font-size: 24px;
 line-height: 1;
}

.qr-status-choice-main {
 display: grid;
 gap: 2px;
 min-width: 0;
}

.qr-status-choice-main small {
 color: var(--status-muted-text-color, #475569);
 text-shadow: var(--status-text-glow, 0 1px 7px rgba(255, 255, 255, 0.72));
 font-size: 14px;
 font-weight: 750;
 line-height: 1.3;
 text-transform: none;
 letter-spacing: 0;
}

.qr-status-choice-main strong {
 overflow: hidden;
 color: #0f172a;
 font-size: 18px;
 font-weight: 950;
 line-height: 1.16;
 text-overflow: ellipsis;
 white-space: normal;
}

.qr-status-choice .percent {
 min-width: 48px;
 justify-self: end;
 padding: 10px 13px;
 border-radius: 999px;
 background: color-mix(
 in srgb,
 var(--status-accent-color, #ff8a00) 16%,
 #ffffff
 );
 color: #0f172a;
 font-size: 16px;
 font-weight: 950;
 text-align: center;
}

.qr-status-choice-arrow {
 color: #0f172a;
 font-size: 40px;
 font-weight: 300;
 line-height: 1;
}

.status-panel .status-big {
 gap: 10px;
}

.status-panel-choice {
 grid-template-columns: 38px minmax(0, 1fr) auto 14px !important;
 gap: 10px !important;
 min-height: 66px !important;
 padding: 10px 12px !important;
 border-radius: 17px !important;
 box-shadow:
 inset 6px 0 0 color-mix(in srgb, var(--status-accent-color, #ff8a00) var(--status-surface-color-weight, 54%), #ffffff),
 0 8px 20px rgba(15, 23, 42, 0.08) !important;
}

.status-panel-choice:hover,
.status-panel-choice:focus {
 box-shadow:
 inset 6px 0 0 color-mix(in srgb, var(--status-accent-color, #ff8a00) var(--status-surface-color-weight, 54%), #ffffff),
 0 11px 24px rgba(15, 23, 42, 0.13) !important;
}

.status-panel-choice .qr-status-choice-icon {
 width: 38px;
 height: 38px;
 font-size: 18px;
}

.status-panel-choice .qr-status-choice-main {
 gap: 1px;
}

.status-panel-choice .qr-status-choice-main strong {
 font-size: 14px;
 line-height: 1.12;
}

.status-panel-choice .qr-status-choice-main small {
 overflow: hidden;
 font-size: 11px;
 line-height: 1.22;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.status-panel-choice .percent {
 min-width: 38px;
 padding: 7px 9px;
 font-size: 12px;
}

.status-panel-choice .qr-status-choice-arrow {
 font-size: 28px;
}

.qr-status-suggestion-actions {
 display: flex;
 align-items: center;
 gap: 24px;
 justify-content: space-between;
 margin-top: 22px;
}

.qr-status-suggestion-actions .btn {
 position: relative;
 flex: 1 1 0;
 min-height: 58px;
 padding: 14px 18px;
 border-radius: 18px;
 font-size: 17px;
 font-weight: 950;
}

.qr-status-cancel-countdown {
 overflow: hidden;
 --qr-countdown-progress: 0%;
}

.qr-status-cancel-countdown::before {
 content: "";
 position: absolute;
 inset: 0;
 z-index: 0;
 width: var(--qr-countdown-progress);
 border-radius: inherit;
 background: linear-gradient(
 90deg,
 rgba(255, 138, 0, 0.22),
 rgba(255, 176, 0, 0.34)
 );
 transition: width 0.18s linear;
}

.qr-status-cancel-countdown > span,
.qr-status-cancel-countdown > strong {
 position: relative;
 z-index: 1;
}

.qr-status-cancel-countdown > strong {
 display: inline-grid;
 place-items: center;
 min-width: 28px;
 height: 28px;
 margin-left: 10px;
 border-radius: 999px;
 background: rgba(255, 255, 255, 0.82);
 color: #ea580c;
 font-size: 14px;
 font-weight: 950;
}

.qr-status-cancel-countdown > strong[hidden] {
 display: none !important;
}

.qr-status-actions-divider {
 display: flex;
 align-items: center;
 gap: 14px;
 margin: 22px 0 18px;
 color: #f97316;
}

.qr-status-actions-divider::before,
.qr-status-actions-divider::after {
 content: "";
 height: 1px;
 flex: 1 1 auto;
 background: linear-gradient(90deg, transparent, #e2e8f0, transparent);
}

.qr-status-actions-divider span {
 display: grid;
 place-items: center;
 width: 34px;
 height: 34px;
 border-radius: 999px;
 background: #ffffff;
 box-shadow: 0 3px 12px rgba(15, 23, 42, 0.1);
}

.qr-status-hide-next {
 display: none !important;
 background: #fee2e2 !important;
 border-color: #fecaca !important;
 color: #991b1b !important;
}

.qr-status-suggestion-modal.is-qr-source .qr-status-hide-next {
 display: inline-flex !important;
}

.qr-status-hide-next.is-auto-disabled {
 background: #dcfce7 !important;
 border-color: #bbf7d0 !important;
 color: #166534 !important;
}

.qr-status-hide-next span:first-child {
 display: inline-grid;
 place-items: center;
 width: 16px;
 height: 16px;
 margin-right: 4px;
 border-radius: 999px;
 background: #ef4444;
 color: #ffffff;
 font-size: 12px;
 line-height: 1;
}

.qr-status-hide-next.is-auto-disabled span:first-child {
 background: #22c55e;
}

@media (max-width: 760px) {
 .qr-status-suggestion-modal {
 padding: 12px;
 }

 .qr-status-suggestion-card {
 width: min(100%, 430px);
 max-height: calc(100dvh - 24px);
 padding: 22px 18px 20px;
 border-radius: 24px;
 }

 .qr-status-suggestion-close {
 top: 14px;
 right: 14px;
 width: 38px;
 height: 38px;
 font-size: 26px;
 }

 .qr-status-suggestion-head {
 grid-template-columns: 58px minmax(0, 1fr);
 gap: 16px;
 padding-right: 42px;
 }

 .qr-status-suggestion-mark {
 width: 58px;
 height: 58px;
 font-size: 30px;
 }

 .qr-status-suggestion-copy strong {
 font-size: 25px;
 margin-bottom: 6px;
 }

 .qr-status-suggestion-copy p {
 font-size: 15px;
 }

 .qr-status-auto-row {
 gap: 10px;
 margin: 18px 0 16px;
 font-size: 15px;
 flex-wrap: wrap;
 }

 .qr-status-auto-pill {
 min-height: 32px;
 padding: 6px 11px;
 font-size: 14px;
 }

 .qr-status-current-flow {
 gap: 12px;
 margin: 16px 0;
 padding: 14px 15px;
 border-radius: 18px;
 }

 .qr-status-current-icon {
 width: 44px;
 height: 44px;
 font-size: 22px;
 }

 .qr-status-current-flow strong {
 font-size: 20px;
 }

 .qr-status-next-label {
 margin-bottom: 9px;
 font-size: 15px;
 }

 .qr-status-flow-list {
 display: block;
 }

 .qr-status-suggestion-list {
 gap: 13px;
 max-height: min(390px, 50dvh);
 }

 .qr-status-choice {
 grid-template-columns: 38px minmax(0, 1fr) auto 14px;
 gap: 10px;
 min-height: 58px !important;
 padding: 8px 10px !important;
 border-radius: 17px !important;
 }

 .qr-status-choice-icon {
 width: 36px;
 height: 36px;
 font-size: 18px;
 }

 .qr-status-choice-main strong {
 font-size: 15px;
 line-height: 1.12;
 }

 .qr-status-choice-main small {
 display: -webkit-box;
 overflow: hidden;
 font-size: 12px;
 line-height: 1.2;
 -webkit-line-clamp: 1;
 -webkit-box-orient: vertical;
 }

 .qr-status-choice .percent {
 min-width: 36px;
 padding: 7px 9px;
 font-size: 13px;
 }

 .qr-status-choice-arrow {
 font-size: 28px;
 }

 .qr-status-actions-divider {
 margin: 14px 0 12px;
 }

 .qr-status-suggestion-actions {
 gap: 10px;
 }

 .qr-status-suggestion-actions .btn {
 min-height: 46px;
 padding: 10px 12px;
 border-radius: 15px;
 font-size: 14px;
 }
}

.ready-whatsapp-confirm-modal {
 position: fixed;
 inset: 0;
 z-index: 10060;
 display: none;
 align-items: center;
 justify-content: center;
 padding: 18px;
 background: rgba(15, 23, 42, 0.56);
}

.ready-whatsapp-confirm-modal.is-open {
 display: flex;
}

.ready-whatsapp-confirm-card {
 position: relative;
 width: min(520px, 100%);
 border: 1px solid rgba(255, 138, 0, 0.28);
 border-radius: 22px;
 background: linear-gradient(135deg, rgba(255, 251, 235, 0.96), #ffffff 62%);
 box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
 padding: 22px;
}

.ready-whatsapp-confirm-x {
 position: absolute;
 top: 10px;
 right: 10px;
 width: 34px;
 height: 34px;
 border: 1px solid rgba(226, 232, 240, 0.9);
 border-radius: 999px;
 background: #ffffff;
 color: #111827;
 font-size: 22px;
 font-weight: 900;
 line-height: 1;
 cursor: pointer;
}

.ready-whatsapp-confirm-copy strong {
 display: block;
 padding-right: 40px;
 color: #111827;
 font-size: 22px;
 margin-bottom: 7px;
}

.ready-whatsapp-confirm-copy p {
 margin: 0;
 color: #64748b;
 line-height: 1.35;
}

.ready-whatsapp-confirm-actions {
 display: grid;
 grid-template-columns: 0.8fr 1fr 1.25fr;
 gap: 10px;
 margin-top: 18px;
}

.ready-whatsapp-confirm-actions .btn {
 min-height: 42px;
}

@media (max-width: 760px) {
 .ready-whatsapp-confirm-actions {
 grid-template-columns: 1fr;
 }
}

@keyframes whatsappImageModalIn {
 from {
 opacity: 0;
 transform: translateY(10px) scale(0.985);
 }
 to {
 opacity: 1;
 transform: translateY(0) scale(1);
 }
}

.whatsapp-webhook-state span {
 border-radius: 999px;
 padding: 6px 10px;
 font-size: 12px;
 font-weight: 950;
}

.whatsapp-webhook-state .good {
 background: #dcfce7;
 color: #166534;
}

.whatsapp-webhook-state .warn {
 background: #fff7ed;
 color: #9a3412;
}

.whatsapp-webhook-actions {
 justify-content: flex-end;
}

.whatsapp-webhook-actions form {
 margin: 0;
}

.whatsapp-webhook-raw {
 margin-top: 10px;
}

.whatsapp-webhook-raw summary {
 cursor: pointer;
 color: var(--muted);
 font-size: 12px;
 font-weight: 900;
 text-transform: uppercase;
}

.whatsapp-webhook-raw pre {
 max-height: 220px;
 overflow: auto;
 margin: 8px 0 0;
 padding: 12px;
 border-radius: 12px;
 background: #0f172a;
 color: #e2e8f0;
 white-space: pre-wrap;
 word-break: break-word;
}

@media (max-width: 760px) {
 .whatsapp-webhook-stats {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .whatsapp-webhook-row {
 grid-template-columns: 1fr;
 }

 .whatsapp-webhook-actions {
 justify-content: stretch;
 }

 .whatsapp-webhook-actions form,
 .whatsapp-webhook-actions .btn {
 width: 100%;
 }
}

@media (max-width: 760px) {
 .order-head-card.order-hero-card.order-hero-card-test-2 {
 padding: 10px !important;
 border-radius: 18px !important;
 }

 .order-hero-card-test-2 .order-hero-top {
 display: grid !important;
 grid-template-columns: 1fr !important;
 gap: 10px !important;
 width: 100% !important;
 margin: 0 0 10px !important;
 padding: 10px !important;
 border-radius: 16px !important;
 background: linear-gradient(135deg, #0f172a, #1e293b) !important;
 color: #fff !important;
 box-shadow: 0 14px 28px rgba(15, 23, 42, 0.16) !important;
 }

 .order-hero-card-test-2 .order-identity {
 display: grid !important;
 gap: 8px !important;
 width: 100% !important;
 }

 .order-hero-card-test-2 .order-number-line {
 display: flex !important;
 align-items: center !important;
 justify-content: space-between !important;
 gap: 8px !important;
 width: 100% !important;
 margin: 0 !important;
 flex-wrap: nowrap !important;
 }

 .order-hero-card-test-2 .order-number-badge {
 min-height: 28px !important;
 padding: 4px 10px !important;
 border-radius: 10px !important;
 font-size: 14px !important;
 background: #fff !important;
 color: #0f172a !important;
 }

 .order-hero-card-test-2 .order-mode-pill {
 min-height: 26px !important;
 max-width: 46%;
 padding: 4px 8px !important;
 border-radius: 999px !important;
 overflow: hidden;
 white-space: nowrap;
 text-overflow: ellipsis;
 background: rgba(255, 255, 255, 0.14) !important;
 color: #fff !important;
 font-size: 12px !important;
 }

 .order-hero-card-test-2 .order-identity h2 {
 display: block !important;
 margin: 0 !important;
 color: #fff !important;
 font-size: 24px !important;
 line-height: 1.1 !important;
 min-height: 0 !important;
 }

 .order-hero-card-test-2 .order-contact-line {
 display: grid !important;
 grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
 gap: 8px !important;
 width: 100% !important;
 margin: 0 !important;
 flex-wrap: nowrap !important;
 }

 .order-hero-card-test-2 .contact-chip {
 min-width: 0 !important;
 width: 100% !important;
 min-height: 34px !important;
 padding: 7px 8px !important;
 border-radius: 12px !important;
 font-size: 14px !important;
 overflow: hidden;
 white-space: nowrap;
 text-overflow: ellipsis;
 }

 .order-hero-card-test-2 .contact-chip.whatsapp {
 background: #22c55e !important;
 color: #052e16 !important;
 }

 .order-hero-card-test-2 .order-quick-actions {
 display: grid !important;
 grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
 gap: 6px !important;
 width: 100% !important;
 }

 .order-hero-card-test-2 .quick-action-btn {
 min-height: 42px !important;
 padding: 4px 2px !important;
 border-radius: 12px !important;
 font-size: 12px !important;
 }

 .order-hero-card-test-2 .quick-action-btn span {
 margin-top: 0 !important;
 font-size: 10px !important;
 }

 .order-command-board {
 gap: 8px !important;
 }

 .command-status-panel,
 .command-progress-panel,
 .command-estimate-panel,
 .command-money-panel,
 .command-client-panel,
 .command-notes-panel,
 .command-map-panel {
 padding: 12px !important;
 border-radius: 15px !important;
 }

 .command-map-panel {
 display: grid !important;
 grid-template-columns: 1fr !important;
 gap: 8px !important;
 }

 .command-map-panel iframe {
 min-height: 145px !important;
 border-radius: 12px !important;
 }

 .command-status-panel strong,
 .command-money-panel strong {
 font-size: 24px !important;
 line-height: 1.08 !important;
 }
}
.company-settings-card-integrations {
 --company-accent: #8b5cf6;
}
.company-settings-branches {
 --company-accent: #2563eb;
 grid-column: 1 / -1;
}

.company-settings-card-head {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 12px;
 padding-bottom: 12px;
 margin-bottom: 14px;
 border-bottom: 1px solid #e5edf6;
}

.company-settings-card-head h3 {
 display: inline-block;
 padding-bottom: 6px;
 border-bottom: 3px solid var(--company-accent);
 font-size: 20px;
}

.company-settings-fields,
.company-branch-row {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 12px;
}

.company-settings-fields label,
.company-branch-row label {
 display: flex;
 flex-direction: column;
 gap: 6px;
 min-width: 0;
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
}

.company-settings-fields input,
.company-settings-fields select,
.company-settings-fields textarea,
.company-branch-row input {
 width: 100%;
 min-height: 42px;
 border: 1px solid #dbe4f0;
 border-radius: 14px;
 padding: 10px 12px;
 background: #ffffff;
 color: #111827;
 font-size: 14px;
 font-weight: 800;
}

.company-settings-fields textarea {
 resize: vertical;
 min-height: 82px;
}

.company-settings-wide {
 grid-column: 1 / -1;
}

.company-branches-list {
 display: grid;
 gap: 12px;
}

.company-branch-row {
 padding: 12px;
 border: 1px solid #e5edf6;
 border-radius: 16px;
 background: #f8fafc;
}

.company-branch-row-new {
 border-style: dashed;
 border-color: #bfdbfe;
 background: #eff6ff;
}

.company-branch-active {
 flex-direction: row !important;
 align-items: center;
 justify-content: flex-start;
 min-height: 42px;
 padding: 10px 12px;
 border: 1px solid #dbe4f0;
 border-radius: 14px;
 background: #ffffff;
}

.company-branch-active input {
 width: auto;
 min-height: 0;
}

.company-settings-bottom {
 position: sticky;
 bottom: 12px;
 display: flex;
 justify-content: flex-end;
 padding: 10px;
 border: 1px solid #e5edf6;
 border-radius: 18px;
 background: rgba(255, 255, 255, 0.94);
 box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12);
 z-index: 20;
}

@media (max-width: 900px) {
 .company-settings-hero {
 align-items: stretch;
 flex-direction: column;
 }

 .company-settings-grid,
 .company-settings-fields,
 .company-branch-row {
 grid-template-columns: 1fr;
 }

 .company-settings-bottom {
 bottom: 8px;
 }

 .company-settings-bottom .btn,
 .company-settings-actions .btn {
 width: 100%;
 }
}

/* Sectiune 68 - taburi setari firma + produse / cupoane / teme */
.company-settings-tabs {
 display: flex;
 gap: 10px;
 flex-wrap: wrap;
}

.company-settings-tab {
 min-height: 42px;
 padding: 0 16px;
 border: 1px solid #dbe4f0;
 border-radius: 14px;
 background: #ffffff;
 color: #475569;
 font-size: 14px;
 font-weight: 950;
 cursor: pointer;
 box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
}

.company-settings-tab.is-active {
 border-color: #ff8a00;
 background: #fff7ed;
 color: #9a3412;
 box-shadow: 0 14px 30px rgba(255, 138, 0, 0.14);
}

.company-settings-panel {
 display: none;
}

.company-settings-panel.is-active {
  display: block;
}

.company-settings-card-print-agents {
  --print-agent-accent: #ff8a00;
}

.print-agent-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.print-agent-download-note {
  margin: 12px 0 0;
  padding: 11px 13px;
  border: 1px solid rgba(255, 138, 0, 0.24);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(255, 138, 0, 0.08), rgba(255, 255, 255, 0.94));
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
}

.print-agent-download-note a {
  color: #9a3412;
  font-weight: 950;
  text-decoration: none;
}

.print-agent-download-note a:hover {
  text-decoration: underline;
}

.print-pairing-code-card {
  display: grid;
  gap: 6px;
  margin: 16px 0;
  padding: 18px;
  border: 1px solid rgba(255, 138, 0, 0.32);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(255, 138, 0, 0.14), rgba(255, 255, 255, 0.95));
}

.print-pairing-code-card span,
.print-assignment-card span,
.print-agent-meta dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.print-pairing-code-card strong {
  color: var(--text);
  font-size: clamp(34px, 6vw, 56px);
  letter-spacing: 0.12em;
  line-height: 1;
}

.print-pairing-code-card small {
  color: var(--muted);
  font-weight: 700;
}

.print-assignment-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 18px 0;
}

.print-assignment-card {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(248, 250, 252, 0.92);
}

.print-assignment-card select {
  width: 100%;
  min-height: 44px;
  border: 1px solid #d8e0ec;
  border-radius: 12px;
  background: #fff;
  color: var(--text);
  font-weight: 900;
}

.print-assignment-card small {
  color: var(--muted);
  font-weight: 700;
  line-height: 1.35;
}

.print-agents-list {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.print-agent-empty,
.print-agent-card {
  border: 1px solid var(--line);
  border-left: 4px solid #cbd5e1;
  border-radius: 18px;
  background: #fff;
  padding: 16px;
}

.print-agent-card.is-online {
  border-left-color: #22c55e;
  box-shadow: 0 18px 50px rgba(34, 197, 94, 0.1);
}

.print-agent-card.is-offline {
  border-left-color: #94a3b8;
}

.print-agent-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.print-agent-head div {
  display: grid;
  gap: 4px;
}

.print-agent-head strong {
  color: var(--text);
  font-size: 18px;
}

.print-agent-head span {
  width: fit-content;
  padding: 4px 10px;
  border-radius: 999px;
  background: #ecfdf5;
  color: #166534;
  font-size: 12px;
  font-weight: 900;
}

.print-agent-card.is-offline .print-agent-head span {
  background: #f1f5f9;
  color: #475569;
}

.print-agent-head small {
  color: var(--muted);
  font-weight: 800;
  white-space: nowrap;
}

.print-agent-head-side {
  display: grid;
  justify-items: end;
  gap: 8px;
}

.print-agent-revoke-form {
  margin: 0;
}

.print-agent-revoke-btn {
  min-height: 32px;
  padding: 7px 10px;
  border-color: #fecaca !important;
  background: #fff1f2 !important;
  color: #991b1b !important;
  box-shadow: none !important;
}

.print-agent-revoke-btn:hover {
  background: #fee2e2 !important;
  color: #7f1d1d !important;
}

.print-agent-notice {
  margin: 16px 0 6px;
  padding: 12px 14px;
  border: 1px solid #bbf7d0;
  border-radius: 14px;
  background: #f0fdf4;
  color: #166534;
  font-weight: 900;
}

.print-agent-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 12px;
}

.print-agent-meta dd {
  margin: 3px 0 0;
  color: var(--text);
  font-weight: 900;
  overflow-wrap: anywhere;
}

.print-agent-printers {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.print-agent-printers span {
  padding: 7px 10px;
  border-radius: 999px;
  background: #eef2ff;
  color: #1e3a8a;
  font-weight: 900;
}

@media (max-width: 900px) {
  .print-assignment-grid,
  .print-agent-meta {
    grid-template-columns: 1fr;
  }

  .account-scanner-mode-options {
  grid-template-columns: 1fr;
  }

  .print-agent-head-actions {
    width: 100%;
    justify-content: stretch;
  }

  .print-agent-head-actions .btn {
    flex: 1 1 180px;
  }

  .print-agent-head {
    flex-direction: column;
  }

  .print-agent-head-side {
    width: 100%;
    justify-items: stretch;
  }

  .print-agent-revoke-btn {
    width: 100%;
  }
}

.company-settings-card-products {
 --company-accent: #334155;
}
.company-settings-card-adjustments {
 --company-accent: #16a34a;
}
.company-settings-card-theme {
 --company-accent: #7c3aed;
}
.company-settings-card-statuses {
 --company-accent: #0ea5e9;
}

.company-products-list,
.company-adjustments-list {
 display: grid;
 gap: 10px;
}

.company-product-row,
.company-adjustment-row {
 display: grid;
 gap: 8px;
 align-items: center;
 padding: 10px;
 border: 1px solid #e5edf6;
 border-radius: 16px;
 background: #f8fafc;
}

.company-product-row {
 grid-template-columns:
 minmax(180px, 1.5fr) minmax(110px, 0.8fr)
 120px 90px 92px 72px 80px;
}

.company-adjustment-row {
 grid-template-columns:
 minmax(150px, 1.2fr) minmax(110px, 0.8fr) 140px minmax(130px, 0.8fr)
 110px 80px;
}

.company-product-row-head,
.company-adjustment-row-head {
 padding: 0 10px;
 border: 0;
 background: transparent;
 color: #64748b;
 font-size: 12px;
 font-weight: 950;
 text-transform: uppercase;
}

.company-product-row input,
.company-product-row select,
.company-adjustment-row input,
.company-adjustment-row select,
.company-adjustment-row textarea {
 width: 100%;
 min-height: 38px;
 border: 1px solid #dbe4f0;
 border-radius: 12px;
 padding: 8px 10px;
 background: #ffffff;
 color: #111827;
 font-size: 13px;
 font-weight: 850;
}

.company-product-row-new,
.company-adjustment-row-new {
 border-style: dashed;
 border-color: #fed7aa;
 background: #fff7ed;
}

.company-check-cell {
 min-height: 38px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 6px;
 border: 1px solid #dbe4f0;
 border-radius: 12px;
 background: #ffffff;
 color: #475569;
 font-size: 12px;
 font-weight: 950;
}

.company-check-cell input {
 width: auto;
 min-height: 0;
}

.company-inline-pair {
 display: grid;
 grid-template-columns: minmax(0, 1fr) 62px;
 gap: 6px;
}

.company-adjustment-row textarea {
 grid-column: 1 / -1;
 min-height: 58px;
 resize: vertical;
}

.company-theme-grid {
 display: grid;
 grid-template-columns: repeat(5, minmax(0, 1fr));
 gap: 12px;
}

.company-theme-option {
 cursor: pointer;
}

.company-theme-option input {
 position: absolute;
 opacity: 0;
 pointer-events: none;
}

.company-theme-preview {
 min-height: 138px;
 display: grid;
 align-content: start;
 gap: 8px;
 padding: 12px;
 border: 2px solid #e5edf6;
 border-radius: 18px;
 background: var(--theme-bg);
 color: var(--theme-text);
 box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

.company-theme-preview > span {
 height: 48px;
 border-radius: 14px;
 background:
 linear-gradient(135deg, var(--theme-brand), var(--theme-brand2)),
 var(--theme-panel);
 box-shadow: inset 0 -12px 0
 color-mix(in srgb, var(--theme-panel) 86%, transparent);
}

.company-theme-preview strong,
.company-theme-preview small {
 display: block;
}

.company-theme-preview strong {
 font-size: 14px;
 font-weight: 950;
}

.company-theme-preview small {
 color: color-mix(in srgb, var(--theme-text) 62%, transparent);
 font-size: 12px;
 font-weight: 850;
}

.company-theme-option.is-selected .company-theme-preview,
.company-theme-option input:checked + .company-theme-preview {
 border-color: var(--theme-brand);
 box-shadow: 0 18px 42px
 color-mix(in srgb, var(--theme-brand) 24%, transparent);
}

.company-status-structure {
 display: grid;
 grid-template-columns: repeat(4, minmax(0, 1fr));
 gap: 12px;
}

.company-status-structure > div {
 min-height: 160px;
 display: grid;
 align-content: start;
 gap: 8px;
 padding: 14px;
 border: 1px solid #dbeafe;
 border-left: 4px solid #0ea5e9;
 border-radius: 18px;
 background: linear-gradient(135deg, #eff6ff 0%, #ffffff 72%);
}

.company-status-structure strong,
.company-status-structure span,
.company-status-structure p {
 display: block;
}

.company-status-structure strong {
 color: #111827;
 font-size: 16px;
 font-weight: 950;
}

.company-status-structure span {
 width: fit-content;
 padding: 6px 9px;
 border-radius: 999px;
 background: #dbeafe;
 color: #1e40af;
 font-size: 12px;
 font-weight: 950;
}

.company-status-structure p {
 margin: 0;
 color: #64748b;
 font-size: 13px;
 font-weight: 750;
 line-height: 1.35;
}

.company-friendly-url-map {
 display: grid;
 gap: 14px;
 margin-top: 18px;
 padding-top: 18px;
 border-top: 1px solid #e5e7eb;
}

.company-friendly-url-table {
 display: grid;
 gap: 8px;
}

.company-friendly-url-row {
 display: grid;
 grid-template-columns: minmax(150px, 0.8fr) minmax(220px, 1fr) minmax(
 220px,
 1fr
 );
 align-items: center;
 gap: 10px;
 padding: 10px;
 border: 1px solid #e2e8f0;
 border-radius: 14px;
 background: #ffffff;
}

.company-friendly-url-row-head {
 border-color: #cbd5e1;
 background: #f8fafc;
 color: #475569;
 font-size: 12px;
 font-weight: 950;
 text-transform: uppercase;
}

.company-friendly-url-row strong {
 color: #111827;
 font-size: 14px;
 font-weight: 950;
}

.company-friendly-url-page,
.company-friendly-url-seo {
 display: grid;
 gap: 5px;
 margin: 0;
}

.company-friendly-url-page {
 grid-template-columns: auto minmax(0, 1fr);
 align-items: center;
 column-gap: 8px;
}

.company-friendly-url-page small {
 grid-column: 2;
 color: #64748b;
 font-size: 11px;
 font-weight: 850;
}

.company-friendly-url-page input[type="checkbox"] {
 width: 18px;
 height: 18px;
 accent-color: #ff8a00;
}

.company-friendly-url-seo input {
 width: 100%;
 min-height: 38px;
 border: 1px solid #cbd5e1;
 border-radius: 10px;
 padding: 0 10px;
 background: #ffffff;
 color: #0f172a;
 font-size: 13px;
 font-weight: 850;
}

.company-friendly-url-seo small {
 overflow-wrap: anywhere;
 color: #64748b;
 font-size: 11px;
 font-weight: 800;
}

.company-friendly-url-row code {
 display: block;
 overflow-wrap: anywhere;
 padding: 7px 9px;
 border-radius: 10px;
 background: #f1f5f9;
 color: #0f172a;
 font-size: 12px;
 font-weight: 850;
}

.order-item-progress-tile {
 border-color: #dbeafe !important;
 background: linear-gradient(135deg, #eff6ff 0%, #ffffff 74%) !important;
}

.order-item-progress-tile.is-measured {
 border-color: #bae6fd !important;
 background: linear-gradient(135deg, #e0f2fe 0%, #ffffff 74%) !important;
}

.order-item-progress-tile.is-ready {
 border-color: #bbf7d0 !important;
 background: linear-gradient(135deg, #dcfce7 0%, #ffffff 74%) !important;
}

@media (max-width: 1100px) {
 .company-product-row,
 .company-adjustment-row {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .company-product-row-head,
 .company-adjustment-row-head {
 display: none;
 }

 .company-theme-grid {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .company-status-structure {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .company-friendly-url-row {
 grid-template-columns: 1fr;
 align-items: stretch;
 }
}

@media (max-width: 700px) {
 .company-settings-tab {
 flex: 1 1 calc(50% - 6px);
 padding-inline: 10px;
 font-size: 12px;
 }

 .company-product-row,
 .company-adjustment-row,
 .company-theme-grid,
 .company-status-structure {
 grid-template-columns: 1fr;
 }

 .company-friendly-url-row-head {
 display: none;
 }
}

/* Sectiune 69 - teme per utilizator */
body[class*="user-theme-"] {
 background:
 radial-gradient(
 circle at top left,
 color-mix(in srgb, var(--brand) 9%, transparent),
 transparent 32rem
 ),
 var(--bg) !important;
 color: var(--text) !important;
}

body[class*="user-theme-"] .card,
body[class*="user-theme-"] .topbar,
body[class*="user-theme-"] .company-settings-bottom,
body[class*="user-theme-"] .order-edit-modal-card,
body[class*="user-theme-"] .order-products-card {
 background-color: var(--panel) !important;
}

body[class*="user-theme-"] .btn.primary,
body[class*="user-theme-"] .header-icon-btn.active,
body[class*="user-theme-"] .orders-toggle-btn.is-active,
body[class*="user-theme-"] .company-settings-tab.is-active {
 background: linear-gradient(135deg, var(--brand), var(--brand-2)) !important;
 border-color: color-mix(in srgb, var(--brand) 80%, #ffffff) !important;
 color: #111827 !important;
}

body[class*="user-theme-"] .btn,
body[class*="user-theme-"] button,
body[class*="user-theme-"] .header-icon-btn,
body[class*="user-theme-"] .orders-toggle-btn,
body[class*="user-theme-"] .company-settings-tab,
body[class*="user-theme-"] .scanner-control-btn {
 -webkit-text-stroke: 0 transparent;
 text-shadow: none !important;
}

body[class*="user-theme-"] .btn.primary,
body[class*="user-theme-"] .header-icon-btn.active,
body[class*="user-theme-"] .orders-toggle-btn.is-active,
body[class*="user-theme-"] .company-settings-tab.is-active {
 -webkit-text-stroke: 0 transparent;
 text-shadow: none !important;
}

body[class*="user-theme-"] .company-settings-tab.is-active {
 box-shadow: 0 14px 30px color-mix(in srgb, var(--brand) 18%, transparent);
}

body[class*="user-theme-"] .company-settings-hero,
body[class*="user-theme-"] .company-settings-card {
 border-left-color: var(--brand);
}

body[class*="user-theme-"] .company-settings-card-head h3,
body[class*="user-theme-"] .products-section-head h3,
body[class*="user-theme-"] .order-history-toolbar h3 {
 border-bottom-color: var(--brand) !important;
}
/* Routes office */
.routes-office-page {
 display: grid;
 gap: 18px;
}

.routes-office-top {
 display: flex;
 justify-content: space-between;
 align-items: flex-end;
 gap: 14px;
}

.routes-office-top h2 {
 margin: 0;
 font-size: 30px;
}

.routes-office-top p {
 margin: 5px 0 0;
 color: #64748b;
}

.routes-date-form,
.route-generate-form {
 display: flex;
 align-items: end;
 gap: 10px;
 flex-wrap: wrap;
}

.route-generate-form label,
.route-control-strip label {
 display: grid;
 gap: 5px;
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
}

.route-control-strip input,
.route-generate-form input,
.route-generate-form select {
 min-height: 42px;
 border: 1px solid #dbe3ef;
 border-radius: 12px;
 padding: 8px 10px;
 background: #fff;
 color: #0f172a;
 font-weight: 850;
}

.routes-office-grid {
 display: grid;
 grid-template-columns: minmax(0, 1.35fr) minmax(340px, 0.9fr);
 gap: 18px;
 align-items: start;
}

.routes-stack {
 display: grid;
 gap: 22px;
}

.route-block {
 padding: 12px;
 border-radius: 24px;
 background: linear-gradient(
 135deg,
 rgba(255, 138, 0, 0.08),
 rgba(37, 99, 235, 0.06)
 );
 border: 1px solid rgba(203, 213, 225, 0.78);
}

.route-block .routes-map-card {
 position: sticky;
 top: calc(var(--topbar-height, 58px) + 14px);
 z-index: 4;
}

.routes-eligible-card {
 margin-top: 22px;
}

.routes-proposals-board {
 display: grid;
 gap: 14px;
}

.routes-board-head {
 display: flex;
 align-items: flex-end;
 justify-content: space-between;
 gap: 14px;
 padding: 16px 18px;
 border: 1px solid rgba(203, 213, 225, 0.86);
 border-radius: 22px;
 background:
 linear-gradient(135deg, rgba(255, 138, 0, 0.09), rgba(37, 99, 235, 0.06)),
 #ffffff;
 box-shadow: 0 18px 48px rgba(15, 23, 42, 0.07);
}

.routes-board-head h3 {
 margin: 0;
 font-size: 24px;
}

.routes-board-head p {
 margin: 5px 0 0;
 color: #64748b;
 font-weight: 750;
}

.routes-board-refresh {
 flex: 0 0 auto;
}

.routes-proposal-grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
 gap: 14px;
}

.route-proposal-card {
 position: relative;
 display: grid;
 gap: 12px;
 min-height: 230px;
 padding: 16px;
 border: 1px solid #dbe3ef;
 border-radius: 22px;
 overflow: hidden;
 background: #ffffff;
 box-shadow: 0 18px 44px rgba(15, 23, 42, 0.08);
 transition:
 transform 0.16s ease,
 border-color 0.16s ease,
 box-shadow 0.16s ease,
 background 0.16s ease;
}

.route-proposal-card::before {
 content: "";
 position: absolute;
 inset: 0 auto 0 0;
 width: 8px;
 background: linear-gradient(180deg, #ff8a00, #2563eb);
}

.route-proposal-card.is-good::before {
 background: linear-gradient(180deg, #22c55e, #14b8a6);
}

.route-proposal-card.is-watch::before {
 background: linear-gradient(180deg, #f59e0b, #ff8a00);
}

.route-proposal-card.is-hard::before {
 background: linear-gradient(180deg, #ef4444, #f97316);
}

.route-proposal-card.is-active {
 border-color: #ff8a00;
 background:
 radial-gradient(circle at top right, rgba(255, 138, 0, 0.24), transparent 38%),
 linear-gradient(135deg, rgba(255, 247, 237, 0.98), rgba(255, 255, 255, 0.98));
 box-shadow:
 0 0 0 4px rgba(255, 138, 0, 0.2),
 0 24px 70px rgba(255, 138, 0, 0.24);
 transform: translateY(-2px);
}

.route-proposal-card.is-active::after {
 content: "";
 position: absolute;
 inset: 8px;
 border: 2px solid rgba(255, 138, 0, 0.28);
 border-radius: 18px;
 pointer-events: none;
}

.route-proposal-card.is-active .route-proposal-link strong {
 color: #9a3412;
}

.route-proposal-active-badge {
 position: absolute;
 top: 78px;
 right: 14px;
 z-index: 2;
 padding: 6px 10px;
 border-radius: 999px;
 background: #ff8a00;
 color: #111827;
 font-size: 11px;
 font-weight: 950;
 text-transform: uppercase;
 box-shadow: 0 8px 22px rgba(255, 138, 0, 0.28);
}

.route-proposal-link {
 display: grid;
 gap: 5px;
 padding-right: 70px;
 color: inherit;
 text-decoration: none;
}

.route-proposal-kicker {
 color: #64748b;
 font-size: 12px;
 font-weight: 950;
 text-transform: uppercase;
}

.route-proposal-link strong {
 color: #0f172a;
 font-size: 23px;
 line-height: 1.08;
}

.route-proposal-link small {
 color: #64748b;
 font-size: 13px;
 font-weight: 800;
 line-height: 1.35;
}

.route-proposal-score {
 position: absolute;
 top: 14px;
 right: 14px;
 width: 56px;
 height: 56px;
 border-radius: 18px;
 display: grid;
 place-items: center;
 background: #eff6ff;
 color: #1d4ed8;
 border: 1px solid #bfdbfe;
}

.route-proposal-score span {
 font-size: 21px;
 font-weight: 950;
 line-height: 1;
}

.route-proposal-score small {
 margin-top: -8px;
 color: #64748b;
 font-size: 10px;
 font-weight: 900;
 text-transform: uppercase;
}

.route-proposal-metrics {
 display: grid;
 grid-template-columns: repeat(4, minmax(0, 1fr));
 gap: 7px;
}

.route-proposal-metrics div {
 padding: 9px 8px;
 border: 1px solid #e2e8f0;
 border-radius: 14px;
 background: #f8fafc;
 min-width: 0;
}

.route-proposal-metrics span {
 display: block;
 color: #64748b;
 font-size: 10px;
 font-weight: 950;
 text-transform: uppercase;
}

.route-proposal-metrics b {
 display: block;
 margin-top: 3px;
 color: #0f172a;
 font-size: 14px;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}

.route-proposal-actions {
 display: flex;
 gap: 8px;
 flex-wrap: wrap;
 align-items: center;
}

.routes-empty-detail-card {
 display: grid;
 gap: 5px;
 border-style: dashed;
 text-align: center;
}

.routes-empty-detail-card strong {
 font-size: 21px;
}

.routes-empty-detail-card p {
 margin: 0;
 color: #64748b;
 font-weight: 800;
}

.route-state {
 display: inline-flex;
 align-items: center;
 border-radius: 999px;
 padding: 8px 12px;
 background: #eef2ff;
 color: #1e3a8a;
 font-weight: 900;
 text-transform: uppercase;
 font-size: 12px;
}

.route-state-confirmed {
 background: #dcfce7;
 color: #166534;
}

.route-meta {
 display: grid;
 grid-template-columns: auto 1fr auto 1fr;
 gap: 8px 12px;
 align-items: center;
 margin-bottom: 14px;
 padding: 12px;
 border: 1px solid #e2e8f0;
 border-radius: 14px;
 background: #f8fafc;
}

.route-meta span {
 color: #64748b;
 font-size: 13px;
 font-weight: 800;
}

.route-control-strip {
 display: flex;
 align-items: end;
 justify-content: space-between;
 gap: 10px;
 margin: 10px 0;
 padding: 10px;
 border: 1px solid #e2e8f0;
 border-radius: 14px;
 background: #f8fafc;
}

.route-stop-list,
.route-candidate-list {
 display: grid;
 gap: 10px;
}

.route-stop-list[data-route-stop-list] {
 position: relative;
}

.route-stop-list[data-route-stop-list]::before {
 content: "";
 position: absolute;
 top: 22px;
 bottom: 22px;
 left: 23px;
 width: 3px;
 border-radius: 999px;
 background: linear-gradient(180deg, #ff8a00, #94a3b8 55%, #2563eb);
 opacity: 0.24;
}

.route-stop-card {
 position: relative;
 z-index: 1;
 display: grid;
 grid-template-columns: 46px minmax(0, 1fr);
 gap: 12px;
 border: 1px solid #e2e8f0;
 border-radius: 16px;
 background: #ffffff;
 box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08);
 padding: 10px;
 cursor: grab;
 transition:
 transform 0.16s ease,
 box-shadow 0.16s ease,
 opacity 0.16s ease;
}

.route-stop-card.is-dragging {
 opacity: 0.62;
 transform: scale(0.99);
 box-shadow: 0 18px 42px rgba(15, 23, 42, 0.16);
}

.route-stop-card.is-done {
 opacity: 0.62;
 filter: grayscale(0.2);
}

.route-stop-order {
 position: relative;
 z-index: 2;
 display: grid;
 place-items: center;
 min-height: 64px;
 border-radius: 12px;
 background: #334155;
 color: #ffffff;
 font-size: 22px;
 font-weight: 950;
}

.route-stop-main {
 min-width: 0;
}

.route-stop-head,
.route-stop-client,
.route-stop-foot {
 display: flex;
 justify-content: space-between;
 align-items: center;
 gap: 10px;
}

.route-stop-head strong,
.route-stop-client b {
 min-width: 0;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.route-stop-head span {
 border-radius: 999px;
 background: #f1f5f9;
 padding: 5px 9px;
 color: #475569;
 font-weight: 900;
 font-size: 12px;
}

.route-stop-head .route-stop-time-stack {
 display: grid;
 justify-items: end;
 gap: 3px;
 flex: 0 0 auto;
 padding: 0;
 border-radius: 0;
 background: transparent;
}

.route-stop-time-stack b {
 padding: 5px 9px;
 border-radius: 999px;
 background: #f8fafc;
 color: #0f172a;
 font-size: 12px;
}

.route-stop-time-stack small {
 color: #2563eb;
 font-size: 11px;
 font-weight: 950;
 white-space: nowrap;
}

.route-stop-client {
 margin-top: 5px;
}

.route-stop-client a {
 color: #1e3a8a;
 font-weight: 900;
 text-decoration: none;
}

.route-stop-card p {
 margin: 7px 0 9px;
 color: #475569;
 line-height: 1.35;
}

.route-stop-extra,
.route-candidate-extra {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 gap: 6px;
 min-width: 0;
}

.route-stop-extra {
 margin: -2px 0 8px;
}

.route-stop-schedule-chip,
.route-candidate-schedule-chip {
 display: inline-flex;
 align-items: center;
 min-height: 24px;
 padding: 4px 8px;
 border: 1px solid #fed7aa;
 border-radius: 999px;
 background: #fff7ed;
 color: #9a3412;
 font-size: 12px;
 font-weight: 950;
 line-height: 1.1;
}

.route-stop-note,
.route-candidate-note {
 display: inline-flex;
 align-items: center;
 max-width: 100%;
 min-height: 24px;
 padding: 4px 8px;
 border: 1px solid #dbeafe;
 border-radius: 10px;
 background: #f8fafc;
 color: #334155;
 font-size: 12px;
 font-weight: 850;
 line-height: 1.18;
}

.route-stop-action-row {
 display: flex;
 flex-wrap: wrap;
 gap: 6px;
 margin: 8px 0;
}

.route-stop-action {
 min-height: 34px;
 padding: 8px 10px;
 border: 0;
 border-radius: 10px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 background: #eef2ff;
 color: #1e3a8a;
 font-size: 12px;
 font-weight: 950;
 text-decoration: none;
 cursor: pointer;
}

.route-action-money {
 background: #dcfce7;
 color: #166534;
}

.route-action-danger,
.danger-soft {
 background: #fee2e2 !important;
 color: #991b1b !important;
}

.route-stop-foot .order-compact-status {
 max-width: 70%;
}

.btn.tiny {
 min-height: 30px;
 padding: 6px 10px;
 border-radius: 10px;
 font-size: 12px;
}

.routes-actions,
.routes-confirm-form,
.routes-delete-form,
.routes-route-actions {
 margin-top: 12px;
 display: flex;
 justify-content: flex-end;
 gap: 8px;
 flex-wrap: wrap;
}

.routes-route-actions {
 align-items: center;
}

.routes-map-frame {
 overflow: hidden;
 border-radius: 16px;
 border: 1px solid #dbeafe;
 background: #eff6ff;
 min-height: 360px;
}

.routes-map-frame iframe {
 width: 100%;
 height: 360px;
 border: 0;
 display: block;
}

.route-google-map {
 width: 100%;
 height: 420px;
 min-height: 360px;
 background: #e2e8f0;
}

.route-map-fallback {
 min-height: 360px;
 padding: 28px;
 display: grid;
 align-content: center;
 justify-items: center;
 gap: 12px;
 text-align: center;
 background:
 linear-gradient(135deg, rgba(255, 138, 0, 0.08), rgba(37, 99, 235, 0.08)),
 #f8fafc;
}

.route-map-fallback-icon {
 width: 64px;
 height: 64px;
 border-radius: 20px;
 display: grid;
 place-items: center;
 background: #111827;
 color: #fff;
 font-weight: 950;
 box-shadow: 0 16px 34px rgba(15, 23, 42, 0.18);
}

.route-map-fallback strong {
 font-size: 20px;
}

.route-map-fallback p {
 max-width: 440px;
 margin: 0;
 color: #64748b;
 font-weight: 700;
}

.route-map-mini-stops {
 width: min(100%, 520px);
 display: grid;
 gap: 6px;
 margin-top: 6px;
}

.route-map-mini-stops span {
 display: flex;
 align-items: center;
 gap: 8px;
 padding: 7px 10px;
 border: 1px solid #e2e8f0;
 border-radius: 999px;
 background: rgba(255, 255, 255, 0.82);
 color: #334155;
 font-size: 13px;
 font-weight: 850;
}

.route-map-mini-stops b {
 width: 24px;
 height: 24px;
 border-radius: 999px;
 display: inline-grid;
 place-items: center;
 background: #334155;
 color: #fff;
}

.routes-map-card.is-map-loading .routes-map-frame {
 position: relative;
}

.routes-map-card.is-map-loading .routes-map-frame::after {
 content: "Se calculeaza traseul...";
 position: absolute;
 inset: 14px;
 border-radius: 14px;
 display: grid;
 place-items: center;
 background: rgba(255, 255, 255, 0.78);
 color: #0f172a;
 font-weight: 950;
 pointer-events: none;
}

.route-map-actions {
 display: flex;
 flex-wrap: wrap;
 gap: 8px;
 margin: 12px 0 0;
}

.route-map-estimates {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 8px;
 margin: 12px 0 0;
}

.route-map-estimates div {
 padding: 10px 12px;
 border: 1px solid #e2e8f0;
 border-radius: 14px;
 background: #f8fafc;
}

.route-map-estimates span {
 display: block;
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
 text-transform: uppercase;
}

.route-map-estimates strong {
 display: block;
 margin-top: 3px;
 color: #0f172a;
 font-size: 16px;
}

.route-map-warning {
 margin: 12px 0 0;
 padding: 10px 12px;
 border: 1px solid #fed7aa;
 border-radius: 12px;
 background: #fff7ed;
 color: #9a3412;
 font-weight: 800;
}

.route-map-summary {
 display: grid;
 grid-template-columns: auto 1fr;
 gap: 7px 10px;
 margin-top: 12px;
 color: #475569;
}

.route-map-summary span {
 color: #64748b;
 font-weight: 900;
}

.route-map-summary small {
 grid-column: 1 / -1;
 color: #64748b;
}

.route-candidate-row {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 align-items: center;
 gap: 10px;
 border: 1px solid #e2e8f0;
 border-radius: 14px;
 background: #ffffff;
 padding: 12px;
 color: #111827;
}

.route-candidate-group-title {
 margin: 10px 0 2px;
 padding: 8px 12px;
 border-radius: 999px;
 background: #f1f5f9;
 color: #475569;
 font-weight: 950;
 text-transform: uppercase;
 font-size: 12px;
}

.route-candidate-locality-group {
 margin-top: 14px;
 overflow: hidden;
 border: 1px solid #dbe4ee;
 border-radius: 16px;
 background: #f8fafc;
 box-shadow: 0 6px 18px rgba(15, 23, 42, .045);
}

.route-candidate-locality-group .route-candidate-group-title {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 margin: 0;
 border-bottom: 1px solid #dbe4ee;
 border-radius: 0;
 background: #eaf0f6;
 color: #0f172a;
}

.route-candidate-locality-group .route-candidate-group-title strong {
 font-size: 14px;
}

.route-candidate-locality-group .route-candidate-group-title span {
 display: inline-flex;
 align-items: center;
 min-height: 25px;
 padding: 3px 9px;
 border: 1px solid #cbd5e1;
 border-radius: 999px;
 background: #fff;
 color: #475569;
 font-size: 11px;
 white-space: nowrap;
}

.route-candidate-locality-orders {
 display: grid;
 gap: 7px;
 padding: 8px;
}

.route-candidate-row.is-suggested {
 border-color: #fed7aa;
 background:
 linear-gradient(90deg, rgba(255, 138, 0, 0.10), rgba(255, 255, 255, 0.92)),
 #fff;
}

.route-save-highlight {
 animation: routeSavePulse 1.2s ease-in-out infinite;
}

@keyframes routeSavePulse {
 0%,
 100% {
 box-shadow: 0 0 0 rgba(255, 138, 0, 0);
 }

 50% {
 box-shadow: 0 0 0 5px rgba(255, 138, 0, 0.18);
 }
}

.route-candidate-row:hover {
 border-color: #ff8a00;
 box-shadow: 0 10px 24px rgba(255, 138, 0, 0.12);
}

.route-candidate-main {
 display: grid;
 gap: 4px;
 min-width: 0;
 color: inherit;
 text-decoration: none;
}

.route-candidate-extra {
 margin-top: 1px;
}

.route-candidate-row span,
.route-candidate-row small {
 color: #64748b;
}

.route-candidate-actions {
 display: flex;
 align-items: center;
 justify-content: flex-end;
 gap: 6px;
}

.route-candidate-actions select {
 max-width: 190px;
 min-height: 32px;
 border: 1px solid #dbe3ef;
 border-radius: 10px;
 background: #ffffff;
 color: #0f172a;
 font-size: 12px;
 font-weight: 850;
 padding: 5px 8px;
}

@media (max-width: 980px) {
 .page.routes-office-page {
 padding: 8px;
 gap: 10px;
 }

 .routes-office-top {
 align-items: stretch;
 flex-direction: column;
 gap: 8px;
 }

 .routes-office-top h2 {
 font-size: 24px;
 }

 .routes-office-top p {
 display: none;
 }

 .routes-office-grid {
 grid-template-columns: 1fr;
 gap: 10px;
 }

 .route-block .routes-map-card {
 position: relative;
 top: auto;
 }

 .route-candidate-row {
 grid-template-columns: 1fr;
 }

 .route-candidate-actions {
 justify-content: stretch;
 }

 .route-candidate-actions select,
 .route-candidate-actions .btn {
 flex: 1 1 auto;
 }

 .routes-planner-card,
 .routes-map-card,
 .routes-eligible-card {
 padding: 10px !important;
 border-radius: 14px !important;
 }

 .route-meta {
 grid-template-columns: auto 1fr auto 1fr;
 gap: 5px 8px;
 margin-bottom: 8px;
 padding: 8px;
 font-size: 13px;
 }

 .route-control-strip {
 align-items: stretch;
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 padding: 8px;
 }

 .route-stop-list,
 .route-candidate-list {
 gap: 7px;
 }

 .route-stop-card {
 grid-template-columns: 34px minmax(0, 1fr);
 gap: 8px;
 padding: 7px;
 border-radius: 12px;
 box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
 }

 .route-stop-order {
 min-height: 54px;
 border-radius: 10px;
 font-size: 18px;
 }

 .route-stop-head {
 align-items: flex-start;
 gap: 6px;
 }

 .route-stop-head strong {
 white-space: normal;
 font-size: 15px;
 }

 .route-stop-client {
 gap: 6px;
 }

 .route-stop-client b,
 .route-stop-client a {
 font-size: 15px;
 }

 .route-stop-card p {
 margin: 5px 0;
 font-size: 13px;
 }

 .route-stop-extra,
 .route-candidate-extra {
 gap: 5px;
 }

 .route-stop-schedule-chip,
 .route-candidate-schedule-chip,
 .route-stop-note,
 .route-candidate-note {
 font-size: 11px;
 padding: 4px 7px;
 }

 .route-stop-action-row {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 5px;
 }

 .route-stop-action {
 min-height: 32px;
 padding: 7px 8px;
 font-size: 11px;
 }

 .route-stop-foot {
 align-items: flex-start;
 gap: 6px;
 flex-direction: column;
 }

 .route-stop-foot .order-compact-status {
 max-width: 100%;
 }

 .routes-map-frame,
 .route-google-map {
 min-height: 280px;
 height: 280px;
 }

 .route-map-estimates {
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 5px;
 }

 .route-map-estimates div {
 padding: 7px;
 }

 .route-map-estimates strong {
 font-size: 13px;
 }
}

/* Consolidated asset block - foste patch-uri inglobate */

/* Header/user styles */
/* Header dreapta + user menu + iconuri vizibile */

.topbar.alpha31-topbar-fixed,
.alpha31-topbar-fixed {
 display: grid !important;
 grid-template-columns: minmax(0, 1fr) auto !important;
 align-items: center !important;
 gap: 12px !important;
}

.alpha31-topbar-fixed .topbar-main {
 min-width: 0 !important;
 display: flex !important;
 align-items: center !important;
 gap: 10px !important;
}

.alpha31-topbar-fixed .header-right-actions {
 display: flex !important;
 align-items: center !important;
 justify-content: flex-end !important;
 gap: 10px !important;
 min-width: max-content !important;
}

.alpha31-topbar-fixed .header-shortcuts {
 display: flex !important;
 align-items: center !important;
 justify-content: flex-end !important;
 gap: 8px !important;
 order: initial !important;
 grid-column: auto !important;
 width: auto !important;
 padding: 0 !important;
 margin: 0 !important;
 border: 0 !important;
 overflow: visible !important;
 flex: 0 0 auto !important;
}

.alpha31-topbar-fixed .header-icon-btn,
.alpha31-topbar-fixed .menu-trigger {
 position: relative !important;
 width: 42px !important;
 height: 42px !important;
 min-width: 42px !important;
 flex: 0 0 42px !important;
 display: inline-flex !important;
 align-items: center !important;
 justify-content: center !important;
 text-decoration: none !important;
 line-height: 1 !important;
}

.header-notifications,
.header-user-menu {
 position: relative !important;
 flex: 0 0 auto !important;
}

.notification-menu,
.user-dropdown {
 position: absolute !important;
 top: calc(100% + 10px) !important;
 right: 0 !important;
 z-index: 9999 !important;
 display: none !important;
}

.header-notifications.is-open .notification-menu,
.header-user-menu.is-open .user-dropdown {
 display: block !important;
}

.userbox.header-user-menu {
 display: flex !important;
 align-items: center !important;
 gap: 0 !important;
}

.userbox-button {
 display: flex !important;
 align-items: center !important;
 gap: 10px !important;
 border: 0 !important;
 background: transparent !important;
 padding: 0 !important;
 cursor: pointer !important;
 color: inherit !important;
}

.user-dropdown {
 width: 260px !important;
 overflow: hidden !important;
 border: 1px solid #e5e7eb !important;
 border-radius: 18px !important;
 background: #ffffff !important;
 box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22) !important;
}

.user-dropdown-head {
 display: grid !important;
 gap: 3px !important;
 padding: 14px !important;
 border-bottom: 1px solid #e5e7eb !important;
 background: #f8fafc !important;
}

.user-dropdown-head strong,
.user-dropdown-head span,
.user-dropdown-head small {
 display: block !important;
 min-width: 0 !important;
 overflow: hidden !important;
 text-overflow: ellipsis !important;
 white-space: nowrap !important;
}

.user-dropdown-head span,
.user-dropdown-head small {
 color: #64748b !important;
 font-size: 12px !important;
 font-weight: 800 !important;
}

.user-dropdown a {
 display: flex !important;
 align-items: center !important;
 gap: 8px !important;
 padding: 12px 14px !important;
 border-bottom: 1px solid #f1f5f9 !important;
 color: #0f172a !important;
 font-weight: 900 !important;
 text-decoration: none !important;
}

.user-dropdown a:hover {
 background: #fff7ed !important;
}

.user-dropdown a:last-child {
 border-bottom: 0 !important;
}

.user-dropdown .danger-link {
 color: #991b1b !important;
}

.notification-badge {
 pointer-events: none !important;
}

.header-action-cluster {
 display: inline-flex !important;
 align-items: center !important;
 gap: 0 !important;
 height: 42px !important;
 flex: 0 0 auto !important;
 border: 1px solid #e5e7eb !important;
 border-radius: 16px !important;
 background: rgba(255, 255, 255, 0.94) !important;
 box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08) !important;
 overflow: visible !important;
}

.header-action-cluster > .header-icon-btn,
.header-action-cluster > .header-smart-search > .header-icon-btn {
 width: 42px !important;
 height: 100% !important;
 min-width: 42px !important;
 flex-basis: 42px !important;
 border: 0 !important;
 border-radius: 0 !important;
 background: transparent !important;
 box-shadow: none !important;
}

.header-action-cluster > .header-icon-btn + .header-icon-btn,
.header-action-cluster > .header-smart-search,
.header-action-cluster > .header-smart-search + .header-icon-btn {
 border-left: 1px solid #e5e7eb !important;
}

.header-action-cluster > .header-smart-search {
 height: 100% !important;
}

.header-action-cluster > .header-smart-search:first-child {
 border-left: 0 !important;
}

.header-action-cluster > :first-child.header-icon-btn,
.header-action-cluster > :first-child .header-icon-btn {
 border-radius: 15px 0 0 15px !important;
}

.header-action-cluster > :last-child.header-icon-btn,
.header-action-cluster > :last-child .header-icon-btn {
 border-radius: 0 15px 15px 0 !important;
}

.header-action-cluster > :only-child.header-icon-btn,
.header-action-cluster > :only-child .header-icon-btn {
 border-left: 0 !important;
 border-radius: 15px !important;
}

.header-action-cluster .header-icon-btn:hover {
 transform: none !important;
 background: #fff7ed !important;
}

.header-action-cluster .header-icon-btn.active {
 transform: none !important;
 background: linear-gradient(135deg, #ff8a00, #ffbf00) !important;
 color: #0f172a !important;
}

.header-action-cluster .smart-search-toggle-btn {
 background: #fff7ed !important;
}

.header-action-cluster .header-smart-search-panel {
 right: 0 !important;
}

.header-agent-cluster {
 display: inline-flex !important;
 align-items: center !important;
 gap: 0 !important;
 height: 42px !important;
 flex: 0 0 auto !important;
 border: 1px solid #e5e7eb !important;
 border-radius: 16px !important;
 background: rgba(255, 255, 255, 0.94) !important;
 box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08) !important;
 overflow: visible !important;
}

.header-agent-cluster .header-notifications,
.header-agent-cluster .userbox.header-user-menu {
 height: 100% !important;
}

.header-agent-cluster .notification-toggle {
 width: 42px !important;
 height: 100% !important;
 min-width: 42px !important;
 flex-basis: 42px !important;
 border: 0 !important;
 border-radius: 15px 0 0 15px !important;
 background: transparent !important;
 box-shadow: none !important;
 font-size: 0 !important;
}

.header-agent-cluster .notification-toggle::after {
 content: none !important;
 display: none !important;
}

.header-agent-cluster .notification-icon {
 display: inline-flex !important;
 align-items: center !important;
 justify-content: center !important;
 font-size: 18px !important;
 line-height: 1 !important;
}

.header-agent-cluster .userbox-button {
 height: 100% !important;
 gap: 8px !important;
 padding: 0 8px 0 10px !important;
 border-left: 1px solid #e5e7eb !important;
 border-radius: 0 15px 15px 0 !important;
 background: linear-gradient(90deg, #ffffff, #f8fafc) !important;
}

.header-agent-cluster .userbox-text strong,
.header-agent-cluster .userbox-text .muted {
 display: block !important;
 max-width: 150px !important;
 overflow: hidden !important;
 text-overflow: ellipsis !important;
 white-space: nowrap !important;
}

.header-agent-cluster .avatar {
 width: 34px !important;
 height: 34px !important;
 min-width: 34px !important;
}

@media (max-width: 900px) {
 .topbar.alpha31-topbar-fixed,
 .alpha31-topbar-fixed {
 grid-template-columns: minmax(0, 1fr) auto !important;
 gap: 8px !important;
 }

 .alpha31-topbar-fixed .header-right-actions {
 gap: 5px !important;
 }

 .alpha31-topbar-fixed .header-shortcuts {
 gap: 5px !important;
 }

 .alpha31-topbar-fixed .header-icon-btn,
 .alpha31-topbar-fixed .menu-trigger {
 width: 37px !important;
 height: 37px !important;
 min-width: 37px !important;
 flex-basis: 37px !important;
 border-radius: 12px !important;
 font-size: 16px !important;
 }

 .userbox.header-user-menu {
 display: flex !important;
 }

 .userbox.header-user-menu .userbox-text {
 display: none !important;
 }

 .header-agent-cluster .userbox.header-user-menu .userbox-text {
 display: block !important;
 max-width: 86px !important;
 }

 .header-agent-cluster .userbox-text .muted {
 display: none !important;
 }

 .userbox.header-user-menu .avatar {
 width: 37px !important;
 height: 37px !important;
 }

 .notification-menu {
 right: -42px !important;
 width: min(320px, calc(100vw - 16px)) !important;
 }

 .user-dropdown {
 right: 0 !important;
 width: min(280px, calc(100vw - 16px)) !important;
 }

 .header-agent-cluster {
 height: 37px !important;
 border-radius: 13px !important;
 }

 .header-action-cluster {
 height: 37px !important;
 border-radius: 13px !important;
 }

 .header-action-cluster > .header-icon-btn,
 .header-action-cluster > .header-smart-search > .header-icon-btn {
 width: 37px !important;
 min-width: 37px !important;
 flex-basis: 37px !important;
 }

 .header-action-cluster > :first-child.header-icon-btn,
 .header-action-cluster > :first-child .header-icon-btn {
 border-radius: 12px 0 0 12px !important;
 }

 .header-action-cluster > :last-child.header-icon-btn,
 .header-action-cluster > :last-child .header-icon-btn {
 border-radius: 0 12px 12px 0 !important;
 }

 .header-action-cluster > :only-child.header-icon-btn,
 .header-action-cluster > :only-child .header-icon-btn {
 border-radius: 12px !important;
 }

 .header-agent-cluster .notification-toggle {
 width: 37px !important;
 min-width: 37px !important;
 flex-basis: 37px !important;
 border-radius: 12px 0 0 12px !important;
 }

 .header-agent-cluster .userbox-button {
 padding: 0 4px !important;
 border-radius: 0 12px 12px 0 !important;
 }

 .header-agent-cluster .userbox.header-user-menu .avatar {
 display: none !important;
 }

 .header-agent-cluster .notification-menu {
 right: -92px !important;
 }
}

@media (max-width: 430px) {
 .alpha31-topbar-fixed .header-icon-btn,
 .alpha31-topbar-fixed .menu-trigger,
 .userbox.header-user-menu .avatar {
 width: 33px !important;
 height: 33px !important;
 min-width: 33px !important;
 flex-basis: 33px !important;
 border-radius: 11px !important;
 font-size: 15px !important;
 }

 .alpha31-topbar-fixed .header-title-block h1 {
 font-size: 15px !important;
 }

 .header-agent-cluster {
 height: 33px !important;
 border-radius: 11px !important;
 }

 .header-action-cluster {
 height: 33px !important;
 border-radius: 11px !important;
 }

 .header-action-cluster > .header-icon-btn,
 .header-action-cluster > .header-smart-search > .header-icon-btn {
 width: 33px !important;
 min-width: 33px !important;
 flex-basis: 33px !important;
 }

 .header-action-cluster > :first-child.header-icon-btn,
 .header-action-cluster > :first-child .header-icon-btn {
 border-radius: 10px 0 0 10px !important;
 }

 .header-action-cluster > :last-child.header-icon-btn,
 .header-action-cluster > :last-child .header-icon-btn {
 border-radius: 0 10px 10px 0 !important;
 }

 .header-action-cluster > :only-child.header-icon-btn,
 .header-action-cluster > :only-child .header-icon-btn {
 border-radius: 10px !important;
 }

 .header-agent-cluster .notification-toggle {
 width: 33px !important;
 min-width: 33px !important;
 flex-basis: 33px !important;
 border-radius: 10px 0 0 10px !important;
 }

 .header-agent-cluster .userbox.header-user-menu .avatar {
 width: 29px !important;
 height: 29px !important;
 min-width: 29px !important;
 }

 .alpha31-topbar-fixed .header-right-actions {
 gap: 4px !important;
 }

 .alpha31-topbar-fixed .header-shortcuts {
 gap: 4px !important;
 }
}

.header-agent-cluster .userbox.header-user-menu .userbox-text {
 display: none !important;
}

.header-agent-cluster .userbox.header-user-menu .avatar {
 display: inline-flex !important;
 width: 40px !important;
 height: 100% !important;
 min-width: 40px !important;
 flex-basis: 40px !important;
 align-items: center !important;
 justify-content: center !important;
 border-radius: 0 15px 15px 0 !important;
 background: transparent !important;
 color: #0f172a !important;
 font-size: 0 !important;
 box-shadow: none !important;
}

.header-agent-cluster .userbox.header-user-menu .avatar::before {
 content: "\1F464";
 font-size: 18px !important;
 line-height: 1 !important;
}

@media (max-width: 900px) {
 .header-agent-cluster .userbox.header-user-menu .avatar {
 width: 36px !important;
 min-width: 36px !important;
 flex-basis: 36px !important;
 border-radius: 0 12px 12px 0 !important;
 }
}

@media (max-width: 430px) {
 .header-agent-cluster .userbox.header-user-menu .avatar {
 width: 32px !important;
 min-width: 32px !important;
 flex-basis: 32px !important;
 border-radius: 0 10px 10px 0 !important;
 }

 .header-agent-cluster .userbox.header-user-menu .avatar::before {
 font-size: 16px !important;
 }
}

/* Users/permissions styles */
.alpha32-success {
 margin-bottom: 14px;
 background: #dcfce7 !important;
 color: #166534;
 font-weight: 900;
}
.alpha32-tabs {
 display: flex;
 gap: 8px;
 flex-wrap: wrap;
 margin-bottom: 14px;
}
.alpha32-tab {
 border: 1px solid #e5e7eb;
 background: #fff;
 border-radius: 999px;
 padding: 10px 14px;
 font-weight: 900;
 cursor: pointer;
}
.alpha32-tab.is-active {
 background: #111827;
 color: #fff;
 border-color: #111827;
}
.alpha32-tab-panel {
 display: none;
}
.alpha32-tab-panel.is-active {
 display: block;
}
.alpha32-permission-grid {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 14px;
}
.alpha32-permission-card h3 {
 margin: 0 0 4px;
}
.alpha32-perms-list {
 display: grid;
 gap: 7px;
 margin: 12px 0;
}
.alpha32-perms-list label {
 display: grid;
 grid-template-columns: auto minmax(0, 1fr);
 gap: 8px;
 align-items: start;
 padding: 8px;
 border: 1px solid #e5e7eb;
 border-radius: 12px;
 background: #f8fafc;
}
.alpha32-perms-list input {
 margin-top: 3px;
}
.alpha32-perms-list strong,
.alpha32-perms-list small {
 display: block;
}
.alpha32-perms-list strong {
 font-size: 12px;
 color: #0f172a;
}
.alpha32-perms-list small {
 margin-top: 2px;
 color: #64748b;
 font-size: 11px;
 line-height: 1.25;
}
.alpha32-highlight {
 box-shadow:
 0 0 0 4px rgba(255, 122, 0, 0.18),
 0 16px 40px rgba(255, 122, 0, 0.16) !important;
 border-color: #fb923c !important;
}
.alpha32-account-grid {
 display: grid;
 grid-template-columns: minmax(0, 1fr) 360px;
 gap: 16px;
 align-items: start;
}
.alpha32-account-form {
 display: grid;
 gap: 12px;
}
.alpha32-account-form label {
 display: grid;
 gap: 6px;
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
}
.alpha32-my-perms {
 display: flex;
 flex-wrap: wrap;
 gap: 7px;
}
.alpha32-my-perms span {
 padding: 7px 9px;
 border-radius: 999px;
 background: #eef2ff;
 color: #3730a3;
 font-size: 12px;
 font-weight: 900;
}
@media (max-width: 900px) {
 .alpha32-permission-grid,
 .alpha32-account-grid {
 grid-template-columns: 1fr;
 }
 .alpha32-tab {
 flex: 1;
 }
 .users-grid {
 grid-template-columns: 1fr !important;
 }
}

/* UI standard styles */
/* Sectiune 34 - InstaCRM UI Modal Standard + notificari interne */
:root {
 --bg: #f4f6fb;
 --panel: #fff;
 --line: #e6e9f2;
 --text: #182033;
 --muted: #6b7280;
 --brand: #ff7a00;
 --brand2: #ffb000;
 --good: #16a34a;
 --warn: #f59e0b;
 --bad: #dc2626;
 --blue: #2563eb;
 --shadow: 0 30px 100px rgba(15, 23, 42, 0.28);
}
.instacrm-ui-body {
 margin: 0;
 min-height: 100vh;
 font-family:
 Inter,
 system-ui,
 -apple-system,
 Segoe UI,
 Arial,
 sans-serif;
 color: var(--text);
 background:
 radial-gradient(
 circle at top left,
 rgba(255, 122, 0, 0.16),
 transparent 28rem
 ),
 #111827;
 display: grid;
 place-items: center;
 padding: 18px;
}
.instacrm-error-backdrop {
 position: fixed;
 inset: 0;
 background: rgba(15, 23, 42, 0.64);
}
.instacrm-error-modal {
 position: relative;
 z-index: 2;
 width: min(560px, 100%);
 overflow: hidden;
 border: 1px solid rgba(255, 255, 255, 0.42);
 border-radius: 24px;
 background: var(--panel);
 box-shadow: var(--shadow);
 animation: crmModalPop 0.18s ease both;
}
.instacrm-error-head {
 display: flex;
 gap: 13px;
 align-items: flex-start;
 padding: 20px 20px 14px;
 background: linear-gradient(135deg, #fff7ed, #fff);
}
.instacrm-error-icon {
 width: 48px;
 height: 48px;
 display: grid;
 place-items: center;
 flex: 0 0 auto;
 border-radius: 18px;
 background: linear-gradient(135deg, var(--brand), var(--brand2));
 font-size: 24px;
}
.ui-modal-success .instacrm-error-icon {
 background: linear-gradient(135deg, #86efac, #22c55e);
}
.ui-modal-error .instacrm-error-icon {
 background: linear-gradient(135deg, #fecaca, #ef4444);
}
.ui-modal-info .instacrm-error-icon {
 background: linear-gradient(135deg, #bfdbfe, #60a5fa);
}
.instacrm-error-head h1 {
 margin: 0;
 font-size: 22px;
 line-height: 1.15;
}
.instacrm-error-head p {
 margin: 6px 0 0;
 color: var(--muted);
 font-size: 14px;
 line-height: 1.45;
}
.instacrm-error-body {
 padding: 16px 20px 20px;
}
.instacrm-error-message {
 padding: 14px;
 border: 1px solid #fed7aa;
 border-radius: 16px;
 background: #fff7ed;
 font-weight: 900;
 line-height: 1.45;
}
.ui-modal-success .instacrm-error-message {
 border-color: #bbf7d0;
 background: #f0fdf4;
 color: #166534;
}
.ui-modal-error .instacrm-error-message {
 border-color: #fecaca;
 background: #fef2f2;
 color: #991b1b;
}
.ui-modal-info .instacrm-error-message {
 border-color: #bfdbfe;
 background: #eff6ff;
 color: #1e3a8a;
}
.instacrm-error-hint {
 margin: 12px 0 0;
 color: var(--muted);
 line-height: 1.45;
}
.instacrm-error-actions {
 display: flex;
 gap: 10px;
 flex-wrap: wrap;
 margin-top: 18px;
}
.instacrm-error-actions .btn {
 width: auto;
}
.instacrm-error-details {
 margin-top: 14px;
 border: 1px solid var(--line);
 border-radius: 14px;
 background: #f8fafc;
 overflow: hidden;
}
.instacrm-error-details summary {
 padding: 10px 12px;
 cursor: pointer;
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
}
.instacrm-error-details pre {
 margin: 0;
 padding: 12px;
 border-top: 1px solid var(--line);
 white-space: pre-wrap;
 word-break: break-word;
 color: #991b1b;
 font-size: 12px;
}
.brand-mini {
 position: fixed;
 left: 18px;
 top: 18px;
 z-index: 2;
 display: flex;
 align-items: center;
 gap: 8px;
 color: #fff;
 font-weight: 950;
}
.brand-mini .brand-mark {
 width: 36px;
 height: 36px;
 display: grid;
 place-items: center;
 border-radius: 13px;
 background: linear-gradient(135deg, var(--brand), var(--brand2));
 color: #111;
}
@keyframes crmModalPop {
 from {
 opacity: 0;
 transform: translateY(12px) scale(0.98);
 }
 to {
 opacity: 1;
 transform: none;
 }
}

.ui-flash-stack {
 display: grid;
 gap: 10px;
 margin-bottom: 14px;
}
.ui-flash {
 display: grid;
 gap: 3px;
 padding: 13px 14px;
 border: 1px solid #fed7aa;
 border-radius: 16px;
 background: #fff7ed;
 color: #9a3412;
 font-weight: 900;
}
.ui-flash span {
 font-weight: 700;
 color: #64748b;
}
.ui-flash-success {
 border-color: #bbf7d0;
 background: #f0fdf4;
 color: #166534;
}
.ui-flash-warning {
 border-color: #fed7aa;
 background: #fff7ed;
 color: #9a3412;
}
.ui-flash-error {
 border-color: #fecaca;
 background: #fef2f2;
 color: #991b1b;
}
.ui-flash-info {
 border-color: #bfdbfe;
 background: #eff6ff;
 color: #1e3a8a;
}
.ui-flash-stack-floating {
 position: fixed;
 top: calc(var(--topbar-height, 58px) + 10px);
 left: 50%;
 z-index: 2500;
 width: min(460px, calc(100vw - 24px));
 margin: 0;
 transform: translateX(-50%);
 pointer-events: none;
 transition: opacity 0.22s ease, transform 0.22s ease;
}
.ui-flash-stack-floating .ui-flash {
 pointer-events: auto;
 padding: 10px 12px;
 border-radius: 14px;
 background: rgba(239, 246, 255, 0.97);
 box-shadow: 0 16px 44px rgba(15, 23, 42, 0.18);
 backdrop-filter: blur(14px);
 -webkit-backdrop-filter: blur(14px);
}
.ui-flash-stack-floating .ui-flash strong {
 font-size: 13px;
 line-height: 1.2;
}
.ui-flash-stack-floating .ui-flash span {
 font-size: 12px;
 line-height: 1.35;
}
.ui-flash-stack-floating.is-hiding {
 opacity: 0;
 transform: translateX(-50%) translateY(-8px);
}

.notification-head {
 position: relative;
}
.notification-read-link {
 font-size: 11px;
 font-weight: 950;
 color: #ea580c;
 text-decoration: none;
 text-transform: uppercase;
 letter-spacing: 0.03em;
}
.notification-read-link:hover {
 text-decoration: underline;
}
.notification-item strong {
 font-weight: 950;
}
.notification-item small {
 white-space: normal;
}
.notification-menu {
 max-height: min(520px, calc(100vh - 90px));
 overflow: auto;
}

@media (max-width: 760px) {
 .header-agent-cluster .notification-menu,
 .header-notifications .notification-menu,
 .notification-menu {
 position: fixed !important;
 top: calc(var(--topbar-height, 64px) + 8px) !important;
 right: 10px !important;
 left: 10px !important;
 width: auto !important;
 max-width: none !important;
 max-height: calc(100dvh - var(--topbar-height, 64px) - 18px) !important;
 border-radius: 18px !important;
 }
}

@media (max-width: 520px) {
 .instacrm-ui-body {
 padding: 10px;
 }
 .brand-mini {
 display: none;
 }
 .instacrm-error-modal {
 border-radius: 20px;
 }
 .instacrm-error-head {
 padding: 16px;
 }
 .instacrm-error-body {
 padding: 14px 16px 16px;
 }
 .instacrm-error-actions {
 display: grid;
 }
 .instacrm-error-actions .btn {
 width: 100%;
 }
}

/* Orders pagination styles */
/* =========================================================
 Sectiune 36 - ORDERS PAGINATION + DESKTOP STATUS COLORS + STICKY DAY TOTALS
 ========================================================= */

.orders-toolbar-alpha36 {
 gap: 10px !important;
}

.orders-pagination-bar {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto auto;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 padding: 12px;
 border: 1px solid rgba(226, 232, 240, 0.95);
 border-radius: 18px;
 background:
 linear-gradient(
 135deg,
 rgba(255, 247, 237, 0.96),
 rgba(255, 255, 255, 0.96) 62%
 ),
 #ffffff;
 box-shadow: 0 14px 34px rgba(15, 23, 42, 0.07);
}

.orders-pagination-info {
 min-width: 0;
 color: #475569;
 font-size: 14px;
 font-weight: 800;
 white-space: nowrap;
}

.orders-pagination-info strong {
 color: #0f172a;
}

.orders-per-page-form {
 display: flex;
 align-items: center;
 gap: 8px;
 padding: 7px 9px;
 border: 1px solid #e5e7eb;
 border-radius: 14px;
 background: #ffffff;
}

.orders-per-page-form label {
 display: flex;
 align-items: center;
 gap: 8px;
 color: #64748b;
 font-size: 12px;
 font-weight: 900;
 white-space: nowrap;
}

.orders-per-page-form select {
 width: auto;
 min-height: 34px;
 padding: 5px 32px 5px 10px;
 border-radius: 12px;
 border-color: #fed7aa;
 background: #fff7ed;
 color: #111827;
 font-weight: 950;
}

.orders-pagination-buttons,
.orders-bottom-pagination {
 display: flex;
 align-items: center;
 justify-content: flex-end;
 gap: 8px;
}

.orders-pagination-pages {
 display: flex;
 align-items: center;
 gap: 5px;
 padding: 4px;
 border: 1px solid #e5e7eb;
 border-radius: 14px;
 background: #ffffff;
}

.orders-pagination-pages a,
.orders-pagination-pages span {
 min-width: 34px;
 width: 34px;
 height: 34px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border-radius: 11px;
 color: #475569;
 font-size: 13px;
 font-weight: 950;
}

.orders-pagination-arrow {
 width: 34px;
 min-width: 34px;
 height: 34px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border: 1px solid #e5e7eb;
 border-radius: 11px;
 background: #ffffff;
 color: #475569;
 font-size: 24px;
 font-weight: 950;
 line-height: 1;
 text-decoration: none;
 box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
}

.orders-pagination-arrow:hover {
 border-color: #fed7aa;
 background: #fff7ed;
 color: #111827;
}

.orders-pagination-pages a {
 border: 1px solid transparent;
 text-decoration: none;
}

.orders-pagination-pages a:hover {
 border-color: #fed7aa;
 background: #fff7ed;
 color: #111827;
}

.orders-pagination-pages a.is-current {
 border-color: #ff7a00;
 background: linear-gradient(135deg, var(--brand), var(--brand-2));
 color: #111827;
 box-shadow: 0 8px 20px rgba(249, 115, 22, 0.18);
}

.orders-pagination-buttons .btn,
.orders-bottom-pagination .btn {
 width: auto;
 min-height: 42px;
 padding: 10px 14px;
 border-radius: 14px;
 font-size: 13px;
 font-weight: 950;
}

.orders-pagination-buttons .btn.is-disabled,
.orders-bottom-pagination .btn.is-disabled,
.orders-pagination-arrow.is-disabled {
 opacity: 0.45;
 pointer-events: none;
 filter: grayscale(0.4);
}

.orders-bottom-pagination {
 justify-content: center;
 margin-top: 12px;
 padding: 10px;
 color: #64748b;
 font-size: 13px;
 font-weight: 900;
}

/* Separator zi - desktop table */
.orders-table-alpha36 {
 border-collapse: separate;
 border-spacing: 0;
}

.orders-list-shell,
.orders-desktop-table.table-wrap,
.orders-desktop-table.card {
 overflow: visible !important;
}

.order-day-separator-row td,
.order-day-separator-cell {
 position: sticky;
 top: calc(var(--topbar-height) + 2px);
 z-index: 35;
 padding: 9px 14px !important;
 border-bottom: 1px solid #111827 !important;
 background: #374151 !important;
 color: #ffffff !important;
 font-size: 13px !important;
 font-weight: 950 !important;
 text-align: center !important;
 letter-spacing: 0.01em;
 box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18);
}

.order-day-separator-row {
 position: sticky;
 top: calc(var(--topbar-height) + 2px);
 z-index: 34;
}

/* Culori status si accent pe desktop, la fel ca pe mobile */
.orders-table-alpha36 .order-row {
 position: relative;
}

.orders-table-alpha36 .order-desktop-id-cell {
 position: relative;
 padding-left: 22px !important;
}

.order-desktop-accent {
 position: absolute;
 top: 0;
 left: 0;
 width: 5px;
 height: 100%;
 background: #cbd5e1;
}

.order-desktop-status-pill {
 display: inline-flex;
 align-items: center;
 max-width: 320px;
 overflow: hidden;
 padding: 6px 9px;
 border-radius: 11px;
 background: #f1f5f9;
 color: #334155;
 font-size: 12px;
 font-weight: 900;
 line-height: 1.1;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.orders-table-alpha36 .status-wash .order-desktop-accent {
 background: #38bdf8;
}

.orders-table-alpha36 .status-wash .order-desktop-status-pill {
 background: #e0f2fe;
 color: #075985;
}

.orders-table-alpha36 .status-delivery .order-desktop-accent {
 background: #22c55e;
}

.orders-table-alpha36 .status-delivery .order-desktop-status-pill {
 background: #dcfce7;
 color: #166534;
}

.orders-table-alpha36 .status-pickup .order-desktop-accent {
 background: #facc15;
}

.orders-table-alpha36 .status-pickup .order-desktop-status-pill {
 background: #fef9c3;
 color: #854d0e;
}

.orders-table-alpha36 .status-waiting .order-desktop-accent {
 background: #a855f7;
}

.orders-table-alpha36 .status-waiting .order-desktop-status-pill {
 background: #f3e8ff;
 color: #6b21a8;
}

.orders-table-alpha36 .status-done .order-desktop-accent {
 background: #94a3b8;
}

.orders-table-alpha36 .status-done .order-desktop-status-pill {
 background: #f1f5f9;
 color: #475569;
}

.orders-table-alpha36 .status-cancelled .order-desktop-accent {
 background: #ef4444;
}

.orders-table-alpha36 .status-cancelled .order-desktop-status-pill {
 background: #fee2e2;
 color: #991b1b;
}

.orders-table-alpha36 .status-default .order-desktop-accent {
 background: #cbd5e1;
}

.order-desktop-payment-cell {
 white-space: nowrap;
 width: 1%;
 min-width: 94px;
 text-align: right;
}

.orders-table-alpha36 th.order-desktop-payment-heading {
 width: 1%;
 min-width: 94px;
 text-align: right;
}

.order-payment-badge {
 display: inline-flex;
 align-items: center;
 justify-content: flex-start;
 gap: 6px;
 min-height: 30px;
 padding: 5px 9px 5px 6px;
 border: 1px solid rgba(148, 163, 184, 0.3);
 border-radius: 999px;
 background: #f8fafc;
 color: #475569;
 font-size: 11px;
 font-weight: 900;
 line-height: 1;
 box-shadow: 0 4px 12px rgba(15, 23, 42, 0.055);
}

.order-payment-badge-visual {
 display: inline-grid;
 place-items: center;
 width: 20px;
 height: 20px;
 flex: 0 0 20px;
 border-radius: 7px;
 background: rgba(255, 255, 255, 0.78);
}

.order-payment-badge-icon {
 width: 17px;
 height: 17px;
 display: block;
}

.order-payment-badge.is-cash {
 border-color: rgba(34, 197, 94, 0.25);
 background: linear-gradient(135deg, #ecfdf5, #dcfce7);
 color: #166534;
}

.order-payment-badge.is-card,
.order-payment-badge.is-transfer,
.order-payment-badge.is-mixed {
 border-color: rgba(59, 130, 246, 0.24);
 background: linear-gradient(135deg, #eff6ff, #dbeafe);
 color: #1d4ed8;
}

.order-payment-badge.is-partial {
 border-color: rgba(245, 158, 11, 0.27);
 background: linear-gradient(135deg, #fffbeb, #fef3c7);
 color: #92400e;
}

.order-payment-badge.is-unpaid {
 border-color: rgba(244, 63, 94, 0.22);
 background: linear-gradient(135deg, #fff1f2, #ffe4e6);
 color: #be123c;
}

.order-payment-badge.is-icon-only {
 width: 14px;
 min-height: 0;
 height: 14px;
 padding: 0;
 justify-content: center;
 gap: 0;
 border: 0;
 border-radius: 0;
 background: transparent;
 box-shadow: none;
}

.order-payment-badge.is-icon-only .order-payment-badge-visual {
 width: 14px;
 height: 14px;
 flex-basis: 14px;
 border-radius: 0;
 background: transparent;
}

.order-payment-badge.is-icon-only .order-payment-badge-icon {
 width: 14px;
 height: 14px;
 filter: drop-shadow(0 2px 3px rgba(15, 23, 42, 0.12));
}

.order-mobile-payment-state {
 display: inline-flex;
 align-items: center;
 align-self: center;
 width: 14px;
 height: 14px;
 line-height: 0;
 flex: 0 0 auto;
}

/* Separator zi - mobile compact list */
.order-day-mobile-separator {
 position: sticky !important;
 top: calc(var(--topbar-height) + 2px) !important;
 z-index: 110 !important;
 align-self: start;
 margin: 6px 0 4px;
 padding: 8px 10px;
 border-radius: 12px;
 background: #374151;
 color: #ffffff;
 box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18);
 font-size: 12px;
 font-weight: 950;
 text-align: center;
}

.order-day-mobile-separator.order-day-mobile-separator-fixed {
 position: fixed !important;
 display: none !important;
 z-index: 880 !important;
 margin: 0 !important;
 pointer-events: none !important;
 transition: transform 0.12s ease !important;
}

.order-day-mobile-separator.order-day-mobile-separator-fixed.is-active {
 display: block !important;
}

body.sidebar-open .order-day-mobile-separator.order-day-mobile-separator-fixed,
body.sidebar-open .order-day-mobile-separator {
 z-index: 1 !important;
}

.orders-list-shell,
.orders-list-shell.is-compact,
.orders-compact-list {
 overflow: visible !important;
 overflow-x: visible !important;
 overflow-y: visible !important;
 transform: none !important;
}

@media (max-width: 900px) {
 .orders-pagination-bar {
 display: grid;
 grid-template-columns: 1fr;
 gap: 8px;
 }

 .orders-pagination-info {
 text-align: center;
 white-space: normal;
 }

 .orders-per-page-form,
 .orders-per-page-form label,
 .orders-pagination-buttons {
 justify-content: center;
 }

 .orders-pagination-buttons {
 width: 100%;
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 6px;
 }

 .orders-pagination-buttons .btn {
 width: 100%;
 }

 .orders-pagination-pages {
 flex: 0 1 auto;
 justify-content: center;
 overflow: visible;
 }

 .orders-bottom-pagination {
 display: grid;
 grid-template-columns: 1fr;
 text-align: center;
 }
}

@media (max-width: 520px) {
 .orders-pagination-buttons {
 gap: 6px;
 }

 .orders-pagination-bar {
 padding: 8px;
 }

 .orders-pagination-pages {
 gap: 4px;
 padding: 3px;
 border-radius: 13px;
 }

 .orders-pagination-pages a,
 .orders-pagination-pages span,
 .orders-pagination-arrow {
 width: 32px;
 min-width: 32px;
 height: 32px;
 border-radius: 10px;
 }

 .orders-pagination-pages a,
 .orders-pagination-pages span {
 font-size: 12px;
 }

 .orders-pagination-arrow {
 font-size: 22px;
 }

 .orders-per-page-form label {
 font-size: 11px;
 }

 .order-day-mobile-separator {
 top: calc(var(--topbar-height) + 2px);
 padding: 7px 8px;
 font-size: 11px;
 border-radius: 10px;
 }
}

/* Sectiune 37 - curatare toolbar sus + filtru sticky + paginare jos */
.orders-page-alpha36 {
 position: relative;
}

.orders-list-shell {
 margin-top: 0;
}

/* Mobile order list density switch */
.orders-list-mode-bar {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 5px;
 width: 100%;
 padding: 4px;
 margin: 0 0 8px;
 border-radius: 14px;
 background: #e5e7eb;
}

.orders-list-mode-bar .orders-toggle-btn {
 min-height: 34px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 padding: 7px 9px;
 border-radius: 11px;
 text-decoration: none;
 font-size: 12px;
 font-weight: 950;
}

.orders-list-mode-bar .orders-toggle-btn.is-active {
 background: #ffffff;
 color: #ea580c;
 box-shadow: 0 7px 16px rgba(15, 23, 42, 0.1);
}

.orders-active-filter-bar {
 display: flex;
 align-items: center;
 flex-wrap: wrap;
 gap: 7px;
 width: 100%;
 margin: 0 0 8px;
 padding: 8px;
 border: 1px solid rgba(251, 146, 60, 0.3);
 border-radius: 14px;
 background: linear-gradient(90deg, rgba(255, 247, 237, 0.96), rgba(255, 255, 255, 0.92));
 box-shadow: 0 8px 22px rgba(15, 23, 42, 0.055);
}

.orders-active-filter-clear,
.orders-active-filter-chip {
 min-height: 30px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 5px;
 padding: 6px 9px;
 border-radius: 999px;
 font-size: 12px;
 font-weight: 900;
 line-height: 1;
 text-decoration: none;
}

.orders-active-filter-clear {
 background: #111827;
 color: #ffffff;
}

.orders-active-filter-chip {
 border: 1px solid rgba(251, 146, 60, 0.32);
 background: #ffffff;
 color: #334155;
}

.orders-active-filter-chip b {
 color: #ea580c;
}

@media (max-width: 900px) {
 .orders-list-mode-bar {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 5px;
 padding: 4px;
 margin-bottom: 6px;
 border-radius: 14px;
 background: #e5e7eb;
 }

 .orders-list-mode-bar .orders-toggle-btn {
 min-height: 34px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 padding: 7px 9px;
 border-radius: 11px;
 text-decoration: none;
 font-size: 12px;
 font-weight: 950;
 }

 .orders-list-mode-bar .orders-toggle-btn.is-active {
 background: #ffffff;
 color: #ea580c;
 box-shadow: 0 7px 16px rgba(15, 23, 42, 0.1);
 }

 .orders-active-filter-bar {
 gap: 5px;
 padding: 6px;
 margin-bottom: 6px;
 border-radius: 13px;
 }

 .orders-active-filter-clear,
 .orders-active-filter-chip {
 min-height: 28px;
 padding: 5px 8px;
 font-size: 11px;
 }

 .orders-list-shell .orders-compact-list,
 .orders-list-shell .orders-extended-list {
 display: none !important;
 }

 .orders-list-shell.is-compact .orders-compact-list,
 .orders-list-shell.is-extended .orders-extended-list {
 display: grid !important;
 }

 .orders-list-shell.is-compact .orders-compact-list {
 gap: 4px;
 }

 .orders-list-shell.is-extended .orders-extended-list {
 gap: 7px;
 }

 .order-compact-row {
 min-height: 44px;
 grid-template-columns: 82px minmax(0, 1.08fr) minmax(0, 1fr);
 padding: 5px 7px 5px 10px;
 }

 .order-extended-card {
 gap: 7px;
 padding: 10px 10px 10px 12px;
 border-radius: 15px;
 }

}

.orders-pagination-bottom-bar {
 margin-top: 14px;
}

@media (max-width: 900px) {
 .orders-pagination-bottom-bar {
 margin-top: 10px;
 padding: 10px;
 }
}

@media (max-width: 520px) {
}

/* Sectiune 91 - Modal generic Goic si scanner QR in pagina */
.goic-modal[hidden] {
 display: none !important;
}

.goic-modal {
 position: fixed;
 inset: 0;
 z-index: 10050;
 display: flex;
 align-items: flex-start;
 justify-content: center;
 padding: 0 14px 14px;
 background: rgba(15, 23, 42, 0.58);
 backdrop-filter: blur(12px);
 -webkit-backdrop-filter: blur(12px);
}

.goic-modal-backdrop {
 position: absolute;
 inset: 0;
 border: 0;
 padding: 0;
 background: transparent;
 cursor: pointer;
}

.goic-modal-card {
 position: relative;
 z-index: 1;
 width: min(720px, 100%);
 max-height: calc(100dvh - 14px);
 display: flex;
 flex-direction: column;
 overflow: hidden;
 background: #ffffff;
 border: 1px solid rgba(226, 232, 240, 0.95);
 border-radius: 24px;
 box-shadow: 0 28px 90px rgba(15, 23, 42, 0.35);
}

.goic-modal-head {
 min-height: 52px;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 padding: 8px 12px 8px 14px;
 border-bottom: 1px solid #e5e7eb;
 background: linear-gradient(135deg, #fff7ed 0%, #ffffff 68%);
}

.goic-modal-head strong,
.goic-modal-head small {
 display: block;
}

.goic-modal-head strong {
 color: #111827;
 font-size: 18px;
 font-weight: 950;
}

.goic-modal-head small {
 margin-top: 2px;
 color: #64748b;
 font-size: 12px;
 font-weight: 750;
}

.scanner-modal-title {
 display: flex;
 align-items: center;
 gap: 12px;
 flex: 1 1 auto;
 min-width: 0;
}

.scanner-modal-title > strong {
 flex: 0 0 auto;
}

.goic-modal-head .scanner-modal-mode-bar {
 width: min(310px, 48vw);
 flex: 0 1 310px;
 margin: 0 auto;
}

.goic-modal-head .scanner-modal-mode-bar .orders-toggle-btn {
 appearance: none;
 border: 0;
 cursor: pointer;
}

.goic-modal-head .scanner-modal-mode-bar .orders-toggle-btn {
 min-height: 32px;
 padding: 6px 10px;
 font-size: 12px;
}

.goic-modal-fallback {
 margin-left: auto;
 color: #166534;
 font-size: 12px;
 font-weight: 950;
 text-decoration: none;
 white-space: nowrap;
}

.goic-modal-close {
 width: 44px;
 height: 44px;
 flex: 0 0 44px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border: 1px solid #dbe3ee;
 border-radius: 999px;
 background: #ffffff;
 color: #0f172a;
 font-size: 30px;
 line-height: 1;
 font-weight: 850;
 cursor: pointer;
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
}

.goic-modal-body {
 min-height: 0;
 overflow: auto;
}

.goic-modal-card-scanner {
 width: min(540px, 100%);
 margin-top: 0;
}

.goic-modal-iframe-body {
 height: calc(100dvh - 68px);
 min-height: 520px;
 padding: 0;
 background: #f8fafc;
}

.goic-modal-iframe-body iframe {
 width: 100%;
 height: 100%;
 display: block;
 border: 0;
 background: #f8fafc;
}

.scanner-page-embedded {
 min-height: 100%;
 background: #f8fafc !important;
}

.scanner-page-embedded .scanner-shell,
.scanner-page-embedded .scanner-shell-pro {
 width: 100% !important;
 min-height: 100vh;
 padding: 6px 8px 8px !important;
}

.scanner-page-embedded .scanner-topbar {
 display: none !important;
}

.scanner-page-embedded .scanner-manual,
.scanner-page-embedded .scanner-card-head {
 display: none !important;
}

.scanner-page-embedded .scanner-card,
.scanner-page-embedded .scanner-card-pro {
 border-radius: 20px !important;
 box-shadow: none !important;
 gap: 8px !important;
 padding: 8px !important;
}

.scanner-page-embedded .scanner-status {
 padding: 8px 10px !important;
 border-radius: 12px !important;
 font-size: 12px !important;
}

.scanner-page-embedded .scanner-controls {
 gap: 6px !important;
}

.scanner-page-embedded .scanner-control-btn,
.scanner-page-embedded .scanner-zoom-wrap {
 min-height: 36px !important;
 height: 36px !important;
 border-radius: 12px !important;
}

.scanner-page-embedded .scanner-camera-row select {
 min-height: 38px !important;
 border-radius: 12px !important;
}

@media (max-width: 760px) {
 .goic-modal {
 padding: 0 6px 6px;
 }

 .goic-modal-card {
 max-height: calc(100dvh - 6px);
 border-radius: 20px;
 }

 .goic-modal-card-scanner {
 height: calc(100dvh - 6px);
 }

 .goic-modal-head {
 min-height: 50px;
 padding: 6px 8px 6px 12px;
 }

 .goic-modal-head strong {
 font-size: 16px;
 }

 .scanner-modal-title {
 gap: 8px;
 }

 .goic-modal-head .scanner-modal-mode-bar {
 width: auto;
 max-width: 230px;
 flex: 1 1 auto;
 margin: 0;
 }

 .goic-modal-head .scanner-modal-mode-bar .orders-toggle-btn {
 min-height: 30px;
 padding: 5px 6px;
 font-size: 11px;
 }

 .goic-modal-fallback {
 display: none;
 }

 .goic-modal-close {
 width: 42px;
 height: 42px;
 flex-basis: 42px;
 }

 .goic-modal-iframe-body {
 height: 100%;
 min-height: 0;
 }
}

/* Account preference: order list animation */
.account-toggle-row {
 position: relative;
 display: grid !important;
 grid-template-columns: auto minmax(0, 1fr);
 align-items: center;
 gap: 12px !important;
 padding: 12px;
 border: 1px solid rgba(226, 232, 240, 0.95);
 border-radius: 16px;
 background: linear-gradient(135deg, rgba(255, 247, 237, 0.88), #ffffff);
 box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
}

.account-toggle-row input {
 position: absolute;
 opacity: 0;
 pointer-events: none;
}

.account-toggle-row strong,
.account-toggle-row small {
 display: block;
}

.account-toggle-row small {
 margin-top: 2px;
 color: #64748b;
 font-size: 13px;
 line-height: 1.25;
}

.account-toggle-ui {
 position: relative;
 width: 52px;
 height: 30px;
 border-radius: 999px;
 background: #e5e7eb;
 border: 1px solid rgba(203, 213, 225, 0.95);
 box-shadow: inset 0 2px 8px rgba(15, 23, 42, 0.12);
 transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.account-toggle-ui::after {
 content: "";
 position: absolute;
 top: 3px;
 left: 3px;
 width: 22px;
 height: 22px;
 border-radius: 999px;
 background: #ffffff;
 box-shadow: 0 5px 12px rgba(15, 23, 42, 0.22);
 transition: transform 0.18s ease;
}

.account-toggle-row input:checked + .account-toggle-ui {
 background: linear-gradient(135deg, #ff8a00, #ffbf00);
 border-color: rgba(249, 115, 22, 0.7);
 box-shadow: 0 8px 20px rgba(249, 115, 22, 0.22);
}

.account-toggle-row input:checked + .account-toggle-ui::after {
 transform: translateX(22px);
}

/* Adrese logistice: implicit aceeasi strada pentru ridicare si livrare */
.logistics-address-toggle {
 width: 100%;
 min-width: 0;
 color: #0f172a;
 font: inherit;
 text-align: left;
 cursor: pointer;
}

.logistics-address-toggle > span:last-child {
 min-width: 0;
}

.logistics-address-toggle.is-on .account-toggle-ui {
 background: linear-gradient(135deg, #ff8a00, #ffbf00);
 border-color: rgba(249, 115, 22, 0.7);
 box-shadow: 0 8px 20px rgba(249, 115, 22, 0.22);
}

.logistics-address-toggle.is-on .account-toggle-ui::after {
 transform: translateX(22px);
}

[data-logistics-address-field][hidden] {
 display: none !important;
}

/* Account preference: mobile order list text size */
.account-size-row {
 display: grid !important;
 gap: 10px !important;
 padding: 12px;
 border: 1px solid rgba(226, 232, 240, 0.95);
 border-radius: 16px;
 background: #ffffff;
 box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
}

.account-size-head strong,
.account-size-head small {
 display: block;
}

.account-size-head small {
 margin-top: 2px;
 color: #64748b;
 font-size: 13px;
 line-height: 1.25;
}

.account-size-options {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 6px;
 padding: 4px;
 border-radius: 14px;
 background: #f1f5f9;
}

.account-size-option {
 position: relative;
 display: block !important;
 min-width: 0;
}

.account-size-option input {
 position: absolute;
 opacity: 0;
 pointer-events: none;
}

.account-size-option span {
 display: flex;
 align-items: center;
 justify-content: center;
 min-height: 36px;
 padding: 8px 10px;
 border-radius: 11px;
 color: #475569;
 font-size: 13px;
 font-weight: 900;
 line-height: 1;
 text-align: center;
 transition: background 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.account-size-option input:checked + span {
 background: linear-gradient(135deg, #ff8a00, #ffbf00);
 color: #0f172a;
 box-shadow: 0 8px 18px rgba(249, 115, 22, 0.24);
}

.user-dropdown .account-size-row {
 margin: 8px 0;
}

.user-dropdown .account-size-head small {
 display: none;
}

.user-dropdown .account-size-options {
 gap: 8px;
}

.user-dropdown button.account-size-option {
 appearance: none;
 border: 0;
 padding: 0;
 background: transparent;
 cursor: pointer;
}

.user-dropdown button.account-size-option.is-active span {
 background: linear-gradient(135deg, #ff8a00, #ffbf00);
 color: #0f172a;
 box-shadow: 0 8px 18px rgba(249, 115, 22, 0.24);
}

.user-dropdown button.account-size-option.is-saving,
.user-dropdown .user-dropdown-account-toggle.is-saving {
 opacity: 0.72;
 pointer-events: none;
}

.user-dropdown .user-dropdown-account-toggle {
 width: 100%;
 margin: 8px 0 10px;
 text-align: left;
 cursor: pointer;
}

.user-dropdown .user-dropdown-account-toggle.is-on .account-toggle-ui {
 background: linear-gradient(135deg, #ff8a00, #ffbf00);
 border-color: rgba(249, 115, 22, 0.7);
 box-shadow: 0 8px 20px rgba(249, 115, 22, 0.22);
}

.user-dropdown .user-dropdown-account-toggle.is-on .account-toggle-ui::after {
 transform: translateX(22px);
}

@keyframes ordersListCascadeIn {
 from {
 opacity: 0;
 transform: translateY(11px) scale(0.992);
 filter: saturate(0.92);
 }

 to {
 opacity: 1;
 transform: none;
 filter: saturate(1);
 }
}

@media (prefers-reduced-motion: no-preference) {
 .orders-list-shell.orders-list-animate .order-compact-row,
 .orders-list-shell.orders-list-animate .order-extended-card {
 animation: ordersListCascadeIn 0.24s cubic-bezier(0.2, 0.8, 0.2, 1) both;
 animation-delay: var(--order-anim-delay, 0ms);
 will-change: opacity;
 }

 .orders-list-shell.orders-list-animate .orders-table-alpha36 .order-row > td {
 animation: ordersListCascadeIn 0.22s cubic-bezier(0.2, 0.8, 0.2, 1) both;
 animation-delay: var(--order-anim-delay, 0ms);
 will-change: opacity;
 }
}

@keyframes orderViewCardCascadeIn {
 from {
 opacity: 0;
 transform: translateY(16px) scale(0.986);
 filter: saturate(0.92);
 }

 72% {
 opacity: 1;
 transform: translateY(-1px) scale(1.002);
 filter: saturate(1.02);
 }

 to {
 opacity: 1;
 transform: none;
 filter: saturate(1);
 }
}

@media (prefers-reduced-motion: no-preference) {
 .layout-order.order-view-animate .order-hero-card,
 .layout-order.order-view-animate .command-status-panel,
 .layout-order.order-view-animate .command-progress-panel,
 .layout-order.order-view-animate .command-estimate-panel,
 .layout-order.order-view-animate .command-client-panel,
 .layout-order.order-view-animate .command-money-panel,
 .layout-order.order-view-animate .command-notes-panel,
 .layout-order.order-view-animate .command-map-panel,
 .layout-order.order-view-animate .previous-orders-card,
 .layout-order.order-view-animate .order-products-card,
 .layout-order.order-view-animate .order-history-card,
 .layout-order.order-view-animate .status-panel {
 opacity: 1;
 animation: orderViewCardCascadeIn 0.34s cubic-bezier(0.2, 0.82, 0.2, 1) both;
 animation-delay: var(--order-view-anim-delay, 0ms);
 will-change: opacity;
 }

 .layout-order.order-view-animate .order-hero-card {
 --order-view-anim-delay: 0ms;
 }

 .layout-order.order-view-animate .command-status-panel {
 --order-view-anim-delay: 55ms;
 }

 .layout-order.order-view-animate .command-progress-panel {
 --order-view-anim-delay: 80ms;
 }

 .layout-order.order-view-animate .command-estimate-panel {
 --order-view-anim-delay: 105ms;
 }

 .layout-order.order-view-animate .command-client-panel {
 --order-view-anim-delay: 130ms;
 }

 .layout-order.order-view-animate .command-money-panel {
 --order-view-anim-delay: 155ms;
 }

 .layout-order.order-view-animate .command-notes-panel {
 --order-view-anim-delay: 180ms;
 }

 .layout-order.order-view-animate .command-map-panel {
 --order-view-anim-delay: 205ms;
 }

 .layout-order.order-view-animate .previous-orders-card {
 --order-view-anim-delay: 205ms;
 }

 .layout-order.order-view-animate .order-products-card {
 --order-view-anim-delay: 230ms;
 }

 .layout-order.order-view-animate .order-history-card {
 --order-view-anim-delay: 255ms;
 }

 .layout-order.order-view-animate .status-panel {
 --order-view-anim-delay: 280ms;
 }
}

/* Sectiune 62 - lizibilitate nume clienti si localitati */
.order-compact-client strong,
.order-extended-client strong,
.orders-table-alpha36 tbody .order-row td:nth-child(2) > strong,
.order-hero-card .order-identity h2,
.command-client-panel > div:first-child strong,
.previous-order-compact-row .order-compact-client strong,
.route-stop-client b,
.route-stop-client a,
.route-stop-head strong,
.route-candidate-main strong,
.driver-stop-card h3,
.label-client-name,
.customer-box,
.whatsapp-webhook-order-link,
.whatsapp-webhook-missing-client {
 text-transform: uppercase;
}

.order-compact-client span,
.order-extended-client span,
.orders-table-alpha36 tbody .order-row td:nth-child(2) .tiny-text,
.label-city,
.label-bottom-locality,
.route-stop-main > p,
.route-candidate-main span,
.route-stop-meta,
.command-client-panel .command-wide strong {
 text-transform: uppercase;
}

body.user-motion-off,
body.user-motion-off *,
body.user-motion-off *::before,
body.user-motion-off *::after {
 scroll-behavior: auto !important;
 animation: none !important;
 transition: none !important;
}

body.user-motion-off .sidebar,
body.user-motion-off .sidebar-backdrop,
body.user-motion-off .nav .collapse,
body.user-motion-off .nav-caret {
 transform-origin: center !important;
}

body.header-dropdown-open::before {
 content: "";
 position: fixed;
 inset: var(--topbar-height, 76px) 0 0 0;
 z-index: 1190;
 background: rgba(15, 23, 42, 0.18);
 backdrop-filter: blur(7px);
 -webkit-backdrop-filter: blur(7px);
 pointer-events: auto;
}

body.header-dropdown-open .topbar.alpha31-topbar-fixed,
body.header-dropdown-open .alpha31-topbar-fixed {
 z-index: 1200 !important;
}

body.header-dropdown-open .header-notifications,
body.header-dropdown-open .header-user-menu {
 z-index: 1510 !important;
}

body.header-dropdown-open .notification-menu,
body.header-dropdown-open .user-dropdown {
 z-index: 1515 !important;
}

.order-danger-zone {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 18px;
 grid-column: 1;
 width: 100%;
 max-width: 100%;
 border: 1px solid #fecaca !important;
 background: linear-gradient(90deg, rgba(254, 242, 242, 0.96), rgba(255, 255, 255, 0.98)) !important;
}

/* Outside the two-column order grid: it remains the final page action. */
.order-danger-zone--page-bottom {
 margin-top: 16px;
}

.order-danger-zone h3 {
 margin: 4px 0 6px;
 color: #991b1b;
}

.order-danger-zone p {
 margin: 0;
 color: #64748b;
 font-weight: 750;
}

.order-danger-kicker {
 display: inline-flex;
 align-items: center;
 width: max-content;
 padding: 5px 9px;
 border-radius: 999px;
 background: #fee2e2;
 color: #991b1b;
 font-size: 11px;
 font-weight: 950;
 text-transform: uppercase;
}

.order-delete-open-btn {
 flex: 0 0 auto;
}

.order-delete-modal {
 position: fixed;
 inset: 0;
 z-index: 2300;
 display: flex;
 align-items: flex-start;
 justify-content: center;
 padding: calc(var(--topbar-height, 76px) + 20px) 16px 18px;
}

.order-delete-modal[hidden] {
 display: none !important;
}

.order-delete-backdrop {
 position: absolute;
 inset: 0;
 border: 0;
 background: rgba(15, 23, 42, 0.46);
 backdrop-filter: blur(8px);
 -webkit-backdrop-filter: blur(8px);
 cursor: pointer;
}

.order-delete-card {
 position: relative;
 width: min(560px, 100%);
 max-height: calc(100dvh - var(--topbar-height, 76px) - 38px);
 overflow: auto;
 border: 1px solid rgba(254, 202, 202, 0.9);
 border-radius: 24px;
 background: #ffffff;
 box-shadow: 0 30px 80px rgba(15, 23, 42, 0.32);
 padding: 28px;
}

.order-delete-close {
 position: absolute;
 top: 14px;
 right: 14px;
 width: 38px;
 height: 38px;
 border: 0;
 border-radius: 50%;
 background: #f8fafc;
 color: #0f172a;
 font-size: 20px;
 font-weight: 950;
 cursor: pointer;
}

.order-delete-icon {
 width: 58px;
 height: 58px;
 border-radius: 18px;
 display: grid;
 place-items: center;
 background: linear-gradient(135deg, #ef4444, #fb7185);
 color: #ffffff;
 font-size: 34px;
 font-weight: 950;
 box-shadow: 0 18px 32px rgba(239, 68, 68, 0.28);
}

.order-delete-copy {
 margin-top: 18px;
}

.order-delete-copy span {
 color: #b91c1c;
 font-size: 12px;
 font-weight: 950;
 text-transform: uppercase;
}

.order-delete-copy h3 {
 margin: 8px 0;
 font-size: clamp(24px, 3vw, 34px);
 color: #0f172a;
}

.order-delete-copy p {
 margin: 0 0 18px;
 color: #64748b;
 font-weight: 760;
 line-height: 1.45;
}

.order-delete-form label {
 display: grid;
 gap: 8px;
 color: #64748b;
 font-weight: 850;
}

.order-delete-form label strong {
 display: inline-flex;
 width: max-content;
 max-width: 100%;
 padding: 7px 10px;
 border-radius: 10px;
 background: #fee2e2;
 color: #991b1b;
 font-weight: 950;
}

.order-delete-form .input {
 border-color: #fecaca;
}

.order-delete-actions {
 display: flex;
 justify-content: flex-end;
 gap: 10px;
 margin-top: 18px;
}

.order-delete-actions .btn[disabled] {
 opacity: 0.45;
 cursor: not-allowed;
}

.route-complete-incident-card {
 border-color: rgba(248, 113, 113, .92);
 box-shadow: 0 30px 90px rgba(127, 29, 29, .34);
}

.route-complete-incident-icon {
 background: linear-gradient(135deg, #dc2626, #f97316);
 box-shadow: 0 18px 34px rgba(220, 38, 38, .30);
}

.route-complete-incident-warning {
 margin: 0 0 18px;
 padding: 12px 14px;
 border: 1px solid #fdba74;
 border-radius: 14px;
 background: #fff7ed;
 color: #9a3412;
 font-size: 13px;
 font-weight: 850;
 line-height: 1.45;
}

.route-complete-incident-form label strong {
 letter-spacing: .08em;
}

.route-proposal-incident-chip {
 display: inline-flex;
 align-items: center;
 width: max-content;
 max-width: 100%;
 gap: 7px;
 padding: 7px 10px;
 border: 1px solid #fca5a5;
 border-radius: 999px;
 background: #fef2f2;
 color: #b91c1c;
 font-size: 11px;
 font-weight: 950;
 text-transform: uppercase;
}

.route-proposal-incident-chip span {
 display: inline-grid;
 place-items: center;
 width: 19px;
 height: 19px;
 border-radius: 50%;
 background: #dc2626;
 color: #fff;
 font-size: 12px;
 line-height: 1;
}

.route-proposal-card.has-driver-incident {
 border-color: #fca5a5;
 background:
 radial-gradient(circle at top right, rgba(239, 68, 68, .12), transparent 34%),
 #fff;
}

@media (max-width: 700px) {
 .order-danger-zone {
  display: grid;
  order: 99;
  grid-column: 1 / -1;
 }

 .order-delete-open-btn,
 .order-delete-actions .btn {
 width: 100%;
 }

 .order-delete-actions {
 display: grid;
 }

 .order-delete-card {
 padding: 22px;
 border-radius: 22px;
 }
}

.navigation-loader[hidden] {
 display: none !important;
}

.navigation-loader {
 position: fixed;
 inset: 0;
 z-index: 12000;
 display: flex;
 align-items: flex-start;
 justify-content: center;
 padding: calc(var(--topbar-height, 76px) + 16px) 16px 16px;
 background: rgba(248, 250, 252, 0.58);
 backdrop-filter: none;
 -webkit-backdrop-filter: none;
 pointer-events: auto;
}

body.user-motion-off .navigation-loader {
 display: none !important;
}

.navigation-loader-card {
 width: min(520px, 100%);
 border: 1px solid rgba(226, 232, 240, 0.92);
 border-radius: 24px;
 background: rgba(255, 255, 255, 0.94);
 box-shadow: 0 24px 70px rgba(15, 23, 42, 0.2);
 padding: 18px;
 overflow: hidden;
 animation: none;
}

.navigation-loader-head {
 display: flex;
 align-items: center;
 gap: 12px;
 margin-bottom: 14px;
}

.navigation-loader-icon {
 width: 46px;
 height: 46px;
 border-radius: 16px;
 display: grid;
 place-items: center;
 background: linear-gradient(135deg, #ff8a00, #ffc400);
 color: #0f172a;
 font-size: 24px;
 font-weight: 950;
 box-shadow: 0 14px 28px rgba(249, 115, 22, 0.22);
}

.navigation-loader-icon::before {
 content: "\2726";
}

.navigation-loader[data-loading-kind="order"] .navigation-loader-icon::before {
 content: "\1F4CB";
}

.navigation-loader[data-loading-kind="orders"] .navigation-loader-icon::before {
 content: "\2630";
}

.navigation-loader[data-loading-kind="dashboard"] .navigation-loader-icon::before {
 content: "\1F4CA";
}

.navigation-loader-head strong {
 display: block;
 color: #0f172a;
 font-size: 20px;
 line-height: 1.1;
 font-weight: 950;
}

.navigation-loader-head small {
 display: block;
 margin-top: 3px;
 color: #64748b;
 font-size: 13px;
 font-weight: 760;
}

.navigation-loader-skeleton {
 display: none;
 gap: 8px;
}

.navigation-loader[data-loading-kind="order"] [data-navigation-loader-panel="order"],
.navigation-loader[data-loading-kind="orders"] [data-navigation-loader-panel="orders"],
.navigation-loader[data-loading-kind="dashboard"] [data-navigation-loader-panel="dashboard"] {
 display: grid;
}

.nav-skeleton-line,
.nav-skeleton-pill,
.nav-skeleton-circle,
.nav-skeleton-label,
.nav-skeleton-track,
.nav-skeleton-row,
.navigation-loader-skeleton > span,
.navigation-order-ghost-actions span,
.nav-skeleton-grid span {
 position: relative;
 overflow: hidden;
 display: block;
 border-radius: 999px;
 background: #e2e8f0;
}

.nav-skeleton-line {
 height: 18px;
 width: 70%;
}

.nav-skeleton-line.wide {
 width: 100%;
}

.nav-skeleton-pill {
 width: 84px;
 height: 28px;
}

.nav-skeleton-pill.short {
 width: 76px;
 height: 30px;
 background: rgba(255, 255, 255, 0.86);
}

.nav-skeleton-pill.tiny {
 width: 62px;
 height: 24px;
 background: rgba(148, 163, 184, 0.28);
}

.navigation-order-ghost-hero {
 position: relative;
 display: grid;
 gap: 12px;
 min-height: 164px;
 padding: 18px;
 border-radius: 22px;
 background: linear-gradient(135deg, #0f172a 0%, #111827 100%);
 box-shadow: 0 18px 40px rgba(15, 23, 42, 0.24);
}

.navigation-order-ghost-id,
.navigation-order-ghost-actions {
 display: flex;
 align-items: center;
 gap: 8px;
}

.navigation-order-ghost-actions {
 position: absolute;
 top: 16px;
 right: 16px;
}

.navigation-order-ghost-actions span {
 width: 50px;
 height: 46px;
 border-radius: 14px;
 background: rgba(255, 255, 255, 0.9);
}

.navigation-order-ghost-hero .nav-skeleton-line.client {
 width: min(62%, 310px);
 height: 28px;
 margin-top: 18px;
 background: rgba(255, 255, 255, 0.8);
}

.navigation-order-ghost-hero .nav-skeleton-line.phone {
 width: 150px;
 height: 26px;
 background: rgba(255, 255, 255, 0.28);
}

.navigation-order-ghost-grid {
 display: grid;
 grid-template-columns: 1.05fr 1fr;
 gap: 10px;
}

.navigation-order-ghost-panel {
 display: grid;
 gap: 8px;
 min-height: 108px;
 padding: 14px;
 border: 1px solid rgba(226, 232, 240, 0.9);
 border-radius: 18px;
 background: #ffffff;
}

.navigation-order-ghost-panel.status {
 background: linear-gradient(135deg, #ecfeff, #ffffff);
 border-color: rgba(125, 211, 252, 0.5);
}

.navigation-order-ghost-panel.money {
 background: linear-gradient(135deg, #fff7ed, #ffffff);
 border-color: rgba(251, 146, 60, 0.45);
}

.navigation-order-ghost-panel.progress {
 background: linear-gradient(135deg, #f8fafc, #ffffff);
}

.nav-skeleton-circle {
 width: 42px;
 height: 42px;
 border-radius: 14px;
 background: #e0f2fe;
}

.nav-skeleton-label {
 width: 82px;
 height: 12px;
 background: #cbd5e1;
}

.nav-skeleton-track {
 width: 100%;
 height: 10px;
 background: #e2e8f0;
}

.nav-skeleton-track.accent {
 background: linear-gradient(90deg, #f97316 0 58%, #e2e8f0 58% 100%);
}

.nav-skeleton-line.price {
 width: 118px;
 height: 28px;
}

.navigation-order-ghost-section {
 display: grid;
 gap: 8px;
 padding: 14px;
 border: 1px solid rgba(226, 232, 240, 0.88);
 border-radius: 18px;
 background: #ffffff;
}

.nav-skeleton-line.title {
 width: 160px;
 height: 18px;
}

.nav-skeleton-row {
 width: 100%;
 height: 38px;
 border-radius: 12px;
 background: #f1f5f9;
}

.navigation-loader-skeleton-list > span {
 height: 42px;
 border-radius: 14px;
}

.nav-skeleton-grid {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 8px;
}

.navigation-loader-skeleton-dashboard .nav-skeleton-grid {
 grid-template-columns: repeat(4, 1fr);
}

.nav-skeleton-grid span {
 height: 58px;
 border-radius: 16px;
}

.nav-skeleton-line::after,
.nav-skeleton-pill::after,
.nav-skeleton-circle::after,
.nav-skeleton-label::after,
.nav-skeleton-track::after,
.nav-skeleton-row::after,
.navigation-loader-skeleton > span::after,
.navigation-order-ghost-actions span::after,
.nav-skeleton-grid span::after {
 content: "";
 position: absolute;
 inset: 0;
 transform: translateX(-100%);
 background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.72), transparent);
 animation: navigationSkeletonSweep 1.05s ease-in-out infinite;
}

@keyframes navigationLoaderIn {
 from {
 opacity: 0;
 transform: translateY(10px) scale(0.98);
 }
 to {
 opacity: 1;
 transform: translateY(0) scale(1);
 }
}

@keyframes navigationSkeletonSweep {
 to {
 transform: translateX(100%);
 }
}

@media (max-width: 520px) {
 .navigation-loader {
 padding: calc(var(--topbar-height, 76px) + 10px) 10px 10px;
 }

 .navigation-loader-card {
 border-radius: 22px;
 padding: 14px;
 }

 .navigation-loader[data-loading-kind="order"] .navigation-loader-card {
 max-height: calc(100dvh - var(--topbar-height, 76px) - 22px);
 overflow: hidden;
 }

 .navigation-order-ghost-hero {
 min-height: 154px;
 padding: 14px;
 border-radius: 20px;
 }

 .navigation-order-ghost-actions {
 right: 12px;
 top: 12px;
 gap: 6px;
 }

 .navigation-order-ghost-actions span {
 width: 42px;
 height: 40px;
 border-radius: 12px;
 }

 .navigation-order-ghost-hero .nav-skeleton-line.client {
 width: 58%;
 height: 24px;
 margin-top: 22px;
 }

 .navigation-order-ghost-hero .nav-skeleton-line.phone {
 width: 132px;
 height: 24px;
 }

 .navigation-order-ghost-grid {
 grid-template-columns: 1fr;
 gap: 8px;
 }

 .navigation-order-ghost-panel {
 min-height: 82px;
 padding: 12px;
 border-radius: 16px;
 }

 .navigation-order-ghost-panel.client {
 display: none;
 }

 .navigation-order-ghost-section {
 display: none;
 }

 .navigation-loader-head strong {
 font-size: 18px;
 }

 .navigation-loader-head small {
 font-size: 12px;
 }
}

.whatsapp-webhook-row {
 transition:
  opacity 0.18s ease,
  transform 0.18s ease,
  max-height 0.22s ease,
  margin 0.22s ease,
  padding 0.22s ease,
  border-color 0.18s ease,
  background 0.18s ease;
}

.whatsapp-webhook-row.is-done {
 opacity: 0.78;
}

.whatsapp-webhook-row.is-removing {
 max-height: 0;
 margin-top: 0;
 margin-bottom: 0;
 padding-top: 0;
 padding-bottom: 0;
 overflow: hidden;
 opacity: 0;
 transform: translateX(12px);
 pointer-events: none;
}

.whatsapp-webhook-actions button:disabled {
 opacity: 0.65;
 cursor: wait;
}

/* Desktop header actions: text + icon | icon + text. */
.header-action-label {
 display: none;
}

.header-action-icon {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 flex: 0 0 auto;
 line-height: 1;
}

@media (min-width: 901px) {
 .header-action-label {
 display: inline-flex !important;
 align-items: center;
 color: #334155;
 font-size: 12px !important;
 line-height: 1;
 font-weight: 900;
 white-space: nowrap;
 }

 .alpha31-topbar-fixed .header-action-cluster > .header-icon-btn,
 .alpha31-topbar-fixed .header-action-cluster > .header-smart-search > .header-icon-btn {
 width: auto !important;
 min-width: 42px !important;
 flex: 0 0 auto !important;
 gap: 7px !important;
 padding: 0 12px !important;
 }

 .header-action-cluster .header-smart-search {
 width: auto !important;
 }

 .header-action-cluster .header-smart-search > .header-icon-btn {
 display: inline-flex !important;
 }

 .header-agent-cluster .notification-toggle {
 width: auto !important;
 min-width: 42px !important;
 flex: 0 0 auto !important;
 gap: 7px !important;
 padding: 0 12px !important;
 font-size: inherit !important;
 }

 .header-agent-cluster .userbox-button {
 width: auto !important;
 gap: 7px !important;
 padding: 0 12px 0 8px !important;
 }

 .header-agent-cluster .userbox.header-user-menu .avatar {
 width: 32px !important;
 height: 32px !important;
 min-width: 32px !important;
 flex-basis: 32px !important;
 border-radius: 10px !important;
 background: #fff7ed !important;
 }

 .header-agent-cluster .notification-icon,
 .header-action-icon {
 font-size: 18px !important;
 }
}

/* Interactive office route planner. */
.routes-office-page {
 position: relative;
}

.routes-office-page.is-routes-loading::after {
 content: "Se actualizeaza traseele...";
 position: fixed;
 z-index: 9999;
 right: 18px;
 bottom: 18px;
 padding: 10px 14px;
 border-radius: 999px;
 background: #0f172a;
 color: #fff;
 font-size: 13px;
 font-weight: 900;
 box-shadow: 0 14px 36px rgba(15, 23, 42, .24);
}

.route-bulk-add-form {
 display: grid;
 gap: 8px;
}

.route-bulk-toolbar {
 position: sticky;
 top: 72px;
 z-index: 8;
 display: flex;
 align-items: center;
 gap: 12px;
 padding: 10px 12px;
 border: 1px solid #fed7aa;
 border-radius: 14px;
 background: rgba(255, 247, 237, .96);
 box-shadow: 0 8px 22px rgba(154, 52, 18, .08);
 backdrop-filter: blur(10px);
}

.route-bulk-toolbar label {
 display: inline-flex;
 align-items: center;
 gap: 7px;
 font-weight: 900;
}

.route-bulk-toolbar [data-route-selected-count] {
 color: #64748b;
 font-size: 13px;
 font-weight: 850;
}

.route-bulk-toolbar .btn {
 margin-left: auto;
}

.route-bulk-add-form .route-candidate-row {
 grid-template-columns: auto minmax(0, 1fr) auto;
}

.route-candidate-check {
 display: grid;
 place-items: center;
 width: 36px;
 min-height: 48px;
 cursor: pointer;
}

.route-candidate-check input,
.route-bulk-toolbar input {
 width: 20px;
 height: 20px;
 accent-color: #f97316;
}

.route-candidate-assigned {
 display: inline-flex;
 padding: 3px 7px;
 border-radius: 999px;
 background: #e2e8f0;
 color: #334155;
 font-size: 11px;
}

[data-route-sort-form].is-saving .route-control-strip button[type="submit"] {
 opacity: .68;
 cursor: wait;
}

[data-route-sort-form].is-saved .route-control-strip button[type="submit"] {
 border-color: #86efac;
 background: #f0fdf4;
 color: #166534;
}

@media (max-width: 980px) {
 .route-bulk-toolbar {
 top: 58px;
 flex-wrap: wrap;
 }

 .route-bulk-toolbar .btn {
 width: 100%;
 margin-left: 0;
 }

 .route-bulk-add-form .route-candidate-row {
 grid-template-columns: auto minmax(0, 1fr);
 }

 .route-bulk-add-form .route-candidate-actions {
 grid-column: 2;
 justify-content: flex-start;
 }
}

.route-driver-select-form {
 min-width: 0;
}

.route-driver-select-form select {
 width: 100%;
 min-height: 36px;
 border: 1px solid #cbd5e1;
 border-radius: 10px;
 background: #fff;
 color: #0f172a;
 padding: 6px 30px 6px 9px;
 font-size: 13px;
 font-weight: 900;
}

.route-driver-select-form.is-saving select {
 opacity: .65;
 cursor: wait;
}

/* Order-like rows used when assigning orders to an office route. */
.route-candidate-order-row {
 position: relative;
 display: grid;
 grid-template-columns: 38px 86px minmax(150px, .85fr) minmax(210px, 1.25fr) minmax(160px, .75fr) auto;
 align-items: center;
 gap: 7px 10px;
 min-height: 62px;
 padding: 7px 9px 7px 11px;
 border: 1px solid rgba(226, 232, 240, .95);
 border-radius: 12px;
 background: #fff;
 box-shadow: 0 4px 12px rgba(15, 23, 42, .035);
 overflow: hidden;
 transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease, background .14s ease;
}

.route-candidate-order-row:hover {
 transform: scale(.997);
 border-color: rgba(249, 115, 22, .45);
 box-shadow: 0 8px 20px rgba(249, 115, 22, .08);
}

.route-candidate-order-row.is-suggested {
 border-color: #fed7aa;
 background: linear-gradient(90deg, rgba(255, 247, 237, .8), #fff 32%);
}

.route-candidate-order-row.is-assigned-draft {
 border-color: #bfdbfe;
 background: linear-gradient(90deg, rgba(219, 234, 254, .68), #fff 34%);
}

.route-candidate-order-row:has([data-route-order-check]:checked) {
 border-color: #f97316;
 background: #fff7ed;
 box-shadow: 0 0 0 3px rgba(249, 115, 22, .13);
}

.route-candidate-order-accent {
 position: absolute;
 inset: 0 auto 0 0;
 width: 4px;
}

.route-candidate-order-row .route-candidate-check {
 width: 34px;
 min-height: 44px;
}

.route-candidate-order-id {
 display: flex;
 align-items: center;
 gap: 4px;
 min-width: 0;
 color: #0f172a;
 font-size: 12px;
 font-weight: 900;
 text-decoration: none;
 white-space: nowrap;
}

.route-candidate-order-client,
.route-candidate-order-route {
 display: grid;
 gap: 2px;
 min-width: 0;
 color: #0f172a;
 text-decoration: none;
}

.route-candidate-order-client strong,
.route-candidate-order-route strong {
 overflow: hidden;
 color: #0f172a;
 font-size: 13px;
 font-weight: 900;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.route-candidate-order-client span,
.route-candidate-order-route span {
 overflow: hidden;
 color: #64748b;
 font-size: 11px;
 font-weight: 750;
 line-height: 1.25;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.route-candidate-order-summary {
 display: grid;
 justify-items: start;
 gap: 4px;
 min-width: 0;
}

.route-candidate-order-summary .order-compact-status {
 max-width: 100%;
 overflow: hidden;
 font-size: 11px;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.route-candidate-order-total {
 color: #0f172a;
 font-size: 11px;
 font-weight: 950;
 white-space: nowrap;
}

.route-candidate-order-row .route-candidate-actions {
 flex-wrap: nowrap;
}

.route-candidate-order-row .route-candidate-extra {
 grid-column: 3 / -1;
 margin: 0;
 padding-top: 5px;
 border-top: 1px dashed #e2e8f0;
}

@media (max-width: 1100px) {
 .route-candidate-order-row {
 grid-template-columns: 38px 82px minmax(140px, .8fr) minmax(190px, 1.2fr) minmax(150px, .75fr);
 }

 .route-candidate-order-row .route-candidate-actions {
 grid-column: 3 / -1;
 justify-content: flex-start;
 }
}

@media (max-width: 760px) {
 .route-candidate-order-row {
 grid-template-columns: 36px 78px minmax(0, 1fr);
 gap: 6px 8px;
 padding: 8px 8px 8px 10px;
 }

 .route-candidate-order-row .route-candidate-check {
 grid-row: 1 / span 2;
 }

 .route-candidate-order-route,
 .route-candidate-order-summary,
 .route-candidate-order-row .route-candidate-actions,
 .route-candidate-order-row .route-candidate-extra {
 grid-column: 2 / -1;
 }

 .route-candidate-order-route {
 padding-top: 5px;
 border-top: 1px solid #f1f5f9;
 }

 .route-candidate-order-route span {
 white-space: normal;
 }

 .route-candidate-order-summary {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 gap: 5px 8px;
 }

 .route-candidate-order-row .route-candidate-actions {
 justify-content: flex-start;
 }
}

/* Confirmed routes are operational cards, not planning proposals. */
.route-proposal-card.is-live-route {
 border-color: #22c55e;
 background:
 radial-gradient(circle at top right, rgba(34, 197, 94, .20), transparent 42%),
 linear-gradient(145deg, #f0fdf4, #fff 58%);
 box-shadow:
 0 0 0 3px rgba(34, 197, 94, .13),
 0 22px 54px rgba(21, 128, 61, .17);
}

.route-proposal-card.is-live-route::before,
.route-proposal-card.is-live-route.is-good::before,
.route-proposal-card.is-live-route.is-watch::before,
.route-proposal-card.is-live-route.is-hard::before {
 background: linear-gradient(180deg, #16a34a, #14b8a6);
}

.route-proposal-card.is-live-route.is-active::after {
 border-color: rgba(22, 163, 74, .25);
}

.route-proposal-card.is-live-route .route-proposal-link {
 padding-right: 82px;
}

.route-proposal-card.is-live-route .route-proposal-link strong,
.route-proposal-card.is-live-route.is-active .route-proposal-link strong {
 color: #14532d;
}

.route-proposal-live-badge {
 position: absolute;
 top: 14px;
 right: 14px;
 z-index: 2;
 display: inline-flex;
 align-items: center;
 gap: 6px;
 padding: 7px 10px;
 border: 1px solid #86efac;
 border-radius: 999px;
 background: #dcfce7;
 color: #166534;
 font-size: 11px;
 font-weight: 950;
 text-transform: uppercase;
 box-shadow: 0 7px 18px rgba(22, 163, 74, .16);
}

.route-proposal-live-badge i {
 width: 8px;
 height: 8px;
 border-radius: 50%;
 background: #22c55e;
 box-shadow: 0 0 0 4px rgba(34, 197, 94, .16);
 animation: routeLivePulse 1.8s ease-in-out infinite;
}

@keyframes routeLivePulse {
 0%, 100% { box-shadow: 0 0 0 3px rgba(34, 197, 94, .12); }
 50% { box-shadow: 0 0 0 7px rgba(34, 197, 94, .04); }
}

.route-proposal-card.is-live-route .route-proposal-active-badge {
 top: 51px;
 background: #0f766e;
 color: #fff;
 box-shadow: 0 8px 22px rgba(15, 118, 110, .20);
}

.route-proposal-live-panel {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 align-items: center;
 gap: 8px 12px;
 padding: 11px 12px;
 border: 1px solid #bbf7d0;
 border-radius: 15px;
 background: rgba(255, 255, 255, .86);
}

.route-proposal-driver,
.route-proposal-progress-count {
 display: grid;
 gap: 2px;
 min-width: 0;
}

.route-proposal-driver span,
.route-proposal-progress-count span {
 color: #64748b;
 font-size: 10px;
 font-weight: 950;
 text-transform: uppercase;
}

.route-proposal-driver strong {
 overflow: hidden;
 color: #0f172a;
 font-size: 14px;
 font-weight: 950;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.route-proposal-progress-count {
 justify-items: end;
}

.route-proposal-progress-count strong {
 color: #166534;
 font-size: 26px;
 font-weight: 950;
 line-height: .95;
}

.route-proposal-progress-track {
 grid-column: 1 / -1;
 height: 8px;
 overflow: hidden;
 border-radius: 999px;
 background: #dcfce7;
 box-shadow: inset 0 1px 2px rgba(22, 101, 52, .12);
}

.route-proposal-progress-track i {
 display: block;
 height: 100%;
 border-radius: inherit;
 background: linear-gradient(90deg, #16a34a, #14b8a6);
 transition: width .25s ease;
}

@media (max-width: 560px) {
 .route-proposal-live-panel {
 grid-template-columns: minmax(0, 1fr) auto;
 }

 .route-proposal-progress-count strong {
 font-size: 23px;
 }
}

.route-show-all-button {
 display: inline-flex;
 align-items: center;
 min-height: 42px;
 border: 1px solid #93c5fd;
 background: #eff6ff;
 color: #1d4ed8;
 font-weight: 950;
 box-shadow: 0 9px 22px rgba(37, 99, 235, .13);
}

.route-show-all-button:hover {
 border-color: #60a5fa;
 background: #dbeafe;
 color: #1e40af;
 transform: translateY(-1px);
}

@media (max-width: 760px) {
 .route-show-all-button {
 width: 100%;
 justify-content: center;
 }
}

/* Route cards grouped by operational state with resolution-aware wrapping. */
.routes-card-groups {
 display: grid;
 gap: 20px;
}

.routes-card-group {
 display: grid;
 gap: 11px;
 min-width: 0;
 padding: 14px;
 border: 1px solid #e2e8f0;
 border-radius: 20px;
 background: rgba(248, 250, 252, .72);
}

.routes-card-group.is-live {
 padding: 16px;
 border: 2px solid #86efac;
 background:
 radial-gradient(circle at top right, rgba(34, 197, 94, .16), transparent 34%),
 linear-gradient(145deg, rgba(240, 253, 244, .98), rgba(255, 255, 255, .96));
 box-shadow: 0 18px 44px rgba(22, 163, 74, .12);
}

.routes-card-group.is-completed {
 border-color: #cbd5e1;
 background: rgba(241, 245, 249, .72);
}

.routes-card-group-head {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 padding: 0 2px;
}

.routes-card-group-head h4 {
 margin: 0;
 color: #0f172a;
 font-size: 18px;
 font-weight: 950;
}

.routes-card-group.is-live .routes-card-group-head h4 {
 color: #166534;
}

.routes-card-group-head p {
 margin: 3px 0 0;
 color: #64748b;
 font-size: 12px;
 font-weight: 800;
}

.routes-card-group-head > span {
 flex: 0 0 auto;
 padding: 6px 9px;
 border: 1px solid #cbd5e1;
 border-radius: 999px;
 background: #fff;
 color: #475569;
 font-size: 11px;
 font-weight: 950;
 text-transform: uppercase;
}

.routes-card-group.is-live .routes-card-group-head > span {
 border-color: #86efac;
 background: #dcfce7;
 color: #166534;
}

.routes-card-group .routes-proposal-grid {
 grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
 gap: 13px;
}

.routes-card-group.is-live .routes-proposal-grid {
 grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
}

.routes-card-group.is-completed .route-proposal-card {
 box-shadow: 0 10px 26px rgba(71, 85, 105, .08);
}

/* Active + planning cards share one row only when every card keeps a usable width. */
.routes-card-groups {
 --routes-open-card-min: 310px;
 --routes-open-card-gap: 13px;
}

.routes-card-groups.is-open-groups-inline {
 grid-template-columns: repeat(var(--routes-open-card-count), minmax(0, 1fr));
 gap: var(--routes-open-card-gap);
}

.routes-card-groups.is-open-groups-inline
 > .routes-card-group:is(.is-live, .is-planning),
.routes-card-groups.is-open-groups-inline
 > .routes-card-group:is(.is-live, .is-planning)
 > .routes-proposal-grid {
 display: contents;
}

.routes-card-groups.is-open-groups-inline
 > .routes-card-group:is(.is-live, .is-planning)
 > .routes-card-group-head {
 display: none;
}

.routes-card-groups.is-open-groups-inline > .routes-card-group.is-completed {
 grid-column: 1 / -1;
 margin-top: 7px;
}

/* Operational type is shown by the stripe on the right edge of every card. */
.route-proposal-card::before {
 inset: 0 0 0 auto;
 width: 9px;
}

.route-proposal-card.route-type-auto::before {
 background: linear-gradient(180deg, #2563eb, #06b6d4);
}

.route-proposal-card.route-type-manual::before {
 background: linear-gradient(180deg, #7c3aed, #c026d3);
}

.route-proposal-card.route-type-completed::before {
 background: linear-gradient(180deg, #64748b, #cbd5e1);
}

.route-proposal-card.is-live-route.route-type-active::before,
.route-proposal-card.is-live-route.route-type-active.is-good::before,
.route-proposal-card.is-live-route.route-type-active.is-watch::before,
.route-proposal-card.is-live-route.route-type-active.is-hard::before {
 background: linear-gradient(180deg, #16a34a, #14b8a6);
}

@media (max-width: 720px) {
 .routes-card-group,
 .routes-card-group.is-live {
 padding: 10px;
 border-radius: 16px;
 }

 .routes-card-group .routes-proposal-grid,
 .routes-card-group.is-live .routes-proposal-grid {
 grid-template-columns: minmax(0, 1fr);
 }
}

@media (max-width: 480px) {
 .routes-card-group-head {
 align-items: flex-start;
 }

 .routes-card-group-head h4 {
 font-size: 16px;
 }

 .routes-card-group-head p {
 font-size: 11px;
 }
}

.routes-board-actions {
 display: flex;
 flex: 0 0 auto;
 align-items: center;
 justify-content: flex-end;
 gap: 9px;
}

.routes-board-actions form {
 margin: 0;
}

.route-manual-add-button {
 min-height: 42px;
 border-color: #ea580c;
 background: linear-gradient(135deg, #f97316, #ea580c);
 color: #fff;
 font-weight: 950;
 box-shadow: 0 10px 24px rgba(234, 88, 12, .25);
}

.route-manual-add-button:hover {
 border-color: #c2410c;
 background: linear-gradient(135deg, #fb923c, #ea580c);
 box-shadow: 0 13px 30px rgba(234, 88, 12, .32);
 transform: translateY(-1px);
}

.route-manual-add-button span {
 font-size: 19px;
 line-height: 1;
}

@media (max-width: 760px) {
 .routes-board-head {
 align-items: stretch;
 flex-direction: column;
 }

 .routes-board-actions {
 display: grid;
 grid-template-columns: 1fr 1fr;
 width: 100%;
 }

 .routes-board-actions .btn {
 width: 100%;
 min-height: 44px;
 }
}

@media (max-width: 480px) {
 .routes-board-actions {
 grid-template-columns: 1fr;
 }
}

/* Compact live performance KPI for active routes. */
.route-proposal-live-panel {
 grid-template-columns: minmax(0, 1fr) auto auto;
}

.route-proposal-live-score {
 display: grid;
 justify-items: end;
 gap: 2px;
 min-width: 48px;
}

.route-proposal-live-score span {
 color: #64748b;
 font-size: 10px;
 font-weight: 950;
 text-transform: uppercase;
}

.route-proposal-live-score strong {
 color: #166534;
 font-size: 26px;
 font-weight: 950;
 line-height: .95;
}

.route-live-deviations {
 grid-column: 1 / -1;
 display: flex;
 flex-wrap: wrap;
 gap: 5px;
 min-width: 0;
}

.route-live-deviations:empty {
 display: none;
}

.route-live-deviations span {
 display: inline-flex;
 align-items: center;
 min-height: 24px;
 margin: 0;
 padding: 4px 8px;
 border: 1px solid #cbd5e1;
 border-radius: 999px;
 background: #f8fafc;
 color: #475569;
 font-size: 11px;
 font-weight: 950;
 line-height: 1;
}

.route-live-deviations span.is-good {
 border-color: #86efac;
 background: #f0fdf4;
 color: #166534;
}

.route-live-deviations span.is-watch {
 border-color: #fde68a;
 background: #fffbeb;
 color: #92400e;
}

.route-live-deviations span.is-bad {
 border-color: #fecaca;
 background: #fef2f2;
 color: #b91c1c;
}

.route-proposal-live-panel[data-tone="watch"] {
 border-color: #fde68a;
 background: rgba(255, 251, 235, .92);
}

.route-proposal-live-panel[data-tone="bad"] {
 border-color: #fecaca;
 background: rgba(254, 242, 242, .92);
}

.route-proposal-live-panel[data-tone="watch"] .route-proposal-live-score strong {
 color: #b45309;
}

.route-proposal-live-panel[data-tone="bad"] .route-proposal-live-score strong {
 color: #b91c1c;
}

.route-proposal-live-panel[data-tone="watch"] .route-proposal-progress-track i {
 background: linear-gradient(90deg, #f59e0b, #f97316);
}

.route-proposal-live-panel[data-tone="bad"] .route-proposal-progress-track i {
 background: linear-gradient(90deg, #ef4444, #f97316);
}

.driver-live-summary {
 display: grid;
 grid-template-columns: 1fr 1fr;
 align-items: end;
 gap: 12px;
 margin-bottom: 10px;
}

.driver-live-summary > div:last-child {
 text-align: right;
}

.driver-live-summary span {
 display: block;
 margin: 0 0 2px;
 color: #64748b;
 font-size: 10px;
 font-weight: 950;
 text-transform: uppercase;
}

.driver-live-summary strong {
 display: block;
 color: #166534;
 font-size: 28px;
 font-weight: 950;
 line-height: 1;
}

.driver-progress-box .route-live-deviations {
 margin: 10px 0;
}

.driver-progress-box[data-tone="watch"] {
 border-color: #fde68a;
 background: #fffbeb;
}

.driver-progress-box[data-tone="bad"] {
 border-color: #fecaca;
 background: #fef2f2;
}

.driver-progress-box[data-tone="watch"] .driver-live-summary strong {
 color: #b45309;
}

.driver-progress-box[data-tone="bad"] .driver-live-summary strong {
 color: #b91c1c;
}

@media (max-width: 560px) {
 .route-proposal-live-panel {
 grid-template-columns: minmax(0, 1fr) auto auto;
 gap: 8px;
 }

 .route-proposal-live-score strong,
 .route-proposal-progress-count strong {
 font-size: 22px;
 }

 .route-proposal-driver strong {
 font-size: 12px;
 }
}

/* Traseul asignat utilizatorului: bara globala si oprirea curenta. */
.has-active-route-strip .topbar.alpha31-topbar-fixed {
 row-gap: 0 !important;
}

.header-active-route-strip[hidden] {
 display: none !important;
}

.header-active-route-strip {
 grid-column: 1 / -1;
 display: grid;
 grid-template-columns: auto auto minmax(0, 1fr) auto auto;
 align-items: center;
 gap: 8px 12px;
 min-width: 0;
 min-height: 46px;
 margin: 0 -18px -12px;
 padding: 8px 18px;
 border-top: 1px solid #86efac;
 background: linear-gradient(90deg, #dcfce7 0%, #f0fdf4 58%, #ecfdf5 100%);
 color: #14532d;
 text-decoration: none;
 box-shadow: 0 8px 20px rgba(22, 101, 52, .12);
 transition: background .18s ease, color .18s ease;
}

.header-active-route-strip:hover,
.header-active-route-strip:focus-visible {
 background: linear-gradient(90deg, #bbf7d0 0%, #dcfce7 100%);
 color: #14532d;
 outline: none;
}

.header-active-route-strip > strong {
 font-size: 13px;
 font-weight: 950;
 white-space: nowrap;
}

.header-active-route-signal {
 display: grid;
 width: 20px;
 height: 20px;
 place-items: center;
 border-radius: 999px;
 background: rgba(22, 163, 74, .14);
}

.header-active-route-signal i {
 width: 9px;
 height: 9px;
 border-radius: 999px;
 background: #16a34a;
 box-shadow: 0 0 0 4px rgba(34, 197, 94, .12);
 animation: routeLivePulse 1.8s ease-in-out infinite;
}

.header-active-route-name {
 min-width: 0;
 overflow: hidden;
 color: #166534;
 font-size: 13px;
 font-weight: 850;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.header-active-route-progress {
 display: inline-flex;
 align-items: center;
 min-height: 27px;
 padding: 4px 9px;
 border: 1px solid #86efac;
 border-radius: 999px;
 background: rgba(255, 255, 255, .72);
 color: #166534;
 font-size: 12px;
 font-weight: 950;
 white-space: nowrap;
}

.header-active-route-arrow {
 font-size: 20px;
 font-weight: 950;
 line-height: 1;
}

.driver-stop-card.is-current {
 border-color: #fb923c;
 border-left-color: #f97316;
 box-shadow: 0 0 0 3px rgba(249, 115, 22, .13), 0 16px 34px rgba(15, 23, 42, .10);
 outline: none;
 scroll-margin-top: calc(var(--topbar-height, 58px) + 18px);
}

.driver-stop-card.is-compact-complete {
 grid-template-columns: 34px minmax(0, 1fr);
 gap: 8px;
 min-height: 0;
 padding: 7px 10px !important;
 border: 1px solid #cbd5e1;
 border-left: 3px solid #94a3b8;
 border-radius: 13px;
 background: #e2e8f0;
 box-shadow: none;
 opacity: .55;
}

.driver-stop-card.is-compact-complete .driver-stop-number {
 width: 30px;
 height: 30px;
 border-radius: 9px;
 background: #64748b;
 font-size: 13px;
}

.driver-stop-content-complete {
 display: grid;
 align-content: center;
 gap: 1px;
}

.driver-stop-content-complete .driver-stop-complete-title {
 color: #475569;
 font-size: 12px;
 font-weight: 950;
 line-height: 1.15;
}

.driver-stop-content-complete h3 {
 margin: 1px 0 0;
 color: #334155;
 font-size: 15px;
 line-height: 1.12;
}

.driver-stop-content-complete p {
 margin: 0;
 overflow: hidden;
 color: #64748b;
 font-size: 12px;
 font-weight: 750;
 line-height: 1.12;
 text-overflow: ellipsis;
 white-space: nowrap;
}

@media (max-width: 760px) {
 .header-active-route-strip {
 grid-template-columns: auto minmax(0, 1fr) auto;
 gap: 7px;
 min-height: 44px;
 margin: 0 -9px -7px;
 padding: 7px 10px;
 }

 .header-active-route-strip > strong {
 overflow: hidden;
 font-size: 12px;
 text-overflow: ellipsis;
 }

 .header-active-route-name,
 .header-active-route-arrow {
 display: none;
 }

 .header-active-route-progress {
 min-height: 25px;
 padding: 3px 8px;
 font-size: 11px;
 }

 .driver-stop-card.is-compact-complete {
 grid-template-columns: 32px minmax(0, 1fr);
 gap: 7px;
 padding: 6px 8px !important;
 }

 .driver-stop-card.is-compact-complete .driver-stop-number {
 width: 28px;
 height: 28px;
 font-size: 12px;
 }

 .driver-stop-content-complete h3 {
 font-size: 14px;
 }
}

/* Pastreaza actiunile de selectie vizibile in lista candidatilor. */
.routes-eligible-card {
 overflow: visible;
}

.route-candidate-list .route-bulk-toolbar {
 position: sticky;
 top: calc(var(--topbar-height, 58px) + 8px);
 z-index: 24;
 box-shadow: 0 10px 26px rgba(154, 52, 18, .14);
}

/* Rezultatul actiunii soferului pe opririle deja inchise. */
.driver-stop-card.is-compact-complete {
 grid-template-columns: 34px minmax(0, 1fr) auto;
 opacity: 1;
}

.driver-stop-card.is-compact-complete .driver-stop-number,
.driver-stop-card.is-compact-complete .driver-stop-content-complete {
 opacity: .55;
}

.driver-stop-result-badge {
 align-self: center;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 5px;
 max-width: min(190px, 30vw);
 min-height: 28px;
 padding: 5px 9px;
 border: 1px solid #86efac;
 border-radius: 999px;
 background: #dcfce7;
 color: #166534;
 font-size: 11px;
 font-weight: 950;
 line-height: 1.1;
 text-align: center;
}

.driver-stop-result-badge::before {
 content: "\2713";
 flex: 0 0 auto;
 font-size: 12px;
}

.driver-stop-result-badge.is-rescheduled {
 border-color: #fcd34d;
 background: #fef3c7;
 color: #92400e;
}

.driver-stop-result-badge.is-rescheduled::before {
 content: "\21bb";
}

.driver-stop-result-badge.is-failed {
 border-color: #fca5a5;
 background: #fee2e2;
 color: #991b1b;
}

.driver-stop-result-badge.is-failed::before {
 content: "!";
}

.driver-stop-result-badge.is-skipped {
 border-color: #cbd5e1;
 background: #f1f5f9;
 color: #475569;
}

.driver-stop-result-badge.is-skipped::before {
 content: "\2014";
}

@media (max-width: 760px) {
 .driver-stop-card.is-compact-complete {
 grid-template-columns: 32px minmax(0, 1fr) auto;
 }

 .driver-stop-result-badge {
 max-width: 34vw;
 min-height: 25px;
 padding: 4px 7px;
 font-size: 10px;
 }
}

/* Lista compacta de planificare, pentru drag-and-drop pe desktop. */
@media (min-width: 981px) {
 .route-stop-list[data-route-stop-list] {
 gap: 5px;
 }

 .route-stop-card {
 grid-template-columns: 36px minmax(0, 1fr);
 gap: 7px;
 padding: 6px 7px;
 border-radius: 11px;
 box-shadow: 0 4px 12px rgba(15, 23, 42, .055);
 }

 .route-stop-order {
 min-height: 0;
 height: 100%;
 border-radius: 8px;
 font-size: 16px;
 }

 .route-stop-main {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 grid-template-areas:
 "head head"
 "client foot"
 "address actions"
 "extra extra";
 column-gap: 8px;
 row-gap: 3px;
 align-items: center;
 }

 .route-stop-head {
 grid-area: head;
 gap: 7px;
 }

 .route-stop-head strong {
 font-size: 13px;
 line-height: 1.1;
 }

 .route-stop-head .route-stop-time-stack {
 display: flex;
 align-items: center;
 justify-content: flex-end;
 gap: 5px;
 }

 .route-stop-time-stack b {
 padding: 2px 7px;
 font-size: 10px;
 }

 .route-stop-time-stack small {
 font-size: 9px;
 }

 .route-stop-client {
 grid-area: client;
 margin-top: 0;
 gap: 7px;
 font-size: 12px;
 line-height: 1.1;
 }

 .route-stop-client b,
 .route-stop-client a {
 font-size: 12px;
 }

 .route-stop-card p {
 grid-area: address;
 min-width: 0;
 margin: 0;
 overflow: hidden;
 color: #475569;
 font-size: 11px;
 line-height: 1.15;
 text-overflow: ellipsis;
 white-space: nowrap;
 }

 .route-stop-extra {
 grid-area: extra;
 margin: 0;
 gap: 4px;
 }

 .route-stop-schedule-chip,
 .route-stop-note {
 min-height: 19px;
 padding: 2px 6px;
 font-size: 10px;
 }

 .route-stop-action-row {
 grid-area: actions;
 flex-wrap: nowrap;
 justify-content: flex-end;
 gap: 4px;
 margin: 0;
 }

 .route-stop-action {
 min-height: 25px;
 padding: 4px 7px;
 border-radius: 7px;
 font-size: 10px;
 white-space: nowrap;
 }

 .route-stop-foot {
 grid-area: foot;
 justify-content: flex-end;
 gap: 5px;
 }

 .route-stop-foot .order-compact-status {
 max-width: 180px;
 padding: 3px 5px;
 border-radius: 7px;
 font-size: 9px;
 }

 .route-stop-foot .btn.tiny {
 min-height: 25px;
 padding: 4px 7px;
 border-radius: 7px;
 font-size: 10px;
 }
}

/* Catalog comercial separat de setarile firmei */
.catalog-settings-page {
 display: grid;
 gap: 18px;
 padding-bottom: 34px;
}

.catalog-settings-hero {
 position: relative;
 overflow: hidden;
 display: grid;
 grid-template-columns: minmax(0, 1.6fr) minmax(330px, 0.9fr);
 gap: 24px;
 align-items: center;
 min-height: 180px;
 border: 1px solid rgba(255, 151, 25, 0.22);
 background: radial-gradient(circle at 94% 12%, rgba(255, 177, 42, 0.24), transparent 38%), linear-gradient(135deg, #fff 0%, #fffaf2 58%, #fff3df 100%);
 box-shadow: 0 18px 42px rgba(28, 39, 59, 0.08);
}

.catalog-settings-hero::after {
 content: "";
 position: absolute;
 right: -72px;
 bottom: -92px;
 width: 180px;
 height: 180px;
 border: 26px solid rgba(255, 151, 25, 0.09);
 border-radius: 50%;
 pointer-events: none;
}

.catalog-settings-hero-copy,
.catalog-settings-metrics {
 position: relative;
 z-index: 1;
}

.catalog-settings-hero-copy h2 {
 margin: 3px 0 8px;
 font-size: clamp(25px, 3vw, 38px);
 line-height: 1.08;
 letter-spacing: -0.035em;
}

.catalog-settings-hero-copy > p:last-child {
 max-width: 720px;
 margin: 0;
 color: var(--muted);
 font-weight: 650;
 line-height: 1.55;
}

.catalog-settings-metrics {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 10px;
}

.catalog-settings-metrics > div {
 min-width: 0;
 padding: 16px 13px;
 border: 1px solid rgba(93, 108, 135, 0.15);
 border-radius: 18px;
 background: rgba(255, 255, 255, 0.82);
 box-shadow: 0 9px 22px rgba(37, 48, 70, 0.06);
 text-align: center;
}

.catalog-settings-metrics span {
 display: block;
 min-height: 30px;
 color: var(--muted);
 font-size: 11px;
 font-weight: 850;
 line-height: 1.25;
 text-transform: uppercase;
}

.catalog-settings-metrics strong {
 display: block;
 margin-top: 4px;
 font-size: 27px;
 line-height: 1;
}

.catalog-settings-notice {
 padding: 14px 17px;
 border: 1px solid #ffd8a7;
 border-radius: 15px;
 background: #fff8eb;
 color: #8a4b00;
 font-weight: 800;
}

.catalog-settings-notice.is-success {
 border-color: #a7e8c7;
 background: #effcf5;
 color: #12613c;
}

.catalog-settings-section {
 display: grid;
 gap: 18px;
 border: 1px solid var(--line);
 box-shadow: 0 16px 38px rgba(28, 39, 59, 0.07);
}

.catalog-settings-section-head {
 display: flex;
 gap: 18px;
 align-items: flex-start;
 justify-content: space-between;
 padding-bottom: 16px;
 border-bottom: 1px solid var(--line);
}

.catalog-settings-kicker {
 display: block;
 margin-bottom: 4px;
 color: #d76d00;
 font-size: 11px;
 font-weight: 900;
 letter-spacing: 0.08em;
 text-transform: uppercase;
}

.catalog-settings-section-head h3 {
 margin: 0;
 font-size: 23px;
 letter-spacing: -0.02em;
}

.catalog-settings-section-head p {
 max-width: 680px;
 margin: 5px 0 0;
 color: var(--muted);
 font-size: 13px;
 font-weight: 650;
 line-height: 1.45;
}

.catalog-settings-section-actions {
 display: flex;
 flex: 0 0 auto;
 gap: 9px;
 align-items: center;
}

.catalog-editor-list {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr));
 gap: 14px;
 align-items: start;
}

.catalog-editor-card {
 overflow: hidden;
 border: 1px solid #dce2ec;
 border-radius: 20px;
 background: #fff;
 box-shadow: 0 10px 28px rgba(37, 48, 70, 0.06);
}

.catalog-editor-card-head {
 display: grid;
 grid-template-columns: 44px minmax(0, 1fr) auto;
 gap: 11px;
 align-items: center;
 padding: 14px 16px;
 border-bottom: 1px solid #e8ecf3;
 background: linear-gradient(180deg, #fff, #fbfcfe);
}

.catalog-editor-card-head > div { min-width: 0; }
.catalog-editor-card-head strong,
.catalog-editor-card-head small {
 display: block;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}
.catalog-editor-card-head strong { font-size: 15px; font-weight: 900; }
.catalog-editor-card-head small { margin-top: 2px; color: var(--muted); font-size: 11px; font-weight: 700; }

.catalog-editor-icon {
 display: grid;
 place-items: center;
 width: 44px;
 height: 44px;
 border-radius: 14px;
 background: #eef4ff;
 font-size: 20px;
}
.catalog-editor-icon.is-fixed { background: #fff1dc; }
.catalog-editor-icon.is-fee { background: #ffe9e8; color: #c63a31; }
.catalog-editor-icon.is-coupon { background: #eaf8ef; }
.catalog-editor-icon.is-new { background: linear-gradient(135deg, #ff9700, #ffc029); color: #fff; font-size: 27px; font-weight: 700; }

.catalog-active-badge {
 padding: 6px 9px;
 border: 1px solid #a8e8c7;
 border-radius: 999px;
 background: #effcf5;
 color: #17623f;
 font-size: 10px;
 font-weight: 900;
 text-transform: uppercase;
}

.catalog-editor-grid {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 12px;
 padding: 15px 16px;
}

.catalog-editor-grid > label {
 display: grid;
 gap: 6px;
 min-width: 0;
 margin: 0;
}

.catalog-editor-grid > label > span:first-child {
 color: #526077;
 font-size: 11px;
 font-weight: 850;
}

.catalog-editor-grid input,
.catalog-editor-grid select,
.catalog-editor-grid textarea {
 width: 100%;
 min-width: 0;
 min-height: 41px;
 border: 1px solid #d8dee9;
 border-radius: 11px;
 background: #f9fafc;
 color: var(--text);
 font: inherit;
 font-size: 13px;
 font-weight: 700;
}

.catalog-editor-grid textarea {
 min-height: 66px;
 padding: 10px 12px;
 resize: vertical;
}

.catalog-field-wide,
.catalog-field-full { grid-column: 1 / -1; }

.catalog-value-input { position: relative; }
.catalog-value-input input { padding-right: 45px; }
.catalog-value-input em {
 position: absolute;
 top: 50%;
 right: 12px;
 color: var(--muted);
 font-size: 11px;
 font-style: normal;
 font-weight: 850;
 transform: translateY(-50%);
}

.catalog-inline-value {
 display: grid;
 grid-template-columns: minmax(0, 1fr) 74px;
 gap: 6px;
}

.catalog-switch-field {
 display: flex !important;
 gap: 10px !important;
 align-items: center;
 min-height: 58px;
 padding: 9px 11px;
 border: 1px solid #d8dee9;
 border-radius: 12px;
 background: #f9fafc;
 cursor: pointer;
}
.catalog-switch-field input { width: 19px; min-height: 19px; accent-color: #ff9700; }
.catalog-switch-field span,
.catalog-switch-field b,
.catalog-switch-field small { display: block; }
.catalog-switch-field b { font-size: 12px; }
.catalog-switch-field small { margin-top: 2px; color: var(--muted); font-size: 10px; font-weight: 700; }

.catalog-editor-card-footer {
 display: flex;
 gap: 12px;
 align-items: center;
 justify-content: space-between;
 padding: 11px 16px 14px;
 border-top: 1px solid #edf0f5;
}
.catalog-editor-card-footer > span { color: var(--muted); font-size: 10px; font-weight: 700; }

.catalog-delete-btn,
.btn.danger.catalog-delete-btn {
 min-height: 36px;
 padding: 7px 13px;
 border-color: #ffd0cf;
 background: #fff0ef;
 color: #b52c27;
 box-shadow: none;
}

.catalog-create-card {
 border: 2px dashed rgba(255, 151, 0, 0.48);
 background: #fffdf8;
 box-shadow: none;
}

.catalog-empty-state {
 display: grid;
 place-items: center;
 min-height: 210px;
 padding: 25px;
 border: 2px dashed #dce2ec;
 border-radius: 20px;
 color: var(--muted);
 text-align: center;
}
.catalog-empty-state > span { font-size: 33px; }
.catalog-empty-state strong { margin-top: 8px; color: var(--text); }
.catalog-empty-state small { margin-top: 4px; }

.catalog-archive {
 overflow: hidden;
 border: 1px solid #dfe4ec;
 border-radius: 16px;
 background: #fafbfd;
}

.catalog-archive summary {
 display: flex;
 gap: 12px;
 align-items: center;
 justify-content: space-between;
 padding: 14px 16px;
 color: #5b667a;
 font-size: 12px;
 font-weight: 850;
 cursor: pointer;
 list-style: none;
}
.catalog-archive summary::-webkit-details-marker { display: none; }
.catalog-archive summary b {
 display: grid;
 place-items: center;
 min-width: 29px;
 height: 29px;
 border-radius: 999px;
 background: #e9edf4;
 font-size: 11px;
}

.catalog-archive-list {
 display: grid;
 gap: 1px;
 border-top: 1px solid #dfe4ec;
 background: #e8ecf2;
}
.catalog-archive-list > div {
 display: flex;
 gap: 15px;
 align-items: center;
 justify-content: space-between;
 padding: 11px 14px;
 background: #fff;
}
.catalog-archive-list span,
.catalog-archive-list strong,
.catalog-archive-list small { display: block; }
.catalog-archive-list small { margin-top: 2px; color: var(--muted); font-size: 10px; }

body[class*="user-theme-"] .catalog-settings-hero,
body[class*="user-theme-"] .catalog-settings-section,
body[class*="user-theme-"] .catalog-editor-card {
 border-color: color-mix(in srgb, var(--text) 13%, transparent);
 background: var(--panel);
 color: var(--text);
}

body[class*="user-theme-"] .catalog-editor-card-head,
body[class*="user-theme-"] .catalog-editor-grid input,
body[class*="user-theme-"] .catalog-editor-grid select,
body[class*="user-theme-"] .catalog-editor-grid textarea,
body[class*="user-theme-"] .catalog-switch-field,
body[class*="user-theme-"] .catalog-archive-list > div {
 background: var(--panel);
 color: var(--text);
}

@media (max-width: 900px) {
 .catalog-settings-hero { grid-template-columns: 1fr; }
 .catalog-settings-metrics { max-width: 520px; }
 .catalog-settings-section-head { display: grid; }
}

@media (max-width: 680px) {
 .catalog-settings-page { gap: 12px; }
 .catalog-settings-hero { min-height: 0; padding: 18px 15px; border-radius: 18px; }
 .catalog-settings-hero-copy h2 { font-size: 25px; }
 .catalog-settings-metrics { gap: 6px; }
 .catalog-settings-metrics > div { padding: 12px 7px; border-radius: 13px; }
 .catalog-settings-metrics span { min-height: 26px; font-size: 9px; }
 .catalog-settings-metrics strong { font-size: 22px; }
 .catalog-settings-section { gap: 13px; padding: 14px; border-radius: 18px; }
 .catalog-settings-section-head h3 { font-size: 20px; }
 .catalog-settings-section-actions { display: grid; grid-template-columns: 1fr 1fr; }
 .catalog-settings-section-actions .btn { width: 100%; min-width: 0; padding-inline: 8px; font-size: 11px; }
 .catalog-editor-list { grid-template-columns: 1fr; }
 .catalog-editor-card { border-radius: 16px; }
 .catalog-editor-card-head { grid-template-columns: 38px minmax(0, 1fr) auto; padding: 12px; }
 .catalog-editor-icon { width: 38px; height: 38px; border-radius: 11px; font-size: 17px; }
 .catalog-editor-grid { grid-template-columns: 1fr; gap: 10px; padding: 12px; }
 .catalog-field-wide,
 .catalog-field-full { grid-column: auto; }
 .catalog-editor-card-footer { padding: 10px 12px 12px; }
 .catalog-editor-card-footer > span { display: none; }
 .catalog-delete-btn { width: 100%; }
 .catalog-archive-list > div { align-items: flex-start; }
}

/* Operational delay badges (asset 079). */
.order-delay-badge,
.notification-status-badge {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: max-content;
 max-width: 100%;
 border: 1px solid transparent;
 border-radius: 999px;
 font-size: 10px;
 font-weight: 900;
 line-height: 1;
 letter-spacing: .02em;
 white-space: nowrap;
}

.order-delay-badge {
 min-height: 22px;
 padding: 5px 9px;
 margin-top: 5px;
}

.order-delay-badge.is-slight,
.notification-status-badge.is-slight {
 color: #92400e;
 border-color: #fbbf24;
 background: #fef3c7;
}

.order-delay-badge.is-late,
.notification-status-badge.is-late {
 color: #991b1b;
 border-color: #f87171;
 background: #fee2e2;
}

.notification-item strong {
 display: flex;
 align-items: center;
 flex-wrap: wrap;
 gap: 6px;
}

.notification-status-badge {
 min-height: 18px;
 padding: 4px 7px;
 font-size: 8px;
}

.order-compact-foot .order-delay-badge,
.order-extended-head-actions .order-delay-badge {
 margin-top: 0;
}

.order-desktop-status-pill + .order-delay-badge {
 display: flex;
 margin-top: 5px;
}

@media (max-width: 680px) {
 .order-delay-badge {
 font-size: 9px;
 }
}

/* Desktop command bar: actiuni grupate vizual, cu varianta compacta intermediara. */
@media (min-width: 901px) {
 .alpha31-topbar-fixed .header-right-actions {
 gap: 9px !important;
 }

 .header-action-cluster,
 .header-agent-cluster {
 --header-cluster-accent: #64748b;
 --header-cluster-soft: #f1f5f9;
 --header-cluster-border: #d9e1eb;
 position: relative !important;
 isolation: isolate;
 border-color: var(--header-cluster-border) !important;
 background: linear-gradient(180deg, #ffffff 0%, var(--header-cluster-soft) 145%) !important;
 box-shadow:
 0 9px 22px rgba(15, 23, 42, .075),
 inset 0 1px 0 rgba(255, 255, 255, .9) !important;
 }

 .header-orders-cluster {
 --header-cluster-accent: #f97316;
 --header-cluster-soft: #fff4e7;
 --header-cluster-border: #fed7aa;
 }

 .header-search-cluster {
 --header-cluster-accent: #2563eb;
 --header-cluster-soft: #eff6ff;
 --header-cluster-border: #bfdbfe;
 }

 .header-agent-cluster {
 --header-cluster-accent: #15803d;
 --header-cluster-soft: #effcf4;
 --header-cluster-border: #bbf7d0;
 }

 .header-action-cluster::after,
 .header-agent-cluster::after {
 content: "";
 position: absolute;
 z-index: 3;
 top: 9px;
 bottom: 9px;
 left: -1px;
 width: 3px;
 border-radius: 0 999px 999px 0;
 background: var(--header-cluster-accent);
 box-shadow: 0 0 10px color-mix(in srgb, var(--header-cluster-accent) 34%, transparent);
 pointer-events: none;
 }

 .header-action-cluster .header-action-icon,
 .header-agent-cluster .notification-icon,
 .header-agent-cluster .userbox.header-user-menu .avatar {
 display: inline-flex !important;
 align-items: center !important;
 justify-content: center !important;
 width: 27px !important;
 height: 27px !important;
 min-width: 27px !important;
 flex-basis: 27px !important;
 border: 1px solid color-mix(in srgb, var(--header-cluster-accent) 20%, #ffffff) !important;
 border-radius: 9px !important;
 background: color-mix(in srgb, var(--header-cluster-accent) 10%, #ffffff) !important;
 box-shadow: 0 3px 9px color-mix(in srgb, var(--header-cluster-accent) 13%, transparent) !important;
 }

 .header-action-cluster .header-icon-btn,
 .header-agent-cluster .notification-toggle,
 .header-agent-cluster .userbox-button {
 transition: background .16s ease, color .16s ease, box-shadow .16s ease !important;
 }

 .header-action-cluster .header-icon-btn:hover,
 .header-agent-cluster .notification-toggle:hover,
 .header-agent-cluster .userbox-button:hover,
 .header-agent-cluster .header-notifications.is-open .notification-toggle,
 .header-agent-cluster .header-user-menu.is-open .userbox-button {
 background: color-mix(in srgb, var(--header-cluster-accent) 9%, #ffffff) !important;
 }

 .header-action-cluster > .header-icon-btn + .header-icon-btn,
 .header-action-cluster > .header-smart-search,
 .header-agent-cluster .userbox-button {
 border-left-color: color-mix(in srgb, var(--header-cluster-accent) 18%, #e5e7eb) !important;
 }

 .header-action-cluster .header-icon-btn.active {
 background: linear-gradient(
 135deg,
 color-mix(in srgb, var(--header-cluster-accent) 88%, #ffffff),
 var(--header-cluster-accent)
 ) !important;
 color: #ffffff !important;
 box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2) !important;
 }

 .header-action-cluster .header-icon-btn.active .header-action-label {
 color: #ffffff !important;
 }

 .header-action-cluster .header-icon-btn.active .header-action-icon {
 border-color: rgba(255, 255, 255, .36) !important;
 background: rgba(255, 255, 255, .18) !important;
 box-shadow: none !important;
 }

 .header-action-label {
 color: #263449 !important;
 letter-spacing: -.01em;
 }
}

@media (min-width: 1200px) {
 .header-action-cluster,
 .header-agent-cluster {
 height: 54px !important;
 padding-top: 13px !important;
 border-radius: 18px !important;
 }

 .header-action-cluster::before,
 .header-agent-cluster::before {
 content: attr(data-cluster-label);
 position: absolute;
 z-index: 4;
 top: 4px;
 left: 13px;
 color: var(--header-cluster-accent);
 font-size: 8px;
 font-weight: 950;
 line-height: 1;
 letter-spacing: .09em;
 text-transform: uppercase;
 pointer-events: none;
 }

 .header-action-cluster::after,
 .header-agent-cluster::after {
 top: 13px;
 bottom: 7px;
 }

 .alpha31-topbar-fixed .header-action-cluster > .header-icon-btn,
 .alpha31-topbar-fixed .header-action-cluster > .header-smart-search > .header-icon-btn,
 .header-agent-cluster .notification-toggle,
 .header-agent-cluster .userbox-button {
 height: 39px !important;
 }

 .header-action-cluster > .header-smart-search,
 .header-agent-cluster .header-notifications,
 .header-agent-cluster .userbox.header-user-menu {
 height: 39px !important;
 align-self: flex-end !important;
 }

 .header-action-cluster > :first-child.header-icon-btn,
 .header-action-cluster > :first-child .header-icon-btn,
 .header-agent-cluster .notification-toggle {
 border-radius: 0 0 0 16px !important;
 }

 .header-action-cluster > :last-child.header-icon-btn,
 .header-action-cluster > :last-child .header-icon-btn,
 .header-agent-cluster .userbox-button {
 border-radius: 0 0 16px 0 !important;
 }

 .header-action-cluster > :only-child.header-icon-btn,
 .header-action-cluster > :only-child .header-icon-btn {
 border-radius: 0 0 16px 16px !important;
 }

 .header-agent-cluster .notification-badge {
 top: 2px;
 left: auto;
 right: 4px;
 min-width: 19px;
 height: 19px;
 padding-inline: 5px;
 font-size: 9px;
 }
}

@media (min-width: 901px) and (max-width: 1199px) {
 .header-action-cluster,
 .header-agent-cluster {
 height: 44px !important;
 }

 .header-action-cluster .header-action-label,
 .header-agent-cluster .header-action-label {
 font-size: 11px !important;
 }

 .alpha31-topbar-fixed .header-action-cluster > .header-icon-btn,
 .alpha31-topbar-fixed .header-action-cluster > .header-smart-search > .header-icon-btn,
 .header-agent-cluster .notification-toggle,
 .header-agent-cluster .userbox-button {
 padding-inline: 9px !important;
 }
}

/* Mobile command bar: cod cromatic, stare activa si feedback tactil. */
@media (max-width: 900px) {
 .header-orders-cluster {
 --mobile-header-accent: #f97316;
 --mobile-header-soft: #fff4e7;
 --mobile-header-line: #fed7aa;
 }

 .header-search-cluster {
 --mobile-header-accent: #2563eb;
 --mobile-header-soft: #eff6ff;
 --mobile-header-line: #bfdbfe;
 }

 .header-agent-cluster {
 --mobile-header-accent: #15803d;
 --mobile-header-soft: #effcf4;
 --mobile-header-line: #bbf7d0;
 }

 .header-action-cluster,
 .header-agent-cluster {
 border-color: var(--mobile-header-line, #e5e7eb) !important;
 background: linear-gradient(180deg, #ffffff, var(--mobile-header-soft, #f8fafc)) !important;
 box-shadow:
 0 6px 16px rgba(15, 23, 42, .065),
 inset 0 1px 0 rgba(255, 255, 255, .92) !important;
 }

 .header-action-cluster .header-action-icon,
 .header-agent-cluster .notification-icon {
 display: inline-flex !important;
 align-items: center !important;
 justify-content: center !important;
 width: 25px !important;
 height: 25px !important;
 min-width: 25px !important;
 border: 1px solid color-mix(in srgb, var(--mobile-header-accent) 18%, #ffffff) !important;
 border-radius: 8px !important;
 background: color-mix(in srgb, var(--mobile-header-accent) 9%, #ffffff) !important;
 box-shadow: 0 2px 7px color-mix(in srgb, var(--mobile-header-accent) 11%, transparent) !important;
 }

 .header-agent-cluster .userbox.header-user-menu .avatar {
 border-left-color: color-mix(in srgb, var(--mobile-header-accent) 18%, #e5e7eb) !important;
 background: color-mix(in srgb, var(--mobile-header-accent) 8%, #ffffff) !important;
 color: #14532d !important;
 }

 .header-action-cluster .header-icon-btn,
 .header-agent-cluster .notification-toggle,
 .header-agent-cluster .userbox-button {
 -webkit-tap-highlight-color: transparent;
 transition: transform .09s ease, background .12s ease !important;
 }

 .header-action-cluster .header-icon-btn.active {
 background: transparent !important;
 color: var(--mobile-header-accent) !important;
 box-shadow: none !important;
 }

 .header-action-cluster .header-icon-btn.active .header-action-icon {
 border-color: color-mix(in srgb, var(--mobile-header-accent) 46%, #ffffff) !important;
 background: color-mix(in srgb, var(--mobile-header-accent) 18%, #ffffff) !important;
 box-shadow: 0 3px 9px color-mix(in srgb, var(--mobile-header-accent) 20%, transparent) !important;
 }

 .header-action-cluster .header-icon-btn.active::after,
 .header-smart-search.is-open .smart-search-toggle-btn::after,
 .header-agent-cluster .header-notifications.is-open .notification-toggle::after,
 .header-agent-cluster .userbox-button.active::after,
 .header-agent-cluster .header-user-menu.is-open .userbox-button::after {
 content: "" !important;
 position: absolute !important;
 z-index: 6;
 right: auto !important;
 bottom: 2px !important;
 left: 50% !important;
 width: 14px !important;
 height: 3px !important;
 border: 0 !important;
 border-radius: 999px !important;
 background: var(--mobile-header-accent) !important;
 box-shadow: 0 2px 5px color-mix(in srgb, var(--mobile-header-accent) 28%, transparent) !important;
 transform: translateX(-50%) !important;
 pointer-events: none;
 }

 .header-smart-search.is-open .smart-search-toggle-btn {
 background: color-mix(in srgb, var(--mobile-header-accent) 10%, #ffffff) !important;
 }

 .header-agent-cluster .header-notifications.is-open .notification-toggle,
 .header-agent-cluster .userbox-button.active,
 .header-agent-cluster .header-user-menu.is-open .userbox-button {
 background: color-mix(in srgb, var(--mobile-header-accent) 9%, #ffffff) !important;
 }
}

@media (max-width: 900px) and (hover: none) and (pointer: coarse) {
 .header-action-cluster .header-icon-btn:active,
 .header-agent-cluster .notification-toggle:active,
 .header-agent-cluster .userbox-button:active {
 transform: scale(.91) !important;
 }
}

@media (max-width: 430px) {
 .header-action-cluster .header-action-icon,
 .header-agent-cluster .notification-icon {
 width: 23px !important;
 height: 23px !important;
 min-width: 23px !important;
 border-radius: 7px !important;
 }

 .header-action-cluster .header-icon-btn.active::after,
 .header-smart-search.is-open .smart-search-toggle-btn::after,
 .header-agent-cluster .header-notifications.is-open .notification-toggle::after,
 .header-agent-cluster .userbox-button.active::after,
 .header-agent-cluster .header-user-menu.is-open .userbox-button::after {
 bottom: 1px !important;
 width: 11px !important;
 height: 2px !important;
 }
}

/* Numarul articolelor, vizibil direct in identitatea comenzii. */
.order-items-count-badge {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-height: 34px;
 padding: 6px 13px;
 border: 1px solid rgba(255, 255, 255, .34);
 border-radius: 12px;
 background: linear-gradient(135deg, #fbbf24 0%, #fb923c 100%);
 color: #431407;
 font-size: 16px;
 font-weight: 950;
 line-height: 1;
 letter-spacing: -.015em;
 white-space: nowrap;
 box-shadow:
 0 7px 17px rgba(249, 115, 22, .28),
 inset 0 1px 0 rgba(255, 255, 255, .55);
}

@media (max-width: 760px) {
 .order-hero-card-test-2 .order-number-line {
 gap: 6px !important;
 }

 .order-hero-card-test-2 .order-items-count-badge {
 min-height: 28px;
 padding: 4px 8px;
 border-radius: 10px;
 font-size: 12px;
 box-shadow:
 0 5px 12px rgba(249, 115, 22, .24),
 inset 0 1px 0 rgba(255, 255, 255, .5);
 }

 .order-hero-card-test-2 .order-mode-pill {
 max-width: 42% !important;
 }
}

@media (max-width: 360px) {
 .order-hero-card-test-2 .order-items-count-badge {
 padding-inline: 6px;
 font-size: 11px;
 }

 .order-hero-card-test-2 .order-mode-pill {
  max-width: 39% !important;
 }
}

/* Status pills v099: quiet shared outline; colour only signals the workflow. */
.order-status-gradient {
 border-color: #c7d2e3 !important;
 background:
  linear-gradient(
   92deg,
   #ffffff 0%,
   #ffffff 40%,
   color-mix(in srgb, var(--status-parent-color, #f1f5f9) 24%, #ffffff) 66%,
   color-mix(in srgb, var(--status-accent-color, #cbd5e1) 38%, #ffffff) 84%,
   #ffffff 100%
  ) !important;
 box-shadow:
  inset 0 0 0 1px rgba(255, 255, 255, .78),
  0 3px 8px rgba(15, 23, 42, .045) !important;
}

/* Lista comenzi: varianta curata pentru Print / Ctrl+P, fara actiuni suplimentare. */
.orders-print-header {
 display: none;
}

@page {
 size: A4 portrait;
 margin: 10mm 8mm;
}

@media print {
 html,
 body {
 width: 100% !important;
 min-width: 0 !important;
 margin: 0 !important;
 padding: 0 !important;
 background: #ffffff !important;
 color: #0f172a !important;
 -webkit-print-color-adjust: exact;
 print-color-adjust: exact;
 }

 .sidebar,
 .sidebar-backdrop,
 .topbar,
 .header-active-route-strip,
 .navigation-loader,
 .orders-filter-modal-backdrop,
 .orders-list-mode-bar,
 .orders-active-filter-bar,
 .orders-pagination-bar,
 .orders-compact-list,
 .orders-extended-list {
 display: none !important;
 }

 .app-shell,
 .main,
 .page,
 .orders-page,
 .orders-list-shell {
 display: block !important;
 width: 100% !important;
 min-width: 0 !important;
 max-width: none !important;
 min-height: 0 !important;
 margin: 0 !important;
 padding: 0 !important;
 overflow: visible !important;
 background: transparent !important;
 box-shadow: none !important;
 animation: none !important;
 transform: none !important;
 }

 .orders-print-header {
 display: flex !important;
 align-items: end;
 justify-content: space-between;
 gap: 12px;
 margin: 0 0 7mm !important;
 padding: 0 0 4mm !important;
 border-bottom: 1px solid #94a3b8;
 color: #0f172a;
 }

 .orders-print-header h1 {
 margin: 0;
 color: #0f172a;
 font-size: 18pt;
 font-weight: 900;
 letter-spacing: -.03em;
 }

 .orders-print-header p,
 .orders-print-header small {
 margin: 1.5mm 0 0;
 color: #475569;
 font-size: 8.5pt;
 font-weight: 700;
 line-height: 1.35;
 }

 .orders-print-header small {
 flex: 0 0 auto;
 text-align: right;
 }

 .orders-desktop-table,
 .orders-desktop-table.table-wrap,
 .orders-desktop-table.card {
 display: block !important;
 width: 100% !important;
 margin: 0 !important;
 padding: 0 !important;
 overflow: visible !important;
 border: 0 !important;
 border-radius: 0 !important;
 background: transparent !important;
 box-shadow: none !important;
 }

 .orders-table-alpha36 {
 display: table !important;
 width: 100% !important;
 border-collapse: collapse !important;
 border-spacing: 0 !important;
 table-layout: auto !important;
 font-size: 8.5pt !important;
 }

 .orders-table-alpha36 thead {
 display: table-header-group !important;
 }

 .orders-table-alpha36 tr {
 break-inside: avoid;
 page-break-inside: avoid;
 }

 .orders-table-alpha36 th {
 padding: 2.5mm 2mm !important;
 border-top: 1px solid #cbd5e1 !important;
 border-bottom: 1px solid #94a3b8 !important;
 background: #f1f5f9 !important;
 color: #334155 !important;
 font-size: 7.5pt !important;
 font-weight: 900 !important;
 letter-spacing: .025em;
 text-transform: uppercase;
 }

 .orders-table-alpha36 td {
 padding: 2.4mm 2mm !important;
 border-bottom: 1px solid #dbe3ef !important;
 color: #0f172a !important;
 vertical-align: middle !important;
 background: #ffffff !important;
 }

 .orders-table-alpha36 .order-row {
 cursor: default !important;
 }

 .orders-table-alpha36 .order-desktop-id-cell {
 min-width: 25mm;
 padding-left: 4mm !important;
 }

 .orders-table-alpha36 .order-desktop-accent {
 width: 1.3mm !important;
 }

 .orders-table-alpha36 .tiny-text,
 .orders-table-alpha36 .muted {
 color: #64748b !important;
 font-size: 7.5pt !important;
 }

 .orders-table-alpha36 .order-desktop-status-pill,
 .orders-table-alpha36 .order-schedule-chip,
 .orders-table-alpha36 .order-delay-badge {
 max-width: none !important;
 min-height: 0 !important;
 padding: 1mm 1.6mm !important;
 border-width: 1px !important;
 box-shadow: none !important;
 font-size: 7.5pt !important;
 line-height: 1.15 !important;
 white-space: normal !important;
 }

 .orders-table-alpha36 .order-list-progress-mini {
 min-width: 21mm !important;
 padding: 1mm !important;
 box-shadow: none !important;
 }

 .orders-table-alpha36 .order-day-separator-row,
 .orders-table-alpha36 .order-day-separator-row td,
 .orders-table-alpha36 .order-day-separator-cell {
 position: static !important;
 top: auto !important;
 z-index: auto !important;
 padding: 2mm !important;
 border-top: 1px solid #94a3b8 !important;
 border-bottom: 1px solid #cbd5e1 !important;
 background: #e2e8f0 !important;
 color: #0f172a !important;
 box-shadow: none !important;
 font-size: 8pt !important;
 font-weight: 900 !important;
 text-align: left !important;
 }

 .orders-table-alpha36 a {
 color: inherit !important;
 text-decoration: none !important;
 }
}

/* Print v102: lista de comenzi incepe imediat cu tabelul, fara continut invizibil. */
@page {
 size: A4 portrait;
 margin: 7mm 7mm 8mm;
}

@media print {
 .orders-print-header {
 display: none !important;
 }

 /* Pastreaza strict containerul tabelului. Astfel cardurile mobile nu mai rezerva pagini goale. */
 .orders-page > * {
 display: none !important;
 }

 .orders-page > .orders-list-shell,
 .orders-list-shell > .orders-desktop-table,
 .orders-list-shell > .orders-desktop-table.table-wrap,
 .orders-list-shell > .orders-desktop-table.card {
 display: block !important;
 }

 .orders-page,
 .orders-list-shell,
 .orders-desktop-table,
 .orders-desktop-table.table-wrap,
 .orders-desktop-table.card {
 position: static !important;
 clear: both !important;
 margin: 0 !important;
 padding: 0 !important;
 min-height: 0 !important;
 height: auto !important;
 }

 .orders-list-shell > :not(.orders-desktop-table) {
 display: none !important;
 }

 .orders-table-alpha36 {
 margin: 0 !important;
 }

 .orders-table-alpha36 tbody {
 display: table-row-group !important;
 }

 .orders-table-alpha36 .order-day-separator-row,
 .orders-table-alpha36 .order-day-separator-row td,
 .orders-table-alpha36 .order-day-separator-cell {
 display: none !important;
 }

 .orders-table-alpha36 .order-row > td {
 animation: none !important;
 transform: none !important;
 opacity: 1 !important;
 filter: none !important;
 will-change: auto !important;
 }
}

/* Print v103: suprascriere cu specificitate mare pentru bara sticky si lista mobila. */
@page {
 size: A4 portrait;
 margin: 6mm 7mm 8mm;
}

@media print {
 html,
 body {
 width: 100% !important;
 min-width: 0 !important;
 margin: 0 !important;
 padding: 0 !important;
 background: #ffffff !important;
 color: #0f172a !important;
 -webkit-print-color-adjust: exact;
 print-color-adjust: exact;
 }

 html body .sidebar-backdrop,
 html body .app-shell > aside.sidebar,
 html body .app-shell > main.main > header.topbar.alpha31-topbar-fixed,
 html body .app-shell > main.main > .goic-modal,
 html body .navigation-loader {
 display: none !important;
 }

 html body .app-shell,
 html body .app-shell > main.main,
 html body .app-shell > main.main > section.page,
 html body .app-shell > main.main > section.page > .orders-page,
 html body .app-shell > main.main > section.page > .orders-page > .orders-list-shell {
 display: block !important;
 position: static !important;
 width: 100% !important;
 min-width: 0 !important;
 max-width: none !important;
 min-height: 0 !important;
 height: auto !important;
 margin: 0 !important;
 padding: 0 !important;
 overflow: visible !important;
 background: transparent !important;
 box-shadow: none !important;
 transform: none !important;
 animation: none !important;
 }

 html body .app-shell > main.main {
 padding-top: 0 !important;
 }

 /* Ramane strict tabelul desktop. Cardurile mobile nu mai pot rezerva inaltime la print. */
 html body .app-shell > main.main > section.page > .orders-page > :not(.orders-list-shell),
 html body .app-shell > main.main > section.page > .orders-page > .orders-list-shell.is-compact > .orders-compact-list,
 html body .app-shell > main.main > section.page > .orders-page > .orders-list-shell.is-extended > .orders-extended-list,
 html body .app-shell > main.main > section.page > .orders-page > .orders-list-shell > .orders-compact-list,
 html body .app-shell > main.main > section.page > .orders-page > .orders-list-shell > .orders-extended-list {
 display: none !important;
 }

 html body .app-shell > main.main > section.page > .orders-page > .orders-list-shell > .orders-desktop-table,
 html body .app-shell > main.main > section.page > .orders-page > .orders-list-shell > .orders-desktop-table.table-wrap,
 html body .app-shell > main.main > section.page > .orders-page > .orders-list-shell > .orders-desktop-table.card {
 display: block !important;
 position: static !important;
 width: 100% !important;
 min-height: 0 !important;
 height: auto !important;
 margin: 0 !important;
 padding: 0 !important;
 overflow: visible !important;
 border: 0 !important;
 border-radius: 0 !important;
 background: transparent !important;
 box-shadow: none !important;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 {
 display: table !important;
 width: 100% !important;
 margin: 0 !important;
 border-collapse: collapse !important;
 border-spacing: 0 !important;
 table-layout: auto !important;
 font-size: 8.5pt !important;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 thead {
 display: table-header-group !important;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 tbody {
 display: table-row-group !important;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 tr {
 break-inside: avoid;
 page-break-inside: avoid;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 th {
 padding: 2.3mm 2mm !important;
 border-top: 1px solid #cbd5e1 !important;
 border-bottom: 1px solid #94a3b8 !important;
 background: #f1f5f9 !important;
 color: #334155 !important;
 font-size: 7.5pt !important;
 font-weight: 900 !important;
 letter-spacing: .025em;
 text-transform: uppercase;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 td {
 padding: 2.2mm 2mm !important;
 border-bottom: 1px solid #dbe3ef !important;
 color: #0f172a !important;
 vertical-align: middle !important;
 background: #ffffff !important;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 .order-day-separator-row,
 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 .order-day-separator-row td,
 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 .order-day-separator-cell {
 display: none !important;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 .order-row > td {
 animation: none !important;
 transform: none !important;
 opacity: 1 !important;
 filter: none !important;
 will-change: auto !important;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 .order-desktop-id-cell {
 min-width: 25mm;
 padding-left: 4mm !important;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 .order-desktop-accent {
 width: 1.3mm !important;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 .tiny-text,
 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 .muted {
 color: #64748b !important;
 font-size: 7.5pt !important;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 .order-desktop-status-pill,
 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 .order-schedule-chip,
 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 .order-delay-badge {
 max-width: none !important;
 min-height: 0 !important;
 padding: 1mm 1.6mm !important;
 border-width: 1px !important;
 box-shadow: none !important;
 font-size: 7.5pt !important;
 line-height: 1.15 !important;
 white-space: normal !important;
 }

 html body .app-shell > main.main > section.page > .orders-page .orders-table-alpha36 a {
 color: inherit !important;
 text-decoration: none !important;
 }
}

/* Foldable/tablet: Compact uses the existing desktop columns on a wide screen.
   Focus/Extins and the closed-phone layout keep their mobile presentations. */
@media screen and (min-width: 800px) and (max-width: 900px) {
 .orders-page .orders-list-shell.is-compact:not(.is-focus) > .orders-compact-list {
 display: none !important;
 }

 .orders-page .orders-list-shell.is-compact:not(.is-focus) > .orders-desktop-table.is-compact {
 display: block !important;
 }

 .orders-page .orders-desktop-table.is-compact .order-row > td {
 height: 44px;
 padding-left: 8px;
 padding-right: 8px;
 }

 .orders-page .orders-desktop-table.is-compact .order-desktop-status-pill {
 max-width: 180px;
 white-space: normal;
 overflow-wrap: anywhere;
 }
}