/* ==========================================================
   OLB FORM & DYBDE v1.0 — LOCKED
   Generated directly from OLB_FORM_OG_DYBDE_MASTER_v1.0.
   This file owns radius, borders, shadows and elevation only.
   Focus remains owned by OLB_FARVESYSTEM_v1.0.4.css.
   ========================================================== */

:root {
  /* radius primitives */
  --radius-none: 0;
  --radius-hairline: 4px;
  --radius-control: 8px;
  --radius-card: 10px;
  --radius-surface: 16px;
  --radius-pill: 999px;

  /* semantic radius */
  --radius-badge: var(--radius-hairline);
  --radius-tag: var(--radius-hairline);
  --radius-input: var(--radius-control);
  --radius-select: var(--radius-control);
  --radius-button: var(--radius-control);
  --radius-quantity: var(--radius-control);
  --radius-image: var(--radius-control);
  --radius-product-card: var(--radius-card);
  --radius-category-card: var(--radius-card);
  --radius-info-card: var(--radius-card);
  --radius-checkout-card: var(--radius-card);
  --radius-dropdown: var(--radius-card);
  --radius-popover: var(--radius-card);
  --radius-hero: var(--radius-surface);
  --radius-promo: var(--radius-surface);
  --radius-modal: var(--radius-surface);
  --radius-chip: var(--radius-pill);
  --radius-bottom-nav: var(--radius-none);
  --radius-posebar: var(--radius-none);
  --radius-sticky-bar: var(--radius-none);
  --radius-drawer-edge: var(--radius-none);
  --radius-sheet: var(--radius-surface) var(--radius-surface) 0 0;

  /* control geometry */
  --input-padding-x: 12px;

  /* border */
  --border-width-default: 1px;
  --border-width-strong: 2px;
  --divider-width: 1px;

  --border-card:
    var(--border-width-default) solid var(--color-border);

  --border-control:
    var(--border-width-default) solid var(--color-border-strong);

  --border-selectable:
    var(--border-width-strong) solid var(--color-border);

  --border-selected:
    var(--border-width-strong) solid var(--color-selected-subtle-border);

  --border-error:
    var(--border-width-strong) solid var(--color-error);

  --border-disabled:
    var(--border-width-default) solid var(--color-border);

  --border-divider:
    var(--divider-width) solid var(--color-border);

  --border-sticky:
    var(--border-width-default) solid var(--color-border);

  /* elevation */
  --shadow-none:
    0 0 0 0 rgba(22,38,46,0);

  --shadow-subtle:
    0 1px 3px rgba(22,38,46,0.08);

  --shadow-raised:
    0 4px 12px rgba(22,38,46,0.10);

  --shadow-overlay:
    0 12px 32px rgba(22,38,46,0.18);

  --shadow-sticky-up:
    0 -2px 8px rgba(22,38,46,0.08);

  --shadow-sticky-down:
    0 2px 8px rgba(22,38,46,0.08);

  --transition-elevation:
    box-shadow 150ms ease,
    border-color 150ms ease;
}

/* Product image well: inset, white, no border, no elevation. */
.olb-product-card__media {
  border-radius: var(--radius-image);
  overflow: hidden;
  background: var(--color-surface-product);
  box-shadow: var(--shadow-none);
}

/* Product card geometry. The wrapper itself is not a focus target. */
.olb-product-card {
  border-radius: var(--radius-product-card);
  border: var(--border-card);
  box-shadow: var(--shadow-none);
  background: var(--color-surface);
}

@media (hover: hover) and (pointer: fine) {
  .olb-product-card:hover {
    border-color: var(--color-border-strong);
    box-shadow: var(--shadow-subtle);
  }
}

/* Shared geometric primitives for controls. Focus styling is intentionally absent. */
.olb-form-control {
  border-radius: var(--radius-input);
  border: var(--border-control);
}

.olb-selectable {
  border: var(--border-selectable);
  border-radius: var(--radius-card);
}

.olb-selectable.is-selected {
  border-color: var(--color-selected-subtle-border);
}

/* Hero / promo are surfaces, not ordinary cards. */
.olb-hero {
  border-radius: var(--radius-hero);
  overflow: hidden;
  border: 0;
  box-shadow: var(--shadow-none);
}

.olb-promo {
  border-radius: var(--radius-promo);
  border: 0;
  box-shadow: var(--shadow-none);
}

/* Elevated overlays. */
.olb-dropdown,
.olb-popover {
  border-radius: var(--radius-dropdown);
  border: var(--border-card);
  box-shadow: var(--shadow-raised);
}

.olb-sheet {
  border-radius: var(--radius-sheet);
  box-shadow: var(--shadow-overlay);
}

.olb-modal {
  border-radius: var(--radius-modal);
  box-shadow: var(--shadow-overlay);
}

.olb-divider {
  border: 0;
  border-top: var(--border-divider);
}