/* 1.6.4: one disclosure mark, based on the existing model picker.
   Local decoration only. Forward/back/action arrows are intentionally untouched. */
:where(.calculator-body,.admin-body){
  --ti-chevron-size:1.3125rem;
  --ti-chevron-ink:#7290a5;
  --ti-chevron-duration:.18s;
  --ti-chevron-down:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6' fill='none' stroke='%237290a5' stroke-width='1.65' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
:where(.calculator-body,.admin-body) .ti-disclosure-chevron,
.calculator-body .model-toggle>.ti-icon{
  display:block;width:var(--ti-chevron-size);height:var(--ti-chevron-size);flex:none;
  fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;
  color:var(--ti-chevron-ink);pointer-events:none;transform-origin:center;
  transition:transform var(--ti-chevron-duration) ease,color var(--ti-chevron-duration) ease;
}
.calculator-body .model-toggle[aria-expanded="true"]>.ti-icon,
.ti-select-trigger[aria-expanded="true"]>.ti-disclosure-chevron{
  transform:rotate(180deg);color:var(--accent-ink,#007da7);
}
/* Native controls remain operable before/without the progressive enhancement. */
:where(.calculator-body,.admin-body) select:not([multiple]):not([size]),
:where(.calculator-body,.admin-body) select[size="1"]{
  appearance:none;-webkit-appearance:none;
  background-image:var(--ti-chevron-down);background-repeat:no-repeat;
  background-position:right 1.03125rem center;background-size:var(--ti-chevron-size);
  padding-right:3.375rem;
}
.ti-select-shell{position:relative;min-width:0;width:100%}
/* Keep the original named select as the sole value source and a no-JS fallback. */
.calculator-body .ti-select-source{
  position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;
  margin:-1px!important;padding:0!important;border:0!important;overflow:hidden!important;
  clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;
}
.calculator-body .ti-select-trigger{
  display:flex;align-items:center;width:100%;max-width:100%;min-width:0;min-height:4rem;
  height:auto;padding:1rem 3.5rem 1rem 1.125rem;position:relative;
  font:inherit;font-size:1.125rem;font-weight:400;line-height:1.5;text-align:left;
  background:var(--field,#f7fbfd);color:var(--ink,#17212b);border:1px solid #a8c5d6;
  border-radius:13px;cursor:pointer;
  transition:border-color var(--ti-chevron-duration) ease,box-shadow var(--ti-chevron-duration) ease;
}
.calculator-body .ti-select-trigger-text{min-width:0;overflow-wrap:anywhere;word-break:normal}
.calculator-body .ti-select-trigger>.ti-disclosure-chevron{
  position:absolute;right:1.03125rem;top:calc(50% - var(--ti-chevron-size)/2);
}
.calculator-body .ti-select-trigger:hover:not(:disabled){border-color:#79cbe8}
.calculator-body .ti-select-trigger[aria-expanded="true"]{border-color:var(--accent,#00bbf9)}
.calculator-body .ti-select-trigger:focus-visible{outline:3px solid var(--focus,#007aab);outline-offset:4px}
.calculator-body .ti-select-trigger:disabled{opacity:.65;cursor:not-allowed}
.calculator-body .ti-select-trigger:disabled>.ti-disclosure-chevron{opacity:.6}
.calculator-body .ti-select-popup{
  position:absolute;top:calc(100% + 7px);left:0;right:0;z-index:30;
  background:#fff;border:1px solid #c9e4f1;border-radius:16px;
  box-shadow:0 14px 38px #153e571c;overflow:hidden;min-width:0;
}
.calculator-body .ti-select-options{
  max-height:21.25rem;max-height:min(21.25rem,55vh);overflow-y:auto;padding:.5rem;
  overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c6e3ee transparent;
}
.calculator-body .ti-select-option{
  display:flex;align-items:center;gap:.625rem;min-height:3.5rem;padding:.8125rem .875rem;
  border-radius:12px;font-size:1.125rem;line-height:1.5;color:var(--ink,#17212b);cursor:pointer;
}
.calculator-body .ti-select-option>span{min-width:0;flex:1;overflow-wrap:anywhere}
.calculator-body .ti-select-option.is-active,
.calculator-body .ti-select-option:hover{background:#f0faff}
.calculator-body .ti-select-option[aria-selected="true"]{background:#eaf8ff;color:#006e98;font-weight:800}
.calculator-body .ti-select-option[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.calculator-body .ti-select-option>.ti-icon{width:1.4375rem;height:1.4375rem;flex:none;color:#007da7}
.calculator-body .ti-select-option:not([aria-selected="true"])>.ti-icon{visibility:hidden}
/* A checkbox is still a checkbox, not a second button with a conflicting handler. */
.calculator-body .shop-toggle>.ti-disclosure-chevron{margin:.3rem 0 0 auto}
.calculator-body .shop-toggle>span{flex:1}
.calculator-body .shop-toggle>input:checked~.ti-disclosure-chevron{transform:rotate(180deg);color:var(--accent-ink,#007da7)}
.calculator-body .shop-toggle>input:disabled~.ti-disclosure-chevron{opacity:.6}
/* The administration keeps native selects (including OS pickers on phones).
   The wrapper decorates only single-selects; multiple/list controls are not touched. */
.admin-body .ti-native-select{position:relative;width:100%;min-width:0}
.admin-body .ti-native-select>select{display:block;width:100%;background-image:none!important;padding-right:3.375rem}
.admin-body .ti-native-select>.ti-disclosure-chevron{position:absolute;right:1.03125rem;top:calc(50% - var(--ti-chevron-size)/2)}
.admin-body .ti-native-select:has(>select:disabled)>.ti-disclosure-chevron{opacity:.5}
/* Rotation follows actual native open state, never just keyboard focus. */
@supports selector(select:open){
  .admin-body .ti-native-select:has(>select:open)>.ti-disclosure-chevron{transform:rotate(180deg);color:#007da7}
}
:where(.calculator-body,.admin-body) details>summary{
  position:relative;list-style:none;padding-right:3rem;
}
:where(.calculator-body,.admin-body) details>summary::marker{content:""}
:where(.calculator-body,.admin-body) details>summary::-webkit-details-marker{display:none}
:where(.calculator-body,.admin-body) details>summary::after{
  content:"";position:absolute;right:.4rem;top:calc(50% - var(--ti-chevron-size)/2);
  display:block;width:var(--ti-chevron-size);height:var(--ti-chevron-size);
  background:var(--ti-chevron-down) center/contain no-repeat;pointer-events:none;
  transition:transform var(--ti-chevron-duration) ease;
}
:where(.calculator-body,.admin-body) details[open]>summary::after{transform:rotate(180deg)}
@media(prefers-reduced-motion:reduce){
  :where(.calculator-body,.admin-body){--ti-chevron-duration:0s}
  .calculator-body .model-toggle>.ti-icon{transition:none}
}
@media(forced-colors:active){
  .calculator-body .ti-select-trigger,.calculator-body .ti-select-popup{background:Canvas;color:CanvasText;border-color:ButtonText}
  .calculator-body .ti-select-option.is-active{outline:2px solid Highlight;outline-offset:-2px}
  .calculator-body .ti-select-option[aria-selected="true"]{outline:2px solid Highlight;outline-offset:-2px}
  :where(.calculator-body,.admin-body) .ti-disclosure-chevron,.calculator-body .model-toggle>.ti-icon{color:ButtonText}
  :where(.calculator-body,.admin-body) details>summary::after{background-color:ButtonText;mask:var(--ti-chevron-down) center/contain no-repeat}
}

.calculator-body .ti-select-popup[data-placement="top"]{top:auto;bottom:calc(100% + 7px)}
.calculator-body .shop-inputs .field>label{margin:0}

/* Same model-button geometry at regular and enlarged text sizes. */
.calculator-body .model-toggle{width:2.5rem;height:2.875rem;right:.4375rem}
.calculator-body #model-clear{width:2.5rem;height:2.875rem;right:2.9375rem}
.calculator-body #model-clear>.ti-icon{width:var(--ti-chevron-size);height:var(--ti-chevron-size)}
.calculator-body .search-wrap input{padding-right:5.75rem}

.admin-body .ti-native-select:has(>select[hidden]){display:none}
.admin-body .ti-native-select:has(>select[multiple])>.ti-disclosure-chevron{display:none}
