/* Woo Custom Fields Pro — Frontend */
.wcf-fields-wrap { margin: 16px 0; }
.wcf-group        { margin-bottom: 10px; }
.wcf-field        { margin-bottom: 18px; }

.wcf-label  { display: block; font-weight: 600; margin-bottom: 5px; font-size: .95em; }
.wcf-desc   { font-size: .85em; color: #666; margin: 2px 0 8px; }
.wcf-empty  { color: #999; font-size: .85em; }

/* Color swatches */
.wcf-swatches    { display: flex; flex-wrap: wrap; gap: 8px; }
.wcf-swatch-wrap { position: relative; }
.wcf-swatch {
    width: 36px; height: 36px;
    border-radius: 50%;
    border: 3px solid transparent;
    cursor: pointer;
    transition: transform .15s, border-color .15s;
    padding: 0;
    display: block;
}
.wcf-swatch:hover       { transform: scale(1.12); }
.wcf-swatch--on         { border-color: #333 !important; transform: scale(1.12); }
.wcf-swatch-wrap:hover::after,
.wcf-swatch-wrap:focus-within::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    background: #333; color: #fff;
    font-size: 11px; white-space: nowrap;
    padding: 3px 7px; border-radius: 3px;
    pointer-events: none; z-index: 99;
}

/* Campos numéricos con etiqueta */
.wcf-lnum-items { display: flex; flex-wrap: wrap; gap: 12px 18px; }
.wcf-lnum-item  { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.wcf-lnum-lbl   { font-size: .82em; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #444; }
.wcf-lnum-input {
    width: 64px !important;
    text-align: center !important;
    padding: 8px 4px !important;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 1em;
    -moz-appearance: textfield;
}
.wcf-lnum-input:focus { border-color: #0073aa; outline: none; box-shadow: 0 0 0 2px rgba(0,115,170,.15); }
.wcf-lnum-input::-webkit-outer-spin-button,
.wcf-lnum-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Upload */
.wcf-upload-area {
    border: 2px dashed #ccc;
    border-radius: 6px;
    padding: 24px 16px;
    text-align: center;
    cursor: pointer;
    transition: border-color .2s, background .2s;
    background: #fafafa;
}
.wcf-upload-area:hover, .wcf-upload-area.wcf-drag-over { border-color: #0073aa; background: #f0f7fb; }
.wcf-upload-icon { color: #aaa; margin-bottom: 8px; }
.wcf-upload-hint { font-size: .78em; color: #999; margin: 4px 0 0; }
.wcf-click-lbl   { color: #0073aa; text-decoration: underline; cursor: pointer; font-weight: 600; }
.wcf-file-item   { display: flex; align-items: center; gap: 8px; padding: 5px 0; font-size: .88em; }
.wcf-file-rm     { background: none; border: none; color: #c00; cursor: pointer; font-size: 1.1em; line-height: 1; padding: 0; }
.wcf-uploading   { color: #888; font-size: .85em; margin: 4px 0; }

/* Textarea */
.wcf-textarea   { width: 100% !important; }
.wcf-char-count { font-size: .78em; color: #999; margin: 3px 0 0; text-align: right; }
.wcf-char-count.wcf-near-limit { color: #d47b00; }
.wcf-char-count.wcf-at-limit   { color: #c00; }