/* Compact navy glass catalogue, aligned with the Bright Link workspace. */
.catalog-workspace {
  --catalog-blue: #71aaff;
  --catalog-cyan: #63e1f3;
  --catalog-purple: #b5a1f3;
  --catalog-green: #78ddbd;
  --catalog-amber: #efc578;
  --catalog-red: #fa9dab;
  --catalog-border: rgba(141, 193, 248, .15);
  --catalog-glass: linear-gradient(135deg, rgba(27, 51, 85, .34), rgba(13, 28, 50, .44));
  position: relative;
  isolation: isolate;
  max-width: 1500px;
  margin: auto;
  font-size: 0.875rem;
}
.catalog-workspace::before {
  content: '';
  position: absolute;
  z-index: -1;
  pointer-events: none;
  inset: 34px -15px auto;
  height: 580px;
  background: radial-gradient(ellipse at 12% 8%, rgba(16, 57, 244, .12), transparent 54%), radial-gradient(ellipse at 92% 39%, rgba(16, 246, 255, .055), transparent 51%);
}
.catalog-workspace .page-head { margin-bottom: 18px; align-items: center; }
.catalog-workspace .page-head .eyebrow:empty,
.catalog-workspace .page-head .sub:empty { display: none; }
.catalog-workspace .page-head h1 { font-size: 1.505rem; line-height: 1.3; letter-spacing: -.5px; }
.catalog-workspace .page-head .btn { min-height: 34px; padding: 8px 12px; font-size: 0.7525rem; }
.catalog-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 18px; }
.catalog-summary-card,
.catalog-panel,
.catalog-category-card {
  background: var(--catalog-glass);
  border: 1px solid var(--catalog-border);
  box-shadow: inset 0 1px 0 rgba(213, 234, 255, .065), 0 8px 24px rgba(2, 8, 24, .16);
  backdrop-filter: blur(24px) saturate(135%);
  -webkit-backdrop-filter: blur(24px) saturate(135%);
}
.catalog-summary-card { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 13px; min-height: 72px; }
.catalog-summary-card > .ui-icon { width: 34px; height: 34px; padding: 8px; border: 1px solid #72b8ff24; border-radius: 10px; background: #1039f415; color: var(--catalog-blue); }
.catalog-summary-card.cyan > .ui-icon { color: var(--catalog-cyan); background: #10f6ff0b; border-color: #10f6ff23; }
.catalog-summary-card span { display: block; font-size: 0.7525rem; color: #9eafc9; margin-bottom: 3px; }
.catalog-summary-card b { display: block; font-size: 1.3825rem; line-height: 1.15; font-weight: 600; color: #e7f2ff; }
.catalog-tabs { display: flex; gap: 6px; margin: 0 0 16px; padding-bottom: 10px; border-bottom: 1px solid var(--catalog-border); }
.catalog-tabs button { display: flex; align-items: center; gap: 7px; background: transparent; color: #9db2ce; border: 1px solid transparent; padding: 8px 12px; border-radius: 9px; font-size: 0.875rem; cursor: pointer; }
.catalog-tabs button .ui-icon { width: 16px; height: 16px; }
.catalog-tabs button.active { background: linear-gradient(115deg, #1039f423, #10f6ff0b); border-color: #72b8ff2b; color: #c9f6ff; box-shadow: inset 0 1px 0 #def8ff0b; }
.catalog-tabs button span { color: #a9c9e4; background: #8abfff12; font-size: 0.69125rem; border-radius: 5px; padding: 2px 6px; }
.catalog-panel { border-radius: 14px; overflow: hidden; }
.catalog-toolbar { display: grid; grid-template-columns: minmax(200px, 1fr) minmax(150px, 190px) minmax(150px, 175px); align-items: end; gap: 12px; padding: 16px; }
.catalog-toolbar > label > span { display: block; font-size: 0.7525rem; color: #9eb4d0; margin-bottom: 6px; }
.catalog-toolbar select,
.catalog-toolbar input { width: 100%; min-height: 37px; font-size: 0.875rem; background: #08182c42; border: 1px solid #8dbcf229; border-radius: 9px; color: #d9eaff; padding: 8px 10px; }
.catalog-toolbar input::placeholder { color: #8aa2c3; opacity: 1; }
.catalog-search { position: relative; display: block; }
.catalog-search input { padding-left: 36px; }
.catalog-search > .ui-icon { position: absolute; left: 12px; top: 11px; color: #65cfe5; width: 16px; height: 16px; }
.catalog-list-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 16px; border-top: 1px solid #a6c6fa10; border-bottom: 1px solid #a6c6fa14; background: #85bfff04; font-size: 0.7525rem; color: #9eb5d2; }
.catalog-pagination { display: flex; align-items: center; gap: 10px; }
.catalog-pagination button { border: 1px solid #8ab5f427; border-radius: 7px; background: #81bfff07; color: #c3ddf7; padding: 5px 9px; font-size: 0.7525rem; min-height: 29px; cursor: pointer; }
.catalog-pagination button:disabled { opacity: .35; cursor: default; }
.catalog-table thead { background: transparent; }
.catalog-table { width: 100%; table-layout: fixed; border-collapse: collapse; }
.catalog-table th { padding: 11px 16px; text-align: left; color: #90aacb; font-size: 0.69125rem; font-weight: 550; letter-spacing: .05em; border-bottom: 1px solid #aacbff15; background: #09172c25; }
.catalog-table th:first-child { width: 35%; }
.catalog-table th:nth-child(2) { width: 18%; }
.catalog-table th:nth-child(3) { width: 21%; }
.catalog-table th:nth-child(4) { width: 10%; }
.catalog-table th:last-child { width: 16%; }
.catalog-table td { padding: 11px 16px; border-bottom: 1px solid #a0bfee10; font-size: 0.875rem; overflow-wrap: anywhere; vertical-align: middle; }
.catalog-table tbody tr:last-child td { border-bottom: 0; }
.catalog-table tbody tr { transition: background .15s ease; }
.catalog-table tbody tr:hover { background: #78baff07; }
.catalog-table td .actions { display: flex; flex-wrap: wrap; gap: 6px; }
.catalog-table .btn.tiny,
.catalog-category-card .btn.tiny { font-size: 0.7525rem; padding: 6px 9px; border-radius: 7px; min-height: 29px; }
.catalog-table .btn.cyan { background: #10f6ff09; border-color: #10f6ff28; color: #77dfec; }
.catalog-table .btn.danger,
.catalog-category-card .btn.danger { background: #f7728908; border-color: #ff9dab22; color: #ed99a8; }
.catalog-product-cell { display: flex; align-items: center; gap: 11px; min-width: 0; }
.catalog-product-cell > div { min-width: 0; }
.catalog-product-cell b { display: block; color: #e0ebfc; font-size: 0.875rem; line-height: 1.45; font-weight: 550; }
.catalog-product-cell small { display: block; margin-top: 3px; font-size: 0.69125rem; letter-spacing: .015em; color: #8299b9; }
.product-image-surface { display: flex; align-items: center; justify-content: center; overflow: hidden; flex-shrink: 0; background: linear-gradient(140deg, #3a7bb829, #19355a42); border: 1px solid #8fc0f128; border-radius: 9px; }
.product-photo { width: 44px; height: 44px; }
.product-image-surface > img,
.product-image-surface > svg:not(.ui-icon) { width: 100%; height: 100%; object-fit: contain; display: block; }
.catalog-product-cell .product-photo > img { object-fit: cover; object-position: center; }
.product-image-surface > .ui-icon { width: 25px; height: 25px; color: #8da9c8; }
.pos-product-art.product-image-surface { width: 100%; border-radius: 0; display: flex; }
.pos-register .pos-product-art > img[src^="/catalogue/thumbs/"] { mix-blend-mode: multiply; }
/* Invoice and quotation thumbnails fill their own tile, without changing catalogue or POS photography. */
.sales-document .sales-product-image { display: block; width: 46px; height: 46px; min-width: 46px; flex: 0 0 46px; aspect-ratio: 1; object-fit: cover; object-position: center; overflow: hidden; border: 1px solid #d5e1ef; background: #fff; border-radius: 5px; }
.sales-document .sales-product-image.product-image-surface { display: flex; }
.sales-document .sales-product-image > img,
.sales-document .sales-product-image > svg:not(.ui-icon) { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; }
.catalog-price { font-size: 0.875rem; font-weight: 550; color: #82d5bf; font-variant-numeric: tabular-nums; white-space: nowrap; line-height: 1.5; }
.catalog-stock { font-size: 0.93625rem; font-weight: 550; color: #82d5bf; font-variant-numeric: tabular-nums; }
.catalog-stock.low { color: var(--catalog-amber); }
.catalog-stock.is-empty { color: var(--catalog-red); }
.catalog-service { font-size: 0.81375rem; color: #a3bcd9; white-space: nowrap; }
.catalog-chip { display: inline-flex; align-items: center; border-radius: 6px; padding: 4px 7px; font-size: 0.69125rem; line-height: 1.4; border: 1px solid color-mix(in srgb, currentColor 22%, transparent); background: color-mix(in srgb, currentColor 6%, transparent); }
.catalog-color-blue { color: #71aaff; }
.catalog-color-purple { color: #b5a1f3; }
.catalog-color-cyan { color: #63ddeb; }
.catalog-color-green { color: #72d6b5; }
.catalog-color-amber { color: #efc578; }
.catalog-color-red { color: #fa9dab; }
.catalog-status { display: inline-block; font-size: 0.69125rem; border-radius: 5px; padding: 2px 6px; margin-top: 4px; }
.catalog-status.removed { color: #ffa1af; background: #e44b6816; }
.catalog-status.paused { color: #f2cb76; background: #e4ac3c16; }
.catalog-category-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 300px)); gap: 12px; align-items: start; }
.catalog-category-card { border-radius: 13px; padding: 15px; position: relative; overflow: hidden; transition: border-color .18s, background .18s, box-shadow .18s; }
.catalog-category-card::after { content: ''; position: absolute; pointer-events: none; inset: 0 18% auto; height: 1px; background: linear-gradient(90deg, transparent, #bde5ff26, transparent); }
.catalog-category-card:hover { border-color: #71b8ee38; box-shadow: inset 0 1px 0 #d4efff0b, 0 9px 24px #02081726; }
.catalog-category-heading { display: flex; align-items: center; gap: 11px; }
.catalog-category-heading > div { min-width: 0; }
.catalog-category-icon { display: flex; align-items: center; justify-content: center; width: 35px; height: 35px; flex-shrink: 0; border: 1px solid color-mix(in srgb, currentColor 19%, transparent); background: color-mix(in srgb, currentColor 7%, transparent); border-radius: 9px; }
.catalog-category-icon .ui-icon { width: 17px; height: 17px; }
.catalog-category-card h2 { font-size: 0.93625rem; font-weight: 550; line-height: 1.4; letter-spacing: -.1px; margin: 0 0 3px; color: #e0edff; overflow-wrap: anywhere; }
.catalog-category-heading small { font-size: 0.7525rem; color: #8fa8c8; }
.catalog-category-card .actions { justify-content: flex-end; gap: 6px; margin-top: 13px; }
.catalog-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 30px; color: #9eb7d5; }
.catalog-editor { display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: 22px; font-size: 0.875rem; }
.catalog-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.catalog-field { display: block; margin-bottom: 16px; color: #d0e0f7; }
.catalog-field > span { display: block; font-size: 0.81375rem; margin-bottom: 7px; }
.catalog-field em { font-style: normal; color: #f29eaf; }
.catalog-field input,
.catalog-field select,
.catalog-field textarea { font-size: 0.875rem; min-height: 38px; padding: 9px 10px; width: 100%; border-radius: 9px; border: 1px solid #91b7f230; background: #0b20385c; color: #e9f3ff; }
.catalog-field textarea { resize: vertical; min-height: 106px; line-height: 1.6; }
.catalog-options { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; padding-top: 3px; }
.catalog-toggle { display: flex; align-items: center; gap: 9px; font-size: 0.81375rem; line-height: 1.5; color: #acbfd9; cursor: pointer; }
.catalog-toggle input { appearance: auto; width: 16px; height: 16px; min-height: 16px; accent-color: #44c6ef; flex-shrink: 0; }
.catalog-image-editor { padding: 15px; border-radius: 13px; border: 1px solid #95bff729; background: var(--catalog-glass, linear-gradient(145deg, #1b33572b, #0d20352b)); align-self: start; backdrop-filter: blur(16px); }
.catalog-image-preview { width: 100%; height: 160px; border-radius: 10px; margin-bottom: 16px; }
.catalog-image-editor h3 { font-size: 0.875rem; margin: 0 0 11px; color: #dceaff; }
.catalog-image-upload { display: flex; position: relative; align-items: center; justify-content: center; gap: 8px; padding: 10px; border: 1px dashed #7ac5ec5c; border-radius: 9px; overflow: hidden; color: #90dcff; background: #10f6ff09; font-size: 0.81375rem; cursor: pointer; }
.catalog-image-upload input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.catalog-image-editor > small { display: block; text-align: center; color: #8ea8c8; font-size: 0.69125rem; margin: 8px 0 16px; }
.catalog-colour-picker { border: 0; padding: 0; margin: 18px 0 8px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.catalog-colour-picker legend { font-size: 0.81375rem; color: #aebfda; margin-bottom: 11px; }
.catalog-colour-picker label { display: flex; align-items: center; gap: 8px; padding: 10px; border: 1px solid color-mix(in srgb, currentColor 24%, transparent); border-radius: 9px; cursor: pointer; background: color-mix(in srgb, currentColor 5%, transparent); font-size: 0.81375rem; }
.catalog-colour-picker input { appearance: auto; width: 15px; height: 15px; accent-color: currentColor; min-height: 15px; }
.catalog-delete-name { font-size: 1.05rem; font-weight: 550; margin-bottom: 18px; }
.catalog-workspace button:focus-visible,
.catalog-workspace input:focus-visible,
.catalog-workspace select:focus-visible,
.catalog-editor input:focus-visible,
.catalog-editor select:focus-visible { outline: 2px solid #6edaf3; outline-offset: 3px; }
.catalog-workspace button { transition: background .15s, border-color .15s; }
.catalog-workspace .btn.primary { background: linear-gradient(115deg, #1039f4cf, #1268daac); border-color: #629af443; box-shadow: inset 0 1px 0 #cce3ff1a, 0 5px 14px #1039f414; }
.catalog-workspace .btn.primary:hover { filter: brightness(1.1); }
@media (max-width: 1100px) {
  .catalog-table td, .catalog-table th { padding: 11px 12px; }
  .catalog-toolbar { grid-template-columns: minmax(180px, 1fr) 150px 150px; gap: 10px; }
  .catalog-table th:first-child { width: 34%; }
  .catalog-table th:last-child { width: 17%; }
  .catalog-table .btn.tiny { padding: 5px 7px; }
}
@media (max-width: 780px) {
  .catalog-summary { gap: 8px; }
  .catalog-summary-card { padding: 11px; gap: 8px; }
  .catalog-summary-card > .ui-icon { display: none; }
  .catalog-summary-card b { font-size: 1.2688rem; }
  .catalog-toolbar { grid-template-columns: 1fr 1fr; padding: 13px; }
  .catalog-search { grid-column: 1 / -1; }
  .catalog-table thead { display: none; }
  .catalog-table, .catalog-table tbody, .catalog-table tr, .catalog-table td { display: block; width: auto; }
  .catalog-table tr { padding: 14px; border-bottom: 1px solid #aacbff19; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .catalog-table td { padding: 0; border: 0 !important; }
  .catalog-table td:first-child, .catalog-table td:last-child { grid-column: 1 / -1; }
  .catalog-table td:not(:first-child):not(:last-child)::before { content: attr(data-label); display: block; font-size: 0.69125rem; color: #849ebf; margin-bottom: 4px; }
  .catalog-table td:nth-child(4) { display: flex; align-items: center; gap: 9px; }
  .catalog-editor { grid-template-columns: 1fr; }
  .catalog-image-editor { width: 100%; max-width: none; display: grid; grid-template-columns: 145px 1fr; gap: 11px 16px; align-items: start; }
  .catalog-image-editor #catalog-image-preview { grid-row: 1 / 6; }
  .catalog-image-preview { height: 145px; margin: 0; }
  .catalog-image-editor h3, .catalog-image-editor > small, .catalog-image-editor .catalog-field { margin: 0; }
  .catalog-list-bar { padding: 10px 13px; flex-wrap: wrap; }
}
@media (max-width: 500px) {
  .catalog-workspace::before { inset-inline: 0; }
  .catalog-summary-card { padding: 10px 8px; }
  .catalog-summary-card span { line-height: 1.4; }
  .catalog-form-grid { grid-template-columns: 1fr; gap: 0; }
  .catalog-options { grid-template-columns: 1fr; }
  .catalog-image-editor { display: block; }
  .catalog-image-preview { height: 165px; margin-bottom: 16px; }
  .catalog-image-editor h3 { margin-bottom: 11px; }
  .catalog-image-editor > small { margin: 8px 0 16px; }
  .catalog-image-editor .catalog-field { margin-bottom: 16px; }
  .catalog-toolbar { grid-template-columns: 1fr; }
  .catalog-search { grid-column: auto; }
  .catalog-category-grid { grid-template-columns: minmax(0, 1fr); }
  .catalog-tabs button { padding: 8px 10px; }
  .layout:has(.catalog-workspace) .topbar { height: auto; min-height: 62px; padding: 10px 12px; gap: 8px; }
  .layout:has(.catalog-workspace) .topbar .searchbox { display: none; }
  .layout:has(.catalog-workspace) .topright { flex: 1; min-width: 0; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
  .layout:has(.catalog-workspace) .topright .btn { font-size: 0.7525rem; padding: 8px 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .catalog-workspace button, .catalog-category-card, .catalog-table tbody tr { transition: none; }
}

.product-image-surface{position:relative}.product-image-surface>img{transition:opacity .16s ease}.product-image-surface.image-loading>img{opacity:0}.product-image-surface.image-loading::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,#82c9f52d 48%,transparent 75%);transform:translateX(-100%);animation:catalog-image-shimmer 1.1s ease-in-out infinite}.product-image-surface.image-loading::before{content:"";width:23px;height:23px;border:2px solid #8fc5f066;border-radius:7px;position:absolute;transform:rotate(-12deg);background:#69b6e518}@keyframes catalog-image-shimmer{to{transform:translateX(100%)}}@media(prefers-reduced-motion:reduce){.product-image-surface.image-loading::after{animation:none}.product-image-surface>img{transition:none}}