/* Bespoke Vintage PIM · product-page palette + familiar Bootstrap-style controls. */
:root {
  --bv-ink: #161527;
  --bv-page: #eeeded;
  --bv-surface: #ffffff;
  --bv-border: #d7d6dc;
  --bv-muted: #666574;
  --bv-hover: #e6e5e9;
  --bv-radius: 6px;
  --bv-sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --bv-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --font-family: var(--bv-sans);
}
body.fi-body, .fi-layout, .fi-main-ctn, .fi-simple-layout {
  background: var(--bv-page) !important;
  color: var(--bv-ink);
  font-family: var(--bv-sans) !important;
  -webkit-font-smoothing: antialiased;
}
.fi-main { width: 100%; max-width: 1440px; }
.fi-topbar, .fi-topbar nav, .fi-sidebar, .fi-sidebar-header {
  background: var(--bv-page) !important;
  color: var(--bv-ink);
  box-shadow: none !important;
}
.fi-topbar { border-bottom: 1px solid var(--bv-border); }
.fi-sidebar { border-right: 1px solid var(--bv-border); }
.fi-sidebar-header { min-height: 88px; border-bottom: 1px solid var(--bv-border); }
.bespoke-pim-brand { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; min-width: 0; width: 205px; padding: 3px 0; }
.bespoke-pim-brand img { display: block; width: 100%; height: auto; }
.bespoke-pim-brand span { color: var(--bv-muted); font-family: var(--bv-mono); font-size: 9px; font-weight: 400; letter-spacing: .14em; }
.fi-sidebar-nav { padding-top: 22px; }
.fi-sidebar-item-btn { border-radius: 3px !important; padding: 11px 14px; color: var(--bv-ink); }
.fi-sidebar-item-label, .fi-sidebar-group-label {
  font-family: var(--bv-mono) !important;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 400 !important;
  letter-spacing: .055em;
}
.fi-sidebar-item-btn:hover { background: var(--bv-hover) !important; }
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
  background: var(--bv-surface) !important;
  box-shadow: inset 3px 0 0 var(--bv-ink);
}
.fi-sidebar-item.fi-active .fi-sidebar-item-label,
.fi-sidebar-item.fi-active .fi-sidebar-item-icon { color: var(--bv-ink) !important; }
.fi-header { padding-bottom: 18px; border-bottom: 1px solid var(--bv-border); }
.fi-header-heading, .fi-simple-header-heading {
  font-family: var(--bv-sans) !important;
  color: var(--bv-ink);
  text-transform: uppercase;
  font-size: clamp(23px, 2.5vw, 32px);
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.15;
}
.fi-header-subheading, .fi-section-header-description { color: var(--bv-muted); }
.fi-breadcrumbs { font-family: var(--bv-mono); font-size: 11px; }
.fi-section, .fi-ta-ctn, .fi-simple-main, .fi-modal-window {
  background: var(--bv-surface) !important;
  border: 1px solid var(--bv-border) !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: var(--bv-ink);
}
.fi-section-header {
  border-bottom: 1px solid #ecebef;
  background: transparent;
  padding: 20px 24px;
}
.fi-section-header-heading {
  font-family: var(--bv-mono) !important;
  font-size: 13px;
  font-weight: 400 !important;
  letter-spacing: .075em;
  text-transform: uppercase;
  color: var(--bv-ink);
}
.fi-section-content { padding: 24px; }
.fi-fo-field-label, .fi-fo-field-label-content {
  font-family: var(--bv-sans);
  font-size: 14px;
  font-weight: 500;
  color: var(--bv-ink);
}
.fi-fo-field-helper-text, .fi-fo-field-hint, .fi-fo-field-hint-label {
  color: var(--bv-muted);
  font-size: 12px;
  line-height: 1.6;
}
.fi-input-wrp, .fi-fo-textarea {
  background: var(--bv-surface) !important;
  border: 1px solid #c9c8cf !important;
  border-radius: var(--bv-radius) !important;
  box-shadow: none !important;
  transition: border-color .15s ease, outline-color .15s ease;
}
.fi-input-wrp:focus-within, .fi-fo-textarea:focus-within {
  border-color: var(--bv-ink) !important;
  outline: 3px solid #1615271c;
  outline-offset: 0;
}
.fi-input, .fi-select-input, .fi-fo-textarea textarea {
  min-height: 40px;
  color: var(--bv-ink);
  font-family: var(--bv-sans);
  font-size: 14px;
}
.fi-input:read-only { background: #f7f6f8; color: var(--bv-muted); }
.fi-input-wrp-prefix, .fi-input-wrp-suffix {
  color: var(--bv-ink);
  background: #f5f4f6;
  font-family: var(--bv-sans);
}
.fi-fo-select .choices__inner {
  min-height: 42px;
  border: 0;
  background: var(--bv-surface);
  color: var(--bv-ink);
}
.fi-btn {
  min-height: 38px;
  padding: 9px 16px;
  border-radius: 4px !important;
  font-family: var(--bv-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .025em;
  text-transform: uppercase;
  box-shadow: none !important;
}
.fi-btn:focus-visible { outline: 3px solid #16152738; outline-offset: 2px; }
.fi-btn.fi-color-primary:not(.fi-outlined) { background: var(--bv-ink); color: #fff; }
.fi-btn.fi-color-primary:not(.fi-outlined):hover { background: #2b293e; }
.fi-tabs { background: transparent; border-bottom: 1px solid var(--bv-border); border-radius: 0 !important; box-shadow: none !important; gap: 12px; }
.fi-tabs-item { font-family: var(--bv-mono); font-size: 11px; text-transform: uppercase; letter-spacing: .025em; border-radius: 0 !important; padding: 12px 8px; }
.fi-tabs-item.fi-active { background: transparent !important; border-bottom: 2px solid var(--bv-ink); color: var(--bv-ink) !important; }
.fi-ta-header, .fi-ta-header-toolbar, .fi-ta-content-header {
  background: var(--bv-surface);
  border-bottom: 1px solid var(--bv-border);
  box-shadow: none;
}
.fi-ta-header-cell { background: #f7f6f8; border-bottom: 1px solid var(--bv-border); }
.fi-ta-header-cell-label { font-family: var(--bv-mono); font-size: 11px; text-transform: uppercase; letter-spacing: .055em; font-weight: 400; color: var(--bv-ink); }
.fi-ta-row { border-bottom: 1px solid #e9e8ed; }
.fi-ta-row:hover { background: #f7f6f8; }
.fi-ta-text { color: var(--bv-ink); font-size: 14px; }
.fi-ta-empty-state-heading { color: var(--bv-ink); font-family: var(--bv-sans); font-weight: 600; }
.fi-simple-layout { background: var(--bv-page) !important; }
.fi-simple-main { padding: 36px; }
.fi-simple-header .bespoke-pim-brand { width: 250px; align-items: center; }
.fi-simple-header-heading { font-size: 23px; margin-top: 12px; }
.fi-modal-header { border-bottom: 1px solid var(--bv-border); padding-bottom: 20px; }
.fi-modal-heading { font-family: var(--bv-mono); font-size: 15px; text-transform: uppercase; font-weight: 400; letter-spacing: .06em; }
/* Existing calculator Blade view: calm card-and-row treatment, preserving all formulas. */
.fi-modal-content dl { gap: 0 !important; }
.fi-modal-content dl > dt, .fi-modal-content dl > dd { padding-block: 15px; border-bottom: 1px solid #e5e4e9; }
.fi-modal-content dl > dd { text-align: right; font-variant-numeric: tabular-nums; font-weight: 500; }
.fi-modal-content section > h3 { font-family: var(--bv-mono); font-weight: 400 !important; text-transform: uppercase; letter-spacing: .075em; font-size: 14px; }
.fi-modal-content section label > input { margin-top: 8px; border: 1px solid #c9c8cf !important; border-radius: 6px !important; font-family: var(--bv-sans); }
@media (max-width: 640px) {
  .fi-section-content, .fi-section-header { padding: 18px; }
  .fi-simple-main { padding: 24px; }
  .fi-input, .fi-select-input, .fi-fo-textarea textarea { font-size: 16px; min-height: 44px; }
  .fi-btn { min-height: 44px; }
  .fi-main { padding-inline: 16px; }
  .fi-tabs-item { padding-inline: 5px; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .fi-input-wrp, .fi-fo-textarea { transition: none; }
}