/* Wfarhali 8.5 — one-tap product options. Scoped to the multi-product quote. */
body .wf-smart-quote .wf-auto-options-card{
  padding:18px!important;
  border:1px solid #e8def3!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 12px 32px rgba(67,31,105,.06)!important;
}
body .wf-smart-quote .wf-auto-options-card .wf-variant-card-head{
  margin-bottom:15px;
  padding-bottom:14px;
  border-bottom:1px solid #f0eaf6;
}
body .wf-smart-quote .wf-auto-options-card .wf-variant-card-head img{
  width:46px;height:46px;border-radius:12px;
}
body .wf-smart-quote .wf-auto-options-card .wf-variant-card-head span{font-size:9px}
body .wf-smart-quote .wf-auto-options-card .wf-variant-card-head b{font-size:12px}
.wf-auto-options{display:grid;gap:18px}
.wf-auto-options-intro{
  display:grid;grid-template-columns:max-content 1fr;align-items:center;gap:4px 9px;
  padding:13px 14px;border:1px solid #e9ddf6;border-radius:14px;
  background:linear-gradient(135deg,#f8f3ff,#fff);
}
.wf-auto-options-intro>span{
  grid-row:1/3;padding:7px 9px;border-radius:8px;background:#ede3fb;
  color:#6330a6;font:800 9px/1.2 Inter,Arial,sans-serif;text-transform:uppercase;letter-spacing:.04em;
}
.wf-auto-options-intro>b{color:#3b2057;font:800 13px/1.2 Inter,Arial,sans-serif}
.wf-auto-options-intro>small{color:#7c7087;font:500 10px/1.4 Inter,Arial,sans-serif}
.wf-auto-option-group{display:grid;gap:10px}
.wf-auto-option-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.wf-auto-option-heading b{color:#3b2057;font:800 12px/1.2 Inter,Arial,sans-serif}
.wf-auto-option-heading small{color:#92869d;font:600 9px/1.2 Inter,Arial,sans-serif}
.wf-auto-option-grid{display:flex;flex-wrap:wrap;gap:8px}
button.wf-auto-option{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:7px;
  min-width:48px;min-height:42px;padding:9px 12px;border:1px solid #e3dbe9;border-radius:11px;
  background:#fff;color:#50405d;font:750 10px/1 Inter,Arial,sans-serif;
  cursor:pointer;box-shadow:0 3px 8px rgba(61,31,79,.03);
  transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease,transform .16s ease;
}
button.wf-auto-option:hover{border-color:#aa84d3;background:#fcfaff;transform:translateY(-1px)}
button.wf-auto-option:focus-visible{outline:3px solid rgba(124,58,237,.2);outline-offset:2px}
button.wf-auto-option.is-selected{
  border-color:#7134c3;background:#f4edff;color:#4b168c;
  box-shadow:0 0 0 2px rgba(113,52,195,.1);
}
button.wf-auto-option.is-selected:after{
  content:"";position:absolute;right:5px;top:5px;width:6px;height:3px;
  border-left:2px solid #6b2bbb;border-bottom:2px solid #6b2bbb;transform:rotate(-45deg);
}
.wf-auto-option-swatch{
  width:15px;height:15px;flex:none;border:1px solid rgba(38,25,48,.18);border-radius:4px;
  background:var(--wf-option-color);box-shadow:inset 0 0 0 1px rgba(255,255,255,.42);
}
.wf-auto-colors button.wf-auto-option:first-child{min-width:104px}
.wf-auto-option-error{display:block;margin-top:1px;padding:9px 11px;border-radius:9px;background:#fff2f4;color:#ae2842;font:750 10px/1.35 Inter,Arial,sans-serif}
.wf-auto-option-error[hidden]{display:none!important}
.wf-auto-options-card.has-option-error .wf-auto-sizes{padding:7px;border:1px solid #e8a4b1;border-radius:13px;background:#fffafb}
.wf-auto-options-empty{
  display:flex;align-items:center;gap:11px;padding:13px 14px;border:1px solid #dceee5;border-radius:14px;background:#f7fcf9;
}
.wf-auto-options-empty>svg{width:24px;height:24px;padding:4px;border-radius:7px;background:#e3f5e9;color:#238351;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.wf-auto-options-empty b,.wf-auto-options-empty small{display:block}
.wf-auto-options-empty b{color:#28533e;font:800 11px/1.25 Inter,Arial,sans-serif}
.wf-auto-options-empty small{margin-top:3px;color:#6e8378;font:500 9px/1.35 Inter,Arial,sans-serif}
.wf-auto-note{margin-top:16px;border:1px solid #e9e1f0;border-radius:14px;background:#fcfbfd;overflow:hidden}
.wf-auto-note>summary{
  display:grid;grid-template-columns:20px 1fr 18px;align-items:center;gap:8px;padding:12px 13px;
  color:#5b4669;cursor:pointer;list-style:none;font:750 10px/1.25 Inter,Arial,sans-serif;
}
.wf-auto-note>summary::-webkit-details-marker{display:none}
.wf-auto-note>summary svg{width:18px;height:18px;fill:none;stroke:#7540b3;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.wf-auto-note>summary span small{margin-left:4px;color:#94889e;font-weight:600}
.wf-auto-note .wf-auto-note-chevron{transition:transform .18s ease}
.wf-auto-note[open] .wf-auto-note-chevron{transform:rotate(90deg)}
.wf-auto-note>label{display:block;padding:0 13px 7px;color:#4c3659;font:750 10px/1.2 Inter,Arial,sans-serif}
.wf-auto-note>textarea{
  display:block;width:calc(100% - 26px)!important;min-height:76px!important;margin:0 13px!important;
  box-sizing:border-box!important;resize:vertical!important;border:1px solid #ded3e8!important;border-radius:11px!important;
  background:#fff!important;padding:11px 12px!important;color:#41344b!important;
  font:500 11px/1.55 Inter,Arial,sans-serif!important;outline:none!important;
}
.wf-auto-note>textarea:focus{border-color:#8b5ac5!important;box-shadow:0 0 0 3px rgba(123,65,190,.1)!important}
.wf-auto-note>small{display:block;padding:7px 13px 12px;color:#94889d;font:500 9px/1.35 Inter,Arial,sans-serif}
@media(max-width:590px){
  body .wf-smart-quote .wf-auto-options-card{padding:14px!important;border-radius:18px!important}
  .wf-auto-options-intro{grid-template-columns:1fr;gap:5px}
  .wf-auto-options-intro>span{grid-row:auto;width:max-content}
  .wf-auto-option-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .wf-auto-colors{grid-template-columns:repeat(2,minmax(0,1fr))}
  button.wf-auto-option{width:100%;min-width:0;min-height:44px;padding:9px 7px;font-size:9.5px}
  .wf-auto-colors button.wf-auto-option:first-child{min-width:0;grid-column:1/-1}
}
