/* ============================================================
   Home — storefront catalog layout (sidebar + dense product grid)
   Prefix: rbe-. Light + dark aware. Scoped to .rbe-page so no
   other Aster screen inherits these rules.
   ============================================================ */
.rbe-page{
  --rbe-blue:#1b4dd8;
  --rbe-blue-dark:#1339a6;
  --rbe-red:#e11d2e;
  --rbe-amber:#f7b500;
  --rbe-ink:#111827;
  --rbe-ink2:#374151;
  --rbe-muted:#6b7280;
  --rbe-line:#e5e7eb;
  --rbe-line2:#f0f2f5;
  --rbe-surface:#ffffff;
  --rbe-surface2:#f5f6f8;
  --rbe-radius:4px;
  padding:0 !important;
  background:var(--rbe-surface);
  color:var(--rbe-ink);
}
body[theme="dark"] .rbe-page{
  --rbe-ink:#e8edf2; --rbe-ink2:#c3ccd5; --rbe-muted:#94a3b1;
  --rbe-line:#26313c; --rbe-line2:#1c242c;
  --rbe-surface:#111820; --rbe-surface2:#0d141a;
}

.rbe-page .container{ max-width:1400px; }

/* ---------- masthead band ---------- */
.rbe-masthead{ padding:44px 0 40px; background:var(--rbe-surface2); border-bottom:1px solid var(--rbe-line); }
.rbe-masthead-inner{ text-align:center; }
.rbe-masthead h1{ margin:0; font-size:clamp(30px,4vw,52px); font-weight:800; letter-spacing:-.02em; text-transform:uppercase; color:var(--rbe-ink); }
.rbe-masthead p{ margin:12px auto 0; max-width:70ch; font-size:15px; line-height:1.6; color:var(--rbe-muted); }
.rbe-masthead-actions{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:22px; }
.rbe-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:46px; padding:0 22px;
  border:1px solid transparent; border-radius:var(--rbe-radius); font-size:14px; font-weight:700; text-decoration:none; transition:background .16s ease,color .16s ease,border-color .16s ease; }
