@charset "UTF-8";
/* ToyWholesaleHub - wholesale toy catalogue. Presentation layer only. */

/* Empty media slots: reserved area, no placeholder image, no broken icon, no upload hint. */
.empty-media{background:#eef2f6;border:1px solid #e2e8f0}
.product-card .product-image.empty-media,.category-card .image.empty-media,.product-display.empty-media{display:block;background:#eef2f6}
.empty-media.hero-slot{background:#172133;border:0}

/* Catalogue 01 photos are 743x460 (1.6:1). Show at or below native size, never upscale. */
.product-card .product-image{height:auto;aspect-ratio:743/460;padding:10px}
.product-card .product-image img,.product-display img{width:100%;height:auto;max-width:743px;object-fit:contain;mix-blend-mode:normal;display:block;margin-inline:auto}
.product-display{aspect-ratio:743/460;padding:12px;background:#eef2f6}
.spec-table .spec-group th{background:#e8eef6;color:#0f172a;font-weight:600;font-size:11px;letter-spacing:.07em;text-transform:uppercase;text-align:left;padding:10px 14px;border-bottom:1px solid #dbe3ef}

.account-bar{background:#0f2942;color:#dbe7f3;font-size:12px;letter-spacing:.02em}
.account-bar .container{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:9px;padding-bottom:9px;flex-wrap:wrap}
.account-bar a{color:#e2bf69;text-decoration:underline;text-underline-offset:3px}
.account-bar .account-meta{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.account-bar button{background:transparent;border:1px solid #46627f;color:#dbe7f3;padding:5px 12px;border-radius:3px;font-size:11px}

.notice{background:#eef4fb;border-left:3px solid #1d4ed8;padding:14px 18px;margin:0 0 24px;font-size:14px;color:#334155;line-height:1.65}
.notice.warn{background:#fff7e8;border-left-color:#c8a24a;color:#7a5b16}
.notice strong{font-weight:600}
.notice a{color:#1d4ed8;text-decoration:underline;text-underline-offset:3px}

.price-slot{min-height:30px;margin:12px 0 14px;font-size:14px}
.price-value{font-weight:600;color:#0f172a;font-size:19px;letter-spacing:-.02em}
.price-value small{font-size:11px;font-weight:400;color:#64748b;letter-spacing:0;margin-left:4px}
.carton-price{display:block;margin-top:3px;font-size:12px;font-weight:600;color:#a8741f;letter-spacing:0}
.price-locked{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:#475569;min-height:34px;padding:4px 0}
.price-locked a{color:#1d4ed8;text-decoration:underline;text-underline-offset:3px;display:inline-flex;align-items:center;min-height:34px}
.price-locked .lock{width:13px;height:13px;border:1.5px solid #64748b;border-radius:2px;display:inline-block;position:relative;flex:0 0 auto}
.price-locked .lock:before{content:"";position:absolute;left:2px;top:-6px;width:7px;height:7px;border:1.5px solid #64748b;border-bottom:0;border-radius:5px 5px 0 0}

.card-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid #e6ecf3}
.card-actions .text-link{font-size:12px;color:#1d4ed8}
.card-actions .button{min-height:38px;padding:8px 14px;font-size:12px;gap:8px}
.card-actions [hidden]{display:none!important}

/* Product card click areas: desktop = image + title, mobile = Details button only. */
.card-figure{display:block;color:inherit;text-decoration:none}
.card-figure:hover .product-image,.card-figure:focus-visible .product-image{background:#e3eaf4;outline:2px solid #1d4ed8;outline-offset:-2px}
.card-title{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:color .15s,border-color .15s}
.card-title:hover,.card-title:focus-visible{color:#1d4ed8;border-bottom-color:#1d4ed8}
.card-actions .details-button{display:none;min-height:38px;padding:8px 14px;font-size:12px;background:#111827;color:#fff}
@media(max-width:767px){
  .card-figure,.card-title{pointer-events:none;cursor:default;color:inherit;border-bottom:0}
  .card-actions .details-button{display:inline-flex}
}
@media(min-width:768px){
  .card-actions:has([data-quote-add][hidden]){display:none}
}

.qty-input{width:82px;height:38px;border:1px solid #dbe3ef;border-radius:3px;padding:6px 9px;background:#fff;color:#0f172a}

.catalogue-tools{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:26px 0 22px}
.catalogue-tools .search-input{max-width:420px}
.pager{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;margin:38px 0 10px}
.pager button{min-height:42px;min-width:42px;padding:8px 14px;background:#fff;border:1px solid #dbe3ef;border-radius:3px;font-size:13px;color:#334155}
.pager button[aria-current=page]{background:#111827;border-color:#111827;color:#fff}
.pager button:disabled{opacity:.4;cursor:default}
.pager a,.pager .pager-step{display:inline-flex;align-items:center;justify-content:center;min-height:42px;min-width:42px;padding:8px 14px;background:#fff;border:1px solid #dbe3ef;border-radius:3px;font-size:13px;color:#334155;text-decoration:none}
.pager a:hover{border-color:#111827;color:#111827}
.pager a[aria-current=page]{background:#111827;border-color:#111827;color:#fff}
.pager .pager-step{color:#cbd5e1}
.subcategory-links{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 26px}
.subcategory-links .eyebrow{width:100%;margin:0 0 2px}
.subcategory-links a{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;background:#fff;border:1px solid #dbe3ef;border-radius:999px;font-size:13px;color:#334155;text-decoration:none}
.subcategory-links a:hover{border-color:#111827;color:#111827}
.subcategory-links .sub-count{font:11px ui-monospace,Menlo,monospace;color:#94a3b8}
.pager .pager-info{font:12px ui-monospace,Menlo,monospace;color:#64748b;margin:0 10px}

.spec-table{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px}
.spec-table th,.spec-table td{text-align:left;padding:12px 14px;border-bottom:1px solid #dbe3ef;vertical-align:top}
.spec-table th{width:34%;color:#64748b;font-weight:500;background:#f8fafc}
.spec-table td{overflow-wrap:anywhere}

.form-card{background:#fff;border:1px solid #dbe3ef;padding:32px;max-width:620px}
.form-card h2{font-size:26px;margin-bottom:10px}
.form-card .field{margin:18px 0}
.form-card label{display:block;font-size:12px;font-weight:600;color:#334155;margin-bottom:7px;text-transform:uppercase;letter-spacing:.06em}
.form-card input,.form-card select,.form-card textarea{width:100%;height:46px;padding:10px 13px;border:1px solid #dbe3ef;border-radius:3px;background:#fff;color:#0f172a}
.form-card textarea{height:96px;resize:vertical}
.form-card .button{min-height:46px}
.form-status{margin-top:16px;font-size:13px;line-height:1.6}
.form-status.error{color:#b42318}
.form-status.ok{color:#166534}

.quote-table{width:100%;border-collapse:collapse;background:#fff;font-size:13px}
.quote-table th{background:#111827;color:#fff;text-align:left;padding:13px 12px;font-size:11px;text-transform:uppercase;letter-spacing:.07em;font-weight:600}
.quote-table td{padding:12px;border-bottom:1px solid #e6ecf3;vertical-align:middle;overflow-wrap:anywhere}
.quote-table td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.quote-table tfoot td{background:#f1f5f9;font-weight:600;border-bottom:0}
.quote-actions{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0}
.quote-actions .button{min-height:48px}
.quote-actions .button.secondary{background:#fff;color:#111827;border:1px solid #dbe3ef}
.quote-actions .button.whatsapp{background:#25D366;color:#063d1b}
.empty-state{border:1px dashed #cbd5e1;background:#fff;padding:56px 28px;text-align:center;color:#64748b}
.empty-state h2{font-size:22px;color:#0f172a;margin-bottom:10px}
.empty-state p{margin-bottom:0}

.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.admin-panel{background:#fff;border:1px solid #dbe3ef;padding:28px}
.admin-panel h2{font-size:22px;margin-bottom:8px}
.admin-panel .hint{font-size:12px;color:#64748b;margin-bottom:20px;line-height:1.6}
.admin-table{width:100%;border-collapse:collapse;font-size:12px;margin-top:18px}
.admin-table th,.admin-table td{text-align:left;padding:9px 8px;border-bottom:1px solid #e6ecf3;vertical-align:top}
.admin-table th{color:#64748b;font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-size:10px}
.admin-table .mini{border:1px solid #dbe3ef;background:#fff;padding:5px 9px;font-size:11px;border-radius:3px;color:#334155}
.admin-table .mini.danger{color:#b42318;border-color:#f0c2bd}
.admin-row-form{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;margin-bottom:8px}
.admin-row-form .field{flex:1 1 130px;margin:0}
.admin-row-form label{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:#64748b;margin-bottom:5px}
.admin-row-form input,.admin-row-form select{width:100%;height:42px;padding:8px 10px;border:1px solid #dbe3ef;border-radius:3px;background:#fff}
.admin-row-form button{height:42px;padding:8px 16px;background:#1d4ed8;color:#fff;border:0;border-radius:3px;font-size:13px}

.quote-float{position:fixed;right:24px;bottom:104px;z-index:40;display:none;align-items:center;gap:10px;min-height:52px;padding:12px 20px;background:#111827;color:#fff;border-radius:999px;box-shadow:0 10px 28px #0f172a33;font-size:13px}
.quote-float.is-visible{display:inline-flex}
.quote-float .count{background:#c8a24a;color:#111827;border-radius:999px;min-width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}
.wyd-whatsapp-float{bottom:28px}
@media(max-width:767px){.quote-float{right:14px;bottom:92px;min-height:48px;padding:10px 16px;font-size:12px}.admin-grid{grid-template-columns:1fr}.quote-table{font-size:12px}.quote-table th,.quote-table td{padding:9px 7px}}

.step-list{counter-reset:step;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:36px}
.step-list li{list-style:none;border-top:2px solid #c8a24a;padding-top:18px}
.step-list li:before{counter-increment:step;content:"0" counter(step);display:block;font:12px ui-monospace,Menlo,monospace;color:#8a6412;margin-bottom:18px}
.step-list h3{font-size:18px;margin-bottom:8px}
.step-list p{font-size:13px;margin:0}
@media(max-width:767px){.step-list{grid-template-columns:1fr 1fr}}

/* ---------- audit fixes: contrast, footer brand, photo walls, detail extras ---------- */
/* Screen-reader-only text must stay hidden: table captions were rendering as a bar. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Category strip: the "more categories" note was crushed into a 95px column. */
.category-strip .strip-inner{align-items:center}
.category-strip .strip-inner>span{max-width:none;white-space:nowrap;flex:0 0 auto}
.category-strip .strip-inner>span.strip-note{white-space:normal;flex:1 1 260px;text-align:right;font-size:11px;letter-spacing:.01em;text-transform:none;line-height:1.5}
@media(max-width:767px){.category-strip .strip-inner>span.strip-note{text-align:left;flex-basis:100%;margin-top:6px}}

/* A single visible category should read as a wide feature card, not a lonely third. */
.category-grid:has(.category-card:only-child){grid-template-columns:minmax(0,1fr)}
.category-grid .category-card:only-child{display:grid;grid-template-columns:1.15fr 1fr;align-items:stretch}
.category-grid .category-card:only-child .image{height:100%;min-height:320px;padding:0;overflow:hidden}
.category-grid .category-card:only-child .image img{width:100%;height:100%;object-fit:cover;display:block}
.category-grid .category-card:only-child .card-copy{display:flex;flex-direction:column;justify-content:center}
@media(max-width:767px){.category-grid .category-card:only-child{grid-template-columns:1fr}.category-grid .category-card:only-child .image{height:240px;min-height:0}}

/* Gold on white measured 2.41:1 at 10-12px; darken text uses only, keep the button fill. */
.eyebrow.gold{color:#8a6412}
/* .footer-brand painted a white plate while the text was white (1.0:1). Text brand, no plate. */
.site-footer .footer-brand{background:transparent;color:#fff;padding:0;margin-bottom:18px;font-size:15px;font-weight:700;letter-spacing:-.03em;display:inline-block;min-height:34px}
.site-footer .footer-brand:hover{color:#e2bf69}

.cta-band h2,.site-footer h3{color:#fff}
.site-footer .footer-links a{color:#cbd5e1}
.site-footer .footer-links a:hover{color:#fff}

/* Photo walls built from real catalogue photos - replaces the empty hero and section blocks. */
.photo-wall{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%}
.photo-wall .wall-cell{display:block;overflow:hidden;border-radius:3px;background:#fff}
.photo-wall img{width:100%;height:auto;aspect-ratio:743/460;object-fit:cover;display:block;transition:transform .35s ease}
.photo-wall .wall-cell:hover img{transform:scale(1.03)}
.hero-art .photo-wall{padding:26px 0 26px 26px}
.section-wall{align-self:stretch}
@media(max-width:767px){.hero-art .photo-wall{padding:20px 0}  .hero-art{min-height:0;align-items:flex-start}}

.strip-note{font-size:11px;color:#64748b;letter-spacing:.02em}
.muted-note{font-size:12px;color:#64748b;margin-top:18px;line-height:1.7}
.contact-number{font-size:22px;font-weight:600;color:#111827}

.glance-card{background:#0b1220;color:#fff;padding:34px 32px;border-radius:4px}
.glance-card h3{color:#fff;font-size:20px;margin-bottom:20px}
.glance-card dl{display:grid;grid-template-columns:1fr auto;gap:0;margin:0 0 18px}
.glance-card dt{font-size:12px;color:#cbd5e1;padding:11px 0;border-bottom:1px solid #1e293b}
.glance-card dd{margin:0;font-size:14px;font-weight:600;text-align:right;padding:11px 0;border-bottom:1px solid #1e293b;font-variant-numeric:tabular-nums}
.glance-note{font-size:11px;color:#94a3b8;margin:0;line-height:1.6}

.page-hero--product h1{font-size:clamp(26px,2.9vw,40px);line-height:1.15;letter-spacing:-.03em}
.detail-nav{display:flex;gap:16px;margin:34px 0 0}
.detail-nav>span{flex:1 1 0}
.detail-nav-link{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:5px;border:1px solid #dbe3ef;padding:14px 18px;border-radius:3px;background:#fff;min-height:64px}
.detail-nav-link:hover,.detail-nav-link:focus-visible{border-color:#1d4ed8;background:#f8fafc}
.detail-nav-link span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#64748b}
.detail-nav-link strong{font-size:14px;font-weight:500;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.detail-nav-link.next{text-align:right;align-items:flex-end}
@media(max-width:767px){.detail-nav{flex-direction:column}.detail-nav-link.next{text-align:left;align-items:flex-start}}

/* Photo at native size only: the dialog never scales past 743x460. */
.zoom-target{display:block;cursor:zoom-in}
.zoom-dialog{border:0;padding:16px;background:#fff;max-width:min(95vw,800px);border-radius:4px}
.zoom-dialog::backdrop{background:#0b1220cc}
.zoom-dialog img{max-width:100%;height:auto;margin:auto}
.zoom-caption{font-size:12px;color:#475569;text-align:center;margin:10px 0 0}
.zoom-close{position:absolute;top:6px;right:8px;border:0;background:#111827;color:#fff;width:32px;height:32px;border-radius:999px;font-size:18px;line-height:1}

.product-grid.compact{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1000px){.product-grid.compact{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:767px){.product-grid.compact{grid-template-columns:1fr}.photo-wall{grid-template-columns:1fr 1fr;gap:8px}}

/* Desktop navigation did not fit between 768px and ~900px: collapse to the menu there too. */
@media(min-width:768px) and (max-width:900px){
  .menu-toggle{display:block}
  .site-nav{display:none;position:absolute;top:84px;left:0;right:0;background:#fff;border-bottom:1px solid #dbe3ef;padding:16px 24px;flex-direction:column;align-items:stretch;gap:2px}
  .site-nav.is-open{display:flex}
  .site-nav>a{padding:10px}
}

/* 手机胶囊导航：五个主要入口直接可见，窄屏只让导航条自己横滑。
   汉堡抽屉仅保留在 768-900px，那里桌面导航放不下。 */
@media(max-width:767px){
  .site-header .header-inner{height:auto;min-height:0;flex-wrap:wrap;gap:8px;padding-top:9px;padding-bottom:0}
  .site-header .brand{min-height:44px}
  .site-header .menu-toggle{display:none!important}
  .site-header .site-nav{display:flex;position:static;order:3;width:100%;margin:0;flex-direction:row;align-items:center;gap:7px;padding:0 0 10px;background:transparent;border:0;box-shadow:none;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .site-header .site-nav::-webkit-scrollbar{display:none}
  .site-header .site-nav>a{flex:0 0 auto;min-height:44px;padding:0 15px;justify-content:center;border:0;border-bottom:0;border-radius:999px;background:#f1f5f9;color:#475569;font-size:12.5px;font-weight:600;line-height:1.2;white-space:nowrap}
  .site-header .site-nav>a[aria-current=page]{background:#0f2544;color:#fff;font-weight:700}
  .site-header .site-nav>a[aria-current=page]:after{display:none}
  .site-header .site-nav>a:hover{background:#e2e8f0;color:#0f2544}
  .site-header .site-nav>a[aria-current=page]:hover{background:#0f2544;color:#fff}
  .site-header .site-nav>a:focus-visible{outline:2px solid #1d4ed8;outline-offset:2px}
}

/* The contact page is the conversation itself; the floating button only covers its form. */
body[data-page="contact"] .wyd-whatsapp-float{display:none}

/* Buyer questions on category pages. Question-shaped headings followed by
   self-contained answers are the unit answer engines lift most easily. */
.faq-block{max-width:900px;display:grid;gap:0}
.faq-item{border-top:1px solid #dbe3ef;padding:22px 0}
.faq-item:last-child{border-bottom:1px solid #dbe3ef}
.faq-item h3{font-size:19px;line-height:1.45;margin:0 0 10px;color:#0f172a;letter-spacing:-.01em}
.faq-item p{font-size:14px;line-height:1.8;color:#475569;max-width:820px;margin:0}
@media(max-width:767px){.faq-item h3{font-size:17px}.faq-item p{font-size:13px}}

/* Floating CTAs must never sit on top of copy. While the page is moving, and
   whenever the closing CTA band / footer is in view, both fixed launchers step
   aside. Those closing sections already carry their own WhatsApp link. */
.floating-contact.wyd-whatsapp-float,
.quote-float{transition:opacity .2s ease,transform .2s ease,background .22s,box-shadow .22s}
body.floats-aside :is(.floating-contact.wyd-whatsapp-float,.quote-float),
body.floats-cta-aside .floating-contact.wyd-whatsapp-float{
  opacity:0;transform:translateY(14px);pointer-events:none
}
@media(max-width:767px){
  .floating-contact.wyd-whatsapp-float{min-width:0;width:56px;height:56px;min-height:56px;padding:8px;gap:0}
  .floating-contact.wyd-whatsapp-float .wyd-whatsapp-label,
  .floating-contact.wyd-whatsapp-float .wyd-whatsapp-arrow{display:none}
  .floating-contact.wyd-whatsapp-float .wyd-whatsapp-icon{flex:0 0 36px;width:36px;height:36px}
  .floating-contact.wyd-whatsapp-float .wyd-whatsapp-icon img{width:24px;height:24px}
}
@media(prefers-reduced-motion:reduce){
  .floating-contact.wyd-whatsapp-float,.quote-float{transition:none}
}

/* ---------- admin (only /admin uses these) ---------- */
.adm-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.adm-head h2{margin:0 0 4px;font-size:22px;letter-spacing:-.01em}
.adm-head .hint{margin:0}
.adm-head-actions{display:flex;align-items:center;gap:10px}
.adm-who{font-size:12px;color:#64748b}
.adm-tabs{display:flex;gap:8px;border-bottom:1px solid #e2e8f0;margin-bottom:22px;flex-wrap:wrap}
.adm-tabs button{background:none;border:0;padding:10px 14px;font-size:14px;color:#475569;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.adm-tabs button.is-on{color:#111827;font-weight:600;border-bottom-color:#b8862f}
.adm-tabs button:hover{color:#111827}
.adm-toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:20px}
.adm-inline{display:flex;align-items:center;gap:8px;font-size:13px;color:#475569}
.adm-inline select{padding:8px 10px;border:1px solid #dbe3ef;border-radius:6px;font-size:14px;background:#fff}
.adm-table{font-size:13px}
.adm-table td,.adm-table th{padding:10px 12px}
.adm-row-actions{display:flex;gap:6px;flex-wrap:wrap}
.adm-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:12px;white-space:nowrap}
.adm-badge.on{background:#dcfce7;color:#166534}
.adm-badge.off{background:#fee2e2;color:#991b1b}
.adm-newcard{border:1px solid rgba(184,134,47,.35);background:#fffdf6;border-radius:8px;padding:16px 18px;margin-bottom:22px}
.adm-newcard-head{font-size:13px;font-weight:600;color:#8a6420;margin-bottom:10px}
.adm-newcard pre{background:#fff;border:1px solid #e2e8f0;border-radius:6px;padding:12px;font-size:13px;line-height:1.7;white-space:pre-wrap;margin:0 0 12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.adm-login{max-width:420px}
@media(max-width:767px){
  .adm-table{font-size:12px}
  .adm-table td,.adm-table th{padding:8px 8px}
  .adm-row-actions .mini{padding:5px 8px;font-size:11px}
}

/* admin: hide storefront chrome on the admin page */
body[data-page="admin"] .account-bar,
body[data-page="admin"] .floating-contact,
body[data-page="admin"] .quote-float{display:none!important}

/* admin accounts table becomes stacked cards on phones */
@media(max-width:767px){
  .adm-cards thead{display:none}
  .adm-cards,.adm-cards tbody,.adm-cards tr,.adm-cards td{display:block;width:100%}
  .adm-cards tr{border:1px solid #e2e8f0;border-radius:8px;padding:12px 14px;margin-bottom:12px;background:#fff}
  .adm-cards td{display:flex;justify-content:space-between;align-items:center;gap:14px;border:0;padding:5px 0;text-align:right;white-space:normal}
  .adm-cards td:first-child{padding-bottom:9px;margin-bottom:4px;border-bottom:1px solid #f1f5f9;font-size:15px;text-align:left}
  .adm-cards td:before{content:attr(data-label);color:#94a3b8;font-size:12px;text-align:left;flex:0 0 auto}
  .adm-cards td:first-child:before{content:none}
  .adm-cards td.adm-row-actions{display:flex;justify-content:flex-start;gap:8px;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px solid #f1f5f9;text-align:left}
  .adm-cards td.adm-row-actions:before{content:none}
  .adm-cards td br{display:none}
  .adm-cards td small{display:block;font-size:11px}
}

/* ---------- catalogue search ---------- */
.search-panel{background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;padding:18px;margin-bottom:24px}
.search-main{display:flex;gap:10px;margin-bottom:18px}
.search-main input{flex:1;padding:12px 14px;border:1px solid #dbe3ef;border-radius:8px;font-size:15px;background:#fff;color:#111827}
.search-main input:focus{outline:2px solid rgba(184,134,47,.35);outline-offset:1px}
.search-main .button{white-space:nowrap;padding:12px 24px}
.search-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px}
.filter-group{display:flex;flex-direction:column;gap:6px}
.filter-label{font-size:12px;color:#64748b;text-transform:uppercase;letter-spacing:.04em}
.filter-inputs{display:flex;align-items:center;gap:6px}
.filter-inputs input{width:100%;min-width:0;padding:9px 10px;border:1px solid #dbe3ef;border-radius:6px;font-size:14px;background:#fff;color:#111827}
.filter-inputs input:disabled{background:#eef2f7;color:#94a3b8;cursor:not-allowed}
.filter-dash{color:#94a3b8}
.filter-group select{padding:9px 10px;border:1px solid #dbe3ef;border-radius:6px;font-size:14px;background:#fff;color:#111827}
.filter-group select:disabled{background:#eef2f7;color:#94a3b8}
.filter-lock{font-size:12px;color:#8a6420;text-decoration:none;border-bottom:1px dashed rgba(184,134,47,.5);align-self:flex-start}
.filter-lock[hidden]{display:none}
.search-quick{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:18px;padding-top:16px;border-top:1px solid #e2e8f0}
.chip{padding:6px 12px;border:1px solid #dbe3ef;background:#fff;border-radius:999px;font-size:12px;color:#334155;cursor:pointer;font-family:inherit}
.chip:hover:not(:disabled){border-color:#b8862f;color:#8a6420}
.chip:disabled{opacity:.4;cursor:not-allowed}
.search-summary{margin-bottom:18px;font-size:14px;color:#475569;min-height:20px}
.search-summary strong{color:#111827}
@media(max-width:767px){
  .search-panel{padding:14px}
  .search-main{flex-direction:column}
  .search-main .button{width:100%}
  .search-filters{grid-template-columns:1fr 1fr}
  .search-filters .filter-group:last-child{grid-column:1/-1}
}

/* admin: change my own password */
.adm-pwdcard{max-width:460px;margin:0 0 22px;border-color:rgba(184,134,47,.35);background:#fffdf6}
.adm-pwdcard h3{margin:0 0 6px;font-size:17px;letter-spacing:-.01em}
.adm-pwdcard .field small.hint{display:block;margin-top:5px;font-size:12px;color:#94a3b8}
.adm-pwd-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.adm-pwd-actions .button{min-height:44px}
@media(max-width:767px){.adm-pwd-actions .button{flex:1 1 100%}}

/* admin: password card overrides site.css defaults */
.adm-pwdcard .form-status{background:transparent;padding:0;margin-top:10px;min-height:0}
.adm-pwdcard .form-status:empty{display:none}
.adm-pwdcard .button.secondary{background:#fff;color:#111827;border:1px solid #dbe3ef}
.adm-pwdcard .button.secondary:hover{border-color:#b8862f;color:#8a6420}

/* ---------------------------------------------------------------------------
   Toy wholesale palette layer.
   The original scheme was slate-900 near-black on cool grey: correct for a
   consultancy, wrong for a toy catalogue. This layer keeps the structure and
   the typography and only changes where the weight sits:
     - warm off-white paper instead of cool grey
     - orange as the accent that replaces the old brass gold
     - near-black replaced by navy, and large dark fields flipped to warm cream
   Loaded last on purpose, so it wins over the base rules without editing them.
--------------------------------------------------------------------------- */

/* Top bar becomes the first warm note instead of a dark strip. */
.topbar{background:#c94f04;color:#fff6ec}
.topbar a{color:#fff}

/* Home hero: warm gradient, dark type. The big headline keeps its weight
   without covering the first screen in near-black. */
.hero{background:linear-gradient(168deg,#fff8ec 0%,#ffecd2 54%,#ffdcb2 100%);color:#14213d}
.hero h1 span{color:#dd5c06}
.hero-copy>p{color:#4b5669}
.hero-tags{border-top:1px solid #f0d2a8;color:#5b6478}
.hero-tags span:before{color:#c94f04}
.hero-art{background:#fff9f0}
.hero-art:before{background-image:linear-gradient(#c94f040e 1px,transparent 1px),linear-gradient(90deg,#c94f040e 1px,transparent 1px)}
.engineRing-note,.engineering-note{border-top:1px solid #ecd2ac;color:#7b6b53}
.engineering-note span:last-child{color:#c94f04}
.hero .button.ghost{border-color:#d9b98e;color:#14213d}
.hero .button.ghost:hover{background:#ffe8cc}

/* Inner page heading bands: same warm treatment, so no page opens dark. */
.page-hero{background:linear-gradient(152deg,#fff8ec,#ffe8cb);color:#14213d}
.page-hero h1{color:#14213d}
.page-hero p{color:#4b5669}
.page-hero .breadcrumb{color:#8c7454}

/* Dark middle sections, where they exist, follow the same flip. */
.section.dark{background:#fff1de}
.section.dark h2{color:#14213d}
.section.dark p{color:#4b5669}
.section.dark .line-list li{border-color:#f0d2a8}
.section.dark .process-item{border-top:1px solid #eccd9e}
.section.dark .process-item .number{color:#c94f04}

/* CTA band: navy rather than near-black, so the page still closes firmly. */
.cta-band{background:#1b3a6b}
.cta-band p{color:#c6d7ee}

/* Footer sits on navy, one step lighter than before. */
.site-footer{background:#14213d}
.site-footer p,.site-footer a{color:#a9b9d0}
.footer-bottom{border-top:1px solid #2b3e5d;color:#7f90a9}

/* Picture frames warm up so white-background photos keep a visible edge. */
.product-card .product-image,
.category-card .image,
.product-display,
.gallery a,
.blog-card img{background:#f7f2e9}
.product-card{border-color:#e7ddcb}
.product-info p,.product-info .text-link{color:#5f6b7f}

/* Notices and status strips were a cool blue-grey. */
.notice{background:#fff4e2;border-left:3px solid #f2760c;color:#6b4a22}
.form-status{background:#f7f2e9;color:#4b5669}
.model-tags span{background:#f7f2e9;color:#5b6478}
.spec-table th{background:#f7f2e9;color:#14213d}

/* Mobile nav pills and admin accents carried hard-coded slate/blue values. */
@media(max-width:767px){
  .site-header .site-nav>a{background:#fdf3e4;color:#5b6478}
  .site-header .site-nav>a[aria-current=page]{background:#1b3a6b;color:#fff}
  .site-header .site-nav>a:hover{background:#ffe8cc;color:#14213d}
  .site-header .site-nav>a[aria-current=page]:hover{background:#1b3a6b;color:#fff}
  .site-header .menu-toggle{background:#fdf3e4;border-color:#e7ddcb;color:#14213d}
  .site-header .menu-toggle[aria-expanded=true]{background:#1b3a6b;border-color:#1b3a6b;color:#fff}
}

/* Primary actions all wear the accent colour. Two competing primaries (navy
   blue on search, brass gold on the home hero) read as two different sites. */
.button,.button.gold{background:#c94f04;border-color:#c94f04;color:#fff}
.button:hover,.button.gold:hover{background:#b04503;border-color:#b04503}
.button.ghost,.button.light,.button.secondary{background:transparent;border-color:#e7ddcb;color:#14213d}
.button.ghost:hover,.button.light:hover,.button.secondary:hover{background:#fff4e2;border-color:#c94f04}
.hero .button.ghost{border-color:#d9b98e;color:#14213d}

/* Leftover cool greys in hover and frame states, warmed to match. */
.category-card:hover,.product-card:hover{border-color:#cdb99a}
.product-display,.catalogue-panel,.sheet-preview{background:#f7f2e9}
.pager a,.pager button{border-color:#e7ddcb}
.pager a[aria-current=page]{background:#c94f04;border-color:#c94f04;color:#fff}
.chip{border-color:#e7ddcb;color:#5b6478}
.chip[aria-pressed=true]{background:#c94f04;border-color:#c94f04;color:#fff}
.subcategory-links a{border-color:#e7ddcb;color:#5b6478;background:#fffdf8}
.subcategory-links a:hover{border-color:#c94f04;color:#c94f04}
.filter-button{border-color:#e7ddcb;color:#5b6478}
.filter-button[aria-pressed=true]{background:#1b3a6b;border-color:#1b3a6b;color:#fff}

/* Sign-in strip: was near-black and gave the page a dark first impression
   before the brand even appeared. Warm paper instead, orange link. */
.account-bar{background:#fff4e2;color:#5b4a33;border-bottom:1px solid #f2dcc0}
.account-bar a{color:#c94f04}
.account-bar button{border-color:#d9b98e;color:#5b4a33}

/* WhatsApp green is a brand mark, but the stock #25D366 glows against a warm
   page. A slightly deeper green keeps the recognition without shouting. */
.wyd-whatsapp-float{background:#17a35a!important}
.wyd-whatsapp-float:hover{background:#128a4b!important}

/* WhatsApp actions stay green everywhere: the floating launcher is green, so a
   second WhatsApp button in orange reads as a different action. */
.button.whatsapp,.button.whatsapp:hover{background:#17a35a;border-color:#17a35a;color:#fff}
.button.whatsapp:hover{background:#128a4b;border-color:#128a4b}
.cta-band .button{white-space:nowrap}

/* On phones the category strip hides both labels, leaving a bare orange bar
   that reads as a rendering fault. Drop it there; the nav below carries the
   same information. */
@media(max-width:767px){.topbar{display:none}}

/* ---------- five audit fixes ---------- */

/* 1. The 1100px rule was written for a "logo image + strapline" brand. The
   brand is now a single text mark, so hiding every span inside it erased the
   company name between 768px and 1100px. Restore the text mark there and leave
   the phone breakpoint (which lays it out as a block) alone. */
@media(min-width:768px) and (max-width:1100px){
  .site-header .brand>span{display:inline!important}
  .site-header .brand>span>span{display:inline!important}
}
.site-header .brand>span>span{font-size:inherit;font-weight:inherit;letter-spacing:inherit;text-transform:none;border-left:0;padding-left:0;color:#dd5c06}

/* 2. The sign-in line was one fixed sentence; on a phone it ran past the
   viewport. Short label on small screens, full sentence from tablet up. */
.signin-short{display:none}
@media(max-width:767px){
  .signin-long{display:none}
  .signin-short{display:inline}
  .account-bar .container{flex-wrap:wrap;gap:8px}
  .account-bar{font-size:12px}
}

/* 3. Home page guide cards, replacing the placeholder block. */
.guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.guide-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e7ddcb;padding:26px 26px 24px;color:inherit}
.guide-card:hover{border-color:#cdb99a}
.guide-step{font:12px ui-monospace,Menlo,monospace;color:#c94f04;letter-spacing:.06em;margin-bottom:14px}
.guide-card h3{font-size:19px;letter-spacing:-.01em;margin:0 0 10px}
.guide-card p{font-size:13.5px;color:#5f6b7f;margin:0 0 18px}
.guide-card .text-link{margin-top:auto;font-size:12.5px;color:#c94f04}
@media(max-width:900px){.guide-grid{grid-template-columns:1fr}}

/* 5. Cards in a row are stretched to equal height, but the copy was not, so a
   short title left a gap under the last line. Let the text block fill the card
   and push the trailing row to the bottom. When the buyer is signed out the
   add-to-list row is hidden entirely, so the price line takes the anchor role
   instead and every card ends on the same baseline. */
.product-card{display:flex;flex-direction:column}
.product-card .card-figure{flex:0 0 auto}
.product-card .product-info{flex:1 1 auto;display:flex;flex-direction:column;padding:22px 22px 18px}
.product-card .card-actions{margin-top:auto}
.product-card .product-info>p{min-height:0}
.product-card:has([data-quote-add][hidden]) .price-slot{margin-top:auto;margin-bottom:0}