.wfa-addons-wrapper{ padding: 12px 0px;margin:12px 0;background:#fff}
.wfa-group{margin-bottom:12px}
.wfa-field{margin:8px 0}
.wfa-field-header{margin-bottom:8px}
.wfa-swatch-wrapper, .wfa-color-wrapper, .wfa-checkbox-wrapper {
  display: grid;
  gap: 10px;
  align-items: start;
}
/* default grid: updated by JS to match count (1..6) */
.wfa-swatch-wrapper[data-cols="1"]{grid-template-columns: repeat(1, 1fr);}
.wfa-swatch-wrapper[data-cols="2"]{grid-template-columns: repeat(2, 1fr);}
.wfa-swatch-wrapper[data-cols="3"]{grid-template-columns: repeat(3, 1fr);}
.wfa-swatch-wrapper[data-cols="4"]{grid-template-columns: repeat(4, 1fr);}
.wfa-swatch-wrapper[data-cols="5"]{grid-template-columns: repeat(5, 1fr);}
.wfa-swatch-wrapper[data-cols="6"]{grid-template-columns: repeat(6, 1fr);}
/* same for color and checkbox wrappers */
.wfa-color-wrapper[data-cols="1"]{grid-template-columns: repeat(1, 1fr);}
.wfa-color-wrapper[data-cols="2"]{grid-template-columns: repeat(2, 1fr);}
.wfa-color-wrapper[data-cols="3"]{grid-template-columns: repeat(3, 1fr);}
.wfa-color-wrapper[data-cols="4"]{grid-template-columns: repeat(4, 1fr);}
.wfa-color-wrapper[data-cols="5"]{grid-template-columns: repeat(5, 1fr);}
.wfa-color-wrapper[data-cols="6"]{grid-template-columns: repeat(6, 1fr);}
.wfa-checkbox-wrapper[data-cols="1"]{grid-template-columns: repeat(1, 1fr);}
.wfa-checkbox-wrapper[data-cols="2"]{grid-template-columns: repeat(2, 1fr);}
.wfa-checkbox-wrapper[data-cols="3"]{grid-template-columns: repeat(3, 1fr);}
.wfa-checkbox-wrapper[data-cols="4"]{grid-template-columns: repeat(4, 1fr);}
.wfa-checkbox-wrapper[data-cols="5"]{grid-template-columns: repeat(5, 1fr);}
.wfa-checkbox-wrapper[data-cols="6"]{grid-template-columns: repeat(6, 1fr);}

/* mobile: 3 columns max */
@media(max-width:768px){
  .wfa-swatch-wrapper[data-cols="1"], .wfa-color-wrapper[data-cols="1"], .wfa-checkbox-wrapper[data-cols="1"]{grid-template-columns: repeat(1,1fr);}
  .wfa-swatch-wrapper[data-cols="2"], .wfa-color-wrapper[data-cols="2"], .wfa-checkbox-wrapper[data-cols="2"]{grid-template-columns: repeat(2,1fr);}
  .wfa-swatch-wrapper[data-cols="3"], .wfa-color-wrapper[data-cols="3"], .wfa-checkbox-wrapper[data-cols="3"]{grid-template-columns: repeat(3,1fr);}
  .wfa-swatch-wrapper[data-cols="4"], .wfa-color-wrapper[data-cols="4"], .wfa-checkbox-wrapper[data-cols="4"]{grid-template-columns: repeat(3,1fr);}
  .wfa-swatch-wrapper[data-cols="5"], .wfa-color-wrapper[data-cols="5"], .wfa-checkbox-wrapper[data-cols="5"]{grid-template-columns: repeat(3,1fr);}
  .wfa-swatch-wrapper[data-cols="6"], .wfa-color-wrapper[data-cols="6"], .wfa-checkbox-wrapper[data-cols="6"]{grid-template-columns: repeat(3,1fr);}
}

/* swatch visuals */
.wfa-swatch { cursor:pointer; padding:6px; border:1px solid transparent; display:block; text-align:center; border-radius:6px; background:#fff; }
.wfa-swatch img{max-width:100%;height:auto;display:block;margin:0 auto 6px;border-radius:4px}
.wfa-swatch.selected{outline:3px solid #1e90ff; box-shadow:0 2px 6px rgba(30,144,255,0.1);}
.wfa-color-swatch{cursor:pointer; padding:6px; border:1px solid transparent; text-align:center; border-radius:6px; display:flex; align-items:center; gap:8px;}
.wfa-color-circle{width:28px;height:28px;border-radius:50%;border:1px solid #ccc;display:inline-block}
.wfa-color-swatch.selected{outline:3px solid #1e90ff; box-shadow:0 2px 6px rgba(30,144,255,0.1);}
#wfa-preview img{max-width:320px;display:block;margin-bottom:8px}
#wfa-summary{margin-top:10px;padding:8px;background:#fafafa;border-radius:6px}

/* tooltip image container (used by frontend JS) */
#wfa-tooltip img{max-width:260px;max-height:260px;display:block}

/* checkbox option price under label */
.wfa-checkbox .wfa-opt-label-text{display:inline-block;margin-left:6px;vertical-align:middle}
.wfa-checkbox .wfa-option-price{display:block;margin-top:6px;font-size:0.92em;color:#666}
.wfa-checkbox input[type=checkbox]{vertical-align:middle;margin-right:6px}

/* tooltip icon next to option labels */
.wfa-opt-tooltip{display:inline-block;margin-left:6px;color:#d9534f;cursor:help;font-weight:700}
.wfa-opt-tooltip[data-tooltip]:hover::after{content:attr(data-tooltip);position:absolute;background:#333;color:#fff;padding:6px;border-radius:4px;white-space:nowrap;transform:translateY(-50%);margin-left:8px;z-index:9999}

/* select tooltip icon */
.wfa-select-tooltip-icon{display:inline-block;margin-left:8px;color:#d9534f;cursor:help;font-weight:700}
.wfa-select-tooltip-icon[data-tooltip]:hover::after{content:attr(data-tooltip);position:absolute;background:#333;color:#fff;padding:6px;border-radius:4px;white-space:nowrap;transform:translateY(-50%);margin-left:8px;z-index:9999}

/* field label tooltip */
.wfa-field-tooltip{display:inline-block;margin-left:6px;color:#d9534f;cursor:help;font-weight:700}
.wfa-field-tooltip[data-tooltip]:hover::after{content:attr(data-tooltip);position:absolute;background:#333;color:#fff;padding:6px;border-radius:4px;white-space:nowrap;transform:translateY(-50%);margin-left:8px;z-index:9999}

/* character counter for inputs/textareas with maxlength */
.wfa-char-counter{font-size:0.85em;color:#666;margin-top:6px}
.wfa-char-counter:before{content:'📏 ';}

/* show a consistent checkmark both when JS adds .selected or when the native input is checked */
/* removed pseudo-check to keep native checkbox appearance */
/*Los mios */
fieldset legend{
    margin-bottom: 0 !important;
    padding: 0;
  }

  fieldset
 {
    padding: 0px 10px;
  }

  .wfa-swatch.selected
 {
    outline: 2px solid #000000 !important;
  }
  .wfa-swatch {
    border-radius: 3px;
  }
.wfa-opt-price{
  color: #919191;
}
  .wfa-swatch .wfa-opt-label{
font-size: 12px !important;
display: none;
  }
.wfa-swatch .wfa-opt-price{
  font-size: 12px !important;
}