.rbe-btn--primary{ color:#fff; background:var(--rbe-blue); }
.rbe-btn--primary:hover{ color:#fff; background:var(--rbe-blue-dark); }
.rbe-btn--ghost{ color:var(--rbe-ink); border-color:var(--rbe-line); background:var(--rbe-surface); }
.rbe-btn--ghost:hover{ color:var(--rbe-blue); border-color:var(--rbe-blue); }

.rbe-promos{ display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:32px; }
.rbe-promo{ display:block; overflow:hidden; border:1px solid var(--rbe-line); border-radius:var(--rbe-radius); background:var(--rbe-surface); }
.rbe-promo img{ display:block; width:100%; height:190px; object-fit:cover; transition:transform .35s ease; }
.rbe-promo:hover img{ transform:scale(1.04); }

/* ---------- shop shell ---------- */
.rbe-shop{ padding:34px 0 46px; }
.rbe-shop-grid{ display:grid; grid-template-columns:290px minmax(0,1fr); gap:30px; align-items:start; }
.rbe-side{ display:flex; flex-direction:column; gap:20px; position:sticky; top:90px; }
.rbe-main{ min-width:0; }

/* ---------- sidebar widgets ---------- */
.rbe-widget{ border:1px solid var(--rbe-line); border-radius:var(--rbe-radius); background:var(--rbe-surface); }
.rbe-widget-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; padding:16px 18px;
  border:0; background:transparent; color:var(--rbe-ink); font-size:16px; font-weight:700; text-align:start; }
.rbe-widget-head i{ font-size:13px; color:var(--rbe-muted); transition:transform .18s ease; }
.rbe-widget-head[aria-expanded="false"] i{ transform:rotate(-90deg); }
.rbe-widget-body{ padding:0 18px 18px; }
.rbe-widget-body.collapse:not(.show){ display:none; }

.rbe-searchbox{ display:flex; padding:18px; }
.rbe-searchbox input{ flex:1 1 auto; min-width:0; height:44px; padding:0 12px; border:1px solid var(--rbe-line); border-inline-end:0;
  border-radius:var(--rbe-radius) 0 0 var(--rbe-radius); background:var(--rbe-surface); color:var(--rbe-ink); font-size:14px; }
.rbe-searchbox input:focus{ outline:0; border-color:var(--rbe-blue); }
.rbe-searchbox button{ flex:0 0 auto; height:44px; padding:0 18px; border:0; border-radius:0 var(--rbe-radius) var(--rbe-radius) 0;
  color:#fff; background:var(--rbe-blue); font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.rbe-searchbox button:hover{ background:var(--rbe-blue-dark); }

.rbe-price-row{ display:flex; align-items:center; gap:8px; }
.rbe-price-row input{ width:100%; min-width:0; height:40px; padding:0 10px; border:1px solid var(--rbe-line); border-radius:var(--rbe-radius);
  background:var(--rbe-surface); color:var(--rbe-ink); font-size:13px; }
.rbe-price-row input:focus{ outline:0; border-color:var(--rbe-blue); }
.rbe-price-row span{ color:var(--rbe-muted); }
.rbe-price-apply{ width:100%; height:40px; margin-top:12px; border:0; border-radius:var(--rbe-radius); color:#fff; background:var(--rbe-ink);
  font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.rbe-price-apply:hover{ background:var(--rbe-blue); }

.rbe-list{ display:flex; flex-direction:column; gap:2px; margin:0; padding:0; list-style:none; max-height:296px; overflow-y:auto; }
.rbe-list a{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 2px;
  color:var(--rbe-ink2); font-size:14px; text-decoration:none; transition:color .14s ease,padding-inline-start .14s ease; }
.rbe-list a:hover{ color:var(--rbe-blue); padding-inline-start:6px; }
.rbe-list span{ flex:0 0 auto; color:var(--rbe-muted); font-size:12px; }
.rbe-list::-webkit-scrollbar{ width:5px; }
.rbe-list::-webkit-scrollbar-thumb{ background:var(--rbe-line); border-radius:99px; }

.rbe-tags{ display:flex; flex-wrap:wrap; gap:8px; }
.rbe-tag{ padding:7px 12px; border:1px solid var(--rbe-line); border-radius:99px; color:var(--rbe-ink2); font-size:12.5px; font-weight:600; text-decoration:none; transition:all .14s ease; }
.rbe-tag:hover{ color:#fff; border-color:var(--rbe-blue); background:var(--rbe-blue); }

.rbe-mini{ display:flex; flex-direction:column; gap:14px; }
.rbe-mini-item{ display:grid; grid-template-columns:56px minmax(0,1fr); gap:12px; align-items:center; text-decoration:none; }
.rbe-mini-thumb{ display:grid; place-items:center; width:56px; height:56px; padding:5px; border:1px solid var(--rbe-line); border-radius:var(--rbe-radius); background:var(--rbe-surface2); }
.rbe-mini-thumb img{ max-width:100%; max-height:100%; object-fit:contain; }
.rbe-mini-name{ display:-webkit-box; overflow:hidden; margin:0 0 4px; color:var(--rbe-ink); font-size:13px; font-weight:600; line-height:1.35; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.rbe-mini-item:hover .rbe-mini-name{ color:var(--rbe-blue); }
.rbe-mini-price{ color:var(--rbe-red); font-size:13px; font-weight:700; }
.rbe-mini-price del{ margin-inline-end:6px; color:var(--rbe-muted); font-weight:500; }

.rbe-side-banner{ display:block; overflow:hidden; border:1px solid var(--rbe-line); border-radius:var(--rbe-radius); }
.rbe-side-banner img{ display:block; width:100%; height:auto; }

/* ---------- catalog toolbar ---------- */
.rbe-fastfilters{ display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:22px; }
.rbe-fastfilters > strong{ margin-inline-end:4px; color:var(--rbe-ink2); font-size:14px; font-weight:600; }
.rbe-chip{ display:inline-flex; align-items:center; gap:8px; min-height:42px; padding:0 18px; border:1px solid var(--rbe-line);
  border-radius:99px; background:var(--rbe-surface); color:var(--rbe-ink2); font-size:12.5px; font-weight:700; letter-spacing:.05em;
  text-transform:uppercase; text-decoration:none; cursor:pointer; transition:all .16s ease; }
.rbe-chip:hover{ color:var(--rbe-blue); border-color:var(--rbe-blue); }
.rbe-chip.is-active{ color:#fff; border-color:var(--rbe-blue); background:var(--rbe-blue); }
.rbe-chip i{ font-size:14px; }

.rbe-toolbar{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px;
  padding:14px 0; border-top:1px solid var(--rbe-line); border-bottom:1px solid var(--rbe-line); margin-bottom:24px; }
.rbe-toolbar-count{ color:var(--rbe-muted); font-size:14px; }
.rbe-toolbar-right{ display:flex; align-items:center; gap:18px; }
.rbe-density{ display:flex; align-items:center; gap:6px; }
.rbe-density button{ display:grid; place-items:center; width:32px; height:32px; padding:0; border:1px solid transparent; border-radius:var(--rbe-radius);
  background:transparent; color:var(--rbe-muted); font-size:15px; }
.rbe-density button:hover{ color:var(--rbe-ink); }
.rbe-density button.is-active{ color:var(--rbe-blue); border-color:var(--rbe-line); background:var(--rbe-surface2); }
.rbe-sort{ height:38px; padding:0 34px 0 12px; border:1px solid var(--rbe-line); border-radius:var(--rbe-radius);
  background:var(--rbe-surface); color:var(--rbe-ink); font-size:13.5px; }
.rbe-sort:focus{ outline:0; border-color:var(--rbe-blue); }
.rbe-filter-toggle{ display:none; }

/* ---------- product grid ---------- */
.rbe-panel[hidden]{ display:none; }
.rbe-grid{ display:grid; gap:0; grid-template-columns:repeat(5,minmax(0,1fr)); border:1px solid var(--rbe-line); border-width:1px 0 0 1px; }
.rbe-grid--2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.rbe-grid--3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.rbe-grid--4{ grid-template-columns:repeat(4,minmax(0,1fr)); }

.rbe-card{ position:relative; display:flex; flex-direction:column; border:1px solid var(--rbe-line); border-width:0 1px 1px 0;
  background:var(--rbe-surface); transition:box-shadow .2s ease, z-index 0s; }
.rbe-card:hover{ z-index:2; box-shadow:0 12px 30px -14px rgba(17,24,39,.28); }
body[theme="dark"] .rbe-card:hover{ box-shadow:0 12px 30px -14px rgba(0,0,0,.7); }

.rbe-card-media{ position:relative; aspect-ratio:1/1; padding:16px; background:var(--rbe-surface); }
.rbe-card-thumb{ display:grid; place-items:center; width:100%; height:100%; }
.rbe-card-thumb img{ max-width:100%; max-height:100%; object-fit:contain; transition:transform .3s ease; mix-blend-mode:multiply; }
body[theme="dark"] .rbe-card-thumb img{ mix-blend-mode:normal; }
.rbe-card:hover .rbe-card-thumb img{ transform:scale(1.06); }

.rbe-flags{ position:absolute; top:10px; inset-inline-start:10px; z-index:3; display:flex; flex-direction:column; align-items:flex-start; gap:6px; }
.rbe-flag{ padding:4px 9px; border-radius:2px; color:#fff; font-size:10.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.rbe-flag--info{ background:var(--rbe-blue); }
.rbe-flag--sale{ background:var(--rbe-red); }
.rbe-off{ padding:3px 8px; border-radius:2px; color:var(--rbe-red); background:rgba(225,29,46,.12); font-size:10.5px; font-weight:700; }

.rbe-rate{ position:absolute; inset-inline-start:10px; bottom:10px; z-index:3; display:inline-flex; align-items:center; gap:4px;
  padding:3px 8px; border:1px solid rgba(247,181,0,.45); border-radius:2px; background:rgba(247,181,0,.14);
  color:var(--rbe-ink); font-size:11px; font-weight:700; }
.rbe-rate i{ color:var(--rbe-amber); font-size:10px; }
.rbe-rate small{ color:var(--rbe-muted); font-weight:600; }

.rbe-soldout{ position:absolute; inset-inline:0; bottom:0; z-index:3; padding:6px; background:rgba(17,24,39,.82); color:#fff;
  font-size:11px; font-weight:700; letter-spacing:.05em; text-align:center; text-transform:uppercase; }

.rbe-card-tools{ position:absolute; top:10px; inset-inline-end:10px; z-index:4; display:flex; flex-direction:column; gap:6px;
  opacity:0; transform:translateX(8px); transition:opacity .2s ease, transform .2s ease; }
.rbe-card:hover .rbe-card-tools{ opacity:1; transform:none; }
.rbe-card-tool{ display:grid; place-items:center; width:32px; height:32px; border:1px solid var(--rbe-line); border-radius:2px;
  background:var(--rbe-surface); color:var(--rbe-ink2); font-size:13px; text-decoration:none; transition:all .14s ease; }
.rbe-card-tool:hover, .rbe-card-tool.is-on{ color:#fff; border-color:var(--rbe-blue); background:var(--rbe-blue); }

.rbe-card-body{ display:flex; flex-direction:column; gap:8px; flex:1 1 auto; padding:0 16px 16px; border-top:1px solid var(--rbe-line2); padding-top:14px; }
.rbe-card-title{ margin:0; font-size:14px; font-weight:700; line-height:1.35; }
.rbe-card-title a{ display:-webkit-box; overflow:hidden; color:var(--rbe-ink); text-decoration:none; -webkit-line-clamp:2; -webkit-box-orient:vertical; min-height:2.7em; }
.rbe-card-title a:hover{ color:var(--rbe-blue); }
.rbe-card-price{ display:flex; align-items:baseline; flex-wrap:wrap; gap:8px; }
.rbe-card-price ins{ color:var(--rbe-red); font-size:16px; font-weight:800; text-decoration:none; }
.rbe-card-price del{ color:var(--rbe-muted); font-size:13px; }
.rbe-card-meta{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; color:var(--rbe-muted); font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.rbe-card-meta .rbe-stars{ color:var(--rbe-amber); font-size:10px; letter-spacing:1px; }
.rbe-card-usp{ display:flex; flex-direction:column; gap:4px; margin:0; padding:0; list-style:none; }
.rbe-card-usp li{ display:flex; align-items:center; gap:6px; color:var(--rbe-muted); font-size:10.5px; font-weight:600; letter-spacing:.03em; text-transform:uppercase; }
.rbe-card-usp i{ color:var(--rbe-blue); font-size:10px; }
.rbe-card-cta{ width:100%; min-height:42px; margin-top:auto; padding:0 12px; border:0; border-radius:var(--rbe-radius);
  color:#fff; background:var(--rbe-blue); font-size:13.5px; font-weight:700; transition:background .16s ease; }
.rbe-card-cta:hover{ color:#fff; background:var(--rbe-blue-dark); }
.rbe-card-cta[disabled]{ background:var(--rbe-muted); cursor:not-allowed; }

.rbe-loadmore{ display:flex; justify-content:center; margin-top:34px; }
.rbe-loadmore a{ min-width:190px; border-radius:99px; }

.rbe-empty{ padding:60px 20px; border:1px dashed var(--rbe-line); text-align:center; color:var(--rbe-muted); font-size:14px; }

/* ---------- service strip ---------- */
.rbe-services{ padding:38px 0; border-top:1px solid var(--rbe-line); background:var(--rbe-surface); }
.rbe-services-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:26px; }
.rbe-service{ display:flex; align-items:center; gap:16px; }
.rbe-service-ic{ display:grid; flex:0 0 auto; place-items:center; width:58px; height:58px; border:2px solid var(--rbe-red);
  border-radius:50%; color:var(--rbe-red); font-size:24px; }
.rbe-service b{ display:block; color:var(--rbe-ink); font-size:19px; font-weight:700; line-height:1.25; }
.rbe-service small{ display:block; margin-top:4px; color:var(--rbe-muted); font-size:13px; }

/* ---------- responsive ---------- */
@media (max-width:1399px){ .rbe-grid{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (max-width:1199px){
  .rbe-shop-grid{ grid-template-columns:250px minmax(0,1fr); gap:22px; }
  .rbe-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:991px){
  .rbe-shop-grid{ grid-template-columns:minmax(0,1fr); }
  .rbe-side{ position:static; display:none; }
  .rbe-side.is-open{ display:flex; }
  .rbe-filter-toggle{ display:inline-flex; }
  .rbe-promos{ gap:14px; }
  .rbe-promo img{ height:150px; }
  .rbe-services-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
}
@media (max-width:767px){
  .rbe-masthead{ padding:30px 0 28px; }
  .rbe-promos{ grid-template-columns:1fr; }
  .rbe-grid, .rbe-grid--3, .rbe-grid--4{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rbe-card-media{ padding:10px; }
  .rbe-card-body{ padding:12px; gap:6px; }
  .rbe-card-tools{ opacity:1; transform:none; }
  .rbe-card-usp{ display:none; }
  .rbe-density{ display:none; }
  .rbe-toolbar{ gap:10px; }
  .rbe-service-ic{ width:48px; height:48px; font-size:20px; }
  .rbe-service b{ font-size:16px; }
}
@media (prefers-reduced-motion:reduce){
  .rbe-card, .rbe-card-thumb img, .rbe-promo img{ transition:none; }
}

/* ---------- masthead category tiles ---------- */
.rbe-cats{ display:flex; flex-wrap:nowrap; justify-content:flex-start; align-items:stretch; gap:16px; margin-top:30px;
  width:fit-content; max-width:100%; margin-inline:auto;
  padding:12px 4px 4px; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; -ms-overflow-style:none; -webkit-overflow-scrolling:touch; }
.rbe-cats::-webkit-scrollbar{ display:none; }

.rbe-cat{ position:relative; flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:10px;
  width:150px; padding:16px 12px 14px; border:1px solid var(--rbe-line); border-radius:var(--rbe-radius);
  background:var(--rbe-surface); text-decoration:none;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.rbe-cat:hover{ transform:translateY(-3px); border-color:var(--rbe-blue); box-shadow:0 12px 26px -16px rgba(17,24,39,.35); }
body[theme="dark"] .rbe-page .rbe-cat:hover{ box-shadow:0 12px 26px -16px rgba(0,0,0,.75); }

.rbe-cat-thumb{ display:grid; place-items:center; width:100%; height:90px; }
.rbe-cat-thumb img{ max-width:100%; max-height:90px; object-fit:contain; mix-blend-mode:multiply; }
body[theme="dark"] .rbe-page .rbe-cat-thumb img{ mix-blend-mode:normal; }

.rbe-cat-name{ display:-webkit-box; overflow:hidden; color:var(--rbe-ink); font-size:13px; font-weight:600;
  line-height:1.35; text-align:center; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.rbe-cat:hover .rbe-cat-name{ color:var(--rbe-blue); }

.rbe-cat-count{ position:absolute; top:-9px; inset-inline-start:-9px; z-index:2; display:grid; place-items:center;
  min-width:26px; height:26px; padding:0 7px; border:2px solid var(--rbe-surface2); border-radius:99px;
  color:#fff; background:var(--rbe-blue); font-size:11px; font-weight:700; line-height:1; }

@media (max-width:991px){
  .rbe-cats{ justify-content:flex-start; gap:12px; margin-top:24px; }
  .rbe-cat{ width:130px; }
  .rbe-cat-thumb{ height:76px; }
  .rbe-cat-thumb img{ max-height:76px; }
}
@media (max-width:767px){
  .rbe-cats{ margin-top:20px; }
  .rbe-cat{ width:118px; padding:12px 10px; }
  .rbe-cat-thumb{ height:64px; }
  .rbe-cat-thumb img{ max-height:64px; }
  .rbe-cat-name{ font-size:12px; }
}
@media (prefers-reduced-motion:reduce){
  .rbe-cat{ transition:none; }
  .rbe-cat:hover{ transform:none; }
}
