/* Brand variables (from Mercado CVI) */
/* Primary #3C3A36, Accent #A67C52, Text #2A2A2A, Bg #F4F4F2, Sand #D9D2C3 */
:root{
  --mc-primary: #3C3A36;   /* main dark */  /* PDF: Primary */ 
  --mc-accent:  #A67C52;   /* gold */       /* PDF: Second  */ 
  --mc-text:    #2A2A2A;   /* text */       /* PDF: Text    */ 
  --mc-bg:      #F4F4F2;   /* light bg */   /* PDF: Background */
  --mc-sand:    #D9D2C3;   /* subtle tint *//* PDF: D9D2C3  */

  --mc-radius: 999px;      /* fully rounded pills */
  --mc-gap: .5rem;
  --mc-pad-y: .45rem;
  --mc-pad-x: .9rem;
  --mc-font: 'Roboto', system-ui, -apple-system, Segoe UI, Arial, sans-serif;
}

/* Load Roboto (Bold + Light). If theme already loads it, you can skip this. */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: local('Roboto Light'), local('Roboto-Light');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local('Roboto Bold'), local('Roboto-Bold');
}

/* Selector container */
.korrus-selector {
  font-family: var(--mc-font); /* Roboto Light + Bold as needed */  /* PDF fonts */
  margin: .25rem 0 1rem 0;
}

/* Horizontal pill list that scrolls nicely on mobile */
.korrus-selector__list{
  display: flex;
  gap: var(--mc-gap);
  padding: .25rem;
  margin: 0;
  list-style: none;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.korrus-selector__list::-webkit-scrollbar{ height: 6px; }
.korrus-selector__list::-webkit-scrollbar-thumb{ background: color-mix(in oklab, var(--mc-primary) 35%, transparent); border-radius: 3px; }

/* Minimal pill buttons */
.korrus-selector__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.4rem; /* good for single-digit floors */
  padding: var(--mc-pad-y) var(--mc-pad-x);
  border-radius: var(--mc-radius);
  text-decoration: none;
  border: 1px solid color-mix(in oklab, var(--mc-primary) 18%, transparent);
  background: color-mix(in oklab, var(--mc-bg) 92%, white);
  color: var(--mc-primary);
  font-weight: 700; /* Roboto Bold for legibility */
  letter-spacing: .02em;
  line-height: 1;
  transition: background .2s ease, border-color .2s ease, color .2s ease, transform .06s ease;
  box-shadow: 0 1px 0 rgba(0,0,0,.03);
}
.korrus-selector--compact .korrus-selector__btn{
  padding: .375rem .75rem;
}

/* Hover / focus */
.korrus-selector__btn:hover{
  background: color-mix(in oklab, var(--mc-sand) 30%, white);
  border-color: color-mix(in oklab, var(--mc-primary) 28%, transparent);
}
.korrus-selector__btn:focus-visible{
  outline: 2px solid color-mix(in oklab, var(--mc-accent) 80%, white);
  outline-offset: 2px;
}

/* Active state: solid pill with gold accent text or inverse */
.korrus-selector__btn.is-active{
  background: var(--mc-primary);
  color: #fff;
  border-color: var(--mc-primary);
  box-shadow: 0 2px 10px rgba(60,58,54,.15);
}

/* Optional subtle press feedback */
.korrus-selector__btn:active{
  transform: translateY(1px);
}

/* Label */
.korrus-selector__label{
  font-variant-numeric: tabular-nums;
}

/* Dark sections compatibility */
.section--dark .korrus-selector__btn{
  border-color: color-mix(in oklab, #fff 25%, var(--mc-primary));
  background: color-mix(in oklab, rgba(255,255,255,.06) 50%, transparent);
  color: #fff;
}
.section--dark .korrus-selector__btn.is-active{
  background: #fff;
  color: var(--mc-primary);
}

/* Floor plan status fills (from your shortcode’s classes) */
.status-available-fill { fill: color-mix(in oklab, #00a03c 40%, transparent); }
.status-reserved-fill  { fill: color-mix(in oklab, #ffa500 35%, transparent); }
.status-occupied-fill  { fill: color-mix(in oklab, #c00000 28%, transparent); }


.mercado-imp-tooltip{
  position:absolute;
  z-index:99999;
  pointer-events: auto;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 8px 24px rgba(0,0,0,.12);
  border-radius:10px;
  padding:14px 16px;
  min-width:180px;
  max-width:260px;
  font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
.mercado-imp-tooltip .mi-title{ font-weight:600; margin-bottom:6px; color:#3C3A36; }
.mercado-imp-tooltip .mi-sub{ font-size:12px; opacity:.8; margin-bottom:.55rem; margin-top:-2px;}
.mercado-imp-tooltip .mi-price{ font-weight:600; margin-bottom:.25rem; font-size:16px; }
.mercado-imp-tooltip .mi-size{ opacity:.85; margin-bottom:10px; }
.mercado-imp-tooltip .mi-btn{
  display:inline-block; padding:8px 10px; border-radius:8px;
  text-decoration:none; border:1px solid #2F5B4C; color:#2F5B4C; font-weight:600; margin-top:4px;
}
.mercado-imp-tooltip .mi-btn:hover{ background:#2F5B4C; color:#fff; }
.imp-ui, .imp-canvas, .imp-container {
  z-index: auto; /* avoid huge z-stack on some themes */
}