/* ── Quick Order WooCommerce — Frontend Styles ─────────────────── */
.qow-wrap {
    --qow-primary:       #2563eb;
    --qow-primary-hover: #1d4ed8;
    --qow-btn-text:      #ffffff;
    --qow-form-bg:       #ffffff;
    --qow-section-bg:    #f8fafc;
    --qow-input-bg:      #ffffff;
    --qow-input-border:  #cbd5e1;
    --qow-label:         #374151;
    --qow-text:          #1e293b;
    --qow-muted:         #64748b;
    --qow-danger:        #dc2626;
    --qow-danger-bg:     #fef2f2;
    --qow-success:       #16a34a;
    --qow-success-bg:    #f0fdf4;
    --qow-max-width:     860px;
    --qow-form-radius:   12px;
    --qow-input-radius:  6px;
    --qow-btn-radius:    6px;
    --qow-font-size:     15px;

    font-family: inherit;
    font-size: var(--qow-font-size);
    color: var(--qow-text);
    line-height: 1.5;
    max-width: var(--qow-max-width);
}

/* ── Title ─────────────────────────────────────────────────────── */
.qow-title {
    font-size: 1.5em;
    font-weight: 700;
    color: var(--qow-text);
    margin: 0 0 1.25rem;
    padding-bottom: .5rem;
    border-bottom: 3px solid var(--qow-primary);
}

/* ── Alerts ─────────────────────────────────────────────────────── */
.qow-alert {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .875rem 1rem;
    border-radius: var(--qow-input-radius);
    margin-bottom: 1rem;
    font-weight: 500;
}
.qow-success { background: var(--qow-success-bg); color: var(--qow-success); border: 1px solid #bbf7d0; }
.qow-error   { background: var(--qow-danger-bg);  color: var(--qow-danger);  border: 1px solid #fecaca; }

/* ── Form ───────────────────────────────────────────────────────── */
.qow-form { background: var(--qow-form-bg); border-radius: var(--qow-form-radius); }

/* ── Section ────────────────────────────────────────────────────── */
.qow-section {
    background: var(--qow-section-bg);
    border: 1px solid #e2e8f0;
    border-radius: var(--qow-input-radius);
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
}
.qow-section:last-child { margin-bottom: 0; }
.qow-section-title {
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: var(--qow-primary);
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: .4rem;
}
.qow-icon { font-style: normal; font-size: 1rem; }

/* ── Grid ───────────────────────────────────────────────────────── */
.qow-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}
.qow-col-12 { flex: 0 0 100%; }
.qow-col-6  { flex: 0 0 calc(50% - .5rem); min-width: 180px; }
.qow-col-4  { flex: 0 0 calc(33.33% - .67rem); min-width: 140px; }

@media (max-width: 580px) {
    .qow-col-6, .qow-col-4 { flex: 0 0 100%; }
}

/* ── Fields ─────────────────────────────────────────────────────── */
.qow-field {
    display: flex;
    flex-direction: column;
    gap: .3rem;
}
.qow-field label {
    font-size: .875rem;
    font-weight: 500;
    color: var(--qow-label);
}
.qow-req { color: var(--qow-danger); }
.qow-err {
    font-size: .8rem;
    color: var(--qow-danger);
    display: none;
}

/* ── Inputs ─────────────────────────────────────────────────────── */
.qow-input {
    width: 100%;
    box-sizing: border-box;
    padding: .5rem .75rem;
    border: 1.5px solid var(--qow-input-border);
    border-radius: var(--qow-input-radius);
    font-size: var(--qow-font-size);
    font-family: inherit;
    color: var(--qow-text);
    background: var(--qow-input-bg);
    transition: border-color .15s, box-shadow .15s;
    -webkit-appearance: none;
    appearance: none;
}
.qow-input:focus {
    outline: none;
    border-color: var(--qow-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--qow-primary) 18%, transparent);
}
.qow-input.qow-invalid { border-color: var(--qow-danger); }
.qow-textarea { resize: vertical; min-height: 80px; }
select.qow-input {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2364748b' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .75rem center;
    padding-right: 2rem;
    cursor: pointer;
}

/* ── Product rows ───────────────────────────────────────────────── */
.qow-product-rows { display: flex; flex-direction: column; gap: .75rem; margin-bottom: .75rem; }

.qow-product-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: .75rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: var(--qow-input-radius);
    padding: .875rem 1rem;
    position: relative;
}

.qow-row-product { flex: 1 1 260px; min-width: 200px; display: flex; flex-direction: column; gap: .4rem; }
.qow-row-variation { margin-top: .4rem; }

.qow-row-qty,
.qow-row-price,
.qow-row-total {
    display: flex;
    flex-direction: column;
    gap: .3rem;
}
.qow-row-qty   { flex: 0 0 130px; }
.qow-row-price { flex: 0 0 90px; }
.qow-row-total { flex: 0 0 100px; }

.qow-row-price label,
.qow-row-total label,
.qow-row-qty   label {
    font-size: .78rem;
    font-weight: 500;
    color: var(--qow-muted);
}
.qow-unit-price,
.qow-line-total {
    font-size: .9375rem;
    color: var(--qow-text);
    font-weight: 500;
    padding-top: .1rem;
}
.qow-line-total { font-weight: 700; }

/* Qty box */
.qow-qty-box {
    display: flex;
    align-items: center;
    border: 1.5px solid var(--qow-input-border);
    border-radius: var(--qow-input-radius);
    overflow: hidden;
    width: 120px;
}
.qow-qty-btn {
    background: #f1f5f9;
    border: none;
    padding: .45rem .6rem;
    cursor: pointer;
    font-size: 1rem;
    line-height: 1;
    color: var(--qow-text);
    transition: background .12s;
    flex-shrink: 0;
}
.qow-qty-btn:hover { background: #e2e8f0; }
.qow-qty {
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    text-align: center;
    width: 46px;
    flex: 1;
    padding: .45rem .2rem !important;
}
.qow-qty::-webkit-inner-spin-button,
.qow-qty::-webkit-outer-spin-button { -webkit-appearance: none; }

/* Remove */
.qow-remove-row {
    background: none;
    border: 1.5px solid #fca5a5;
    border-radius: 5px;
    color: var(--qow-danger);
    cursor: pointer;
    padding: .35rem .55rem;
    font-size: .95rem;
    line-height: 1;
    align-self: flex-end;
    transition: background .12s;
    margin-left: auto;
}
.qow-remove-row:hover { background: var(--qow-danger-bg); }

/* ── Add row button ─────────────────────────────────────────────── */
.qow-add-row {
    width: 100%;
    padding: .6rem 1rem;
    background: color-mix(in srgb, var(--qow-primary) 8%, transparent);
    color: var(--qow-primary);
    border: 1.5px dashed var(--qow-primary);
    border-radius: var(--qow-input-radius);
    font-size: .9rem;
    font-weight: 600;
    cursor: pointer;
    margin-bottom: 1rem;
    transition: background .15s;
}
.qow-add-row:hover { background: color-mix(in srgb, var(--qow-primary) 16%, transparent); }

/* ── Summary ────────────────────────────────────────────────────── */
.qow-summary {
    border-top: 1px solid #e2e8f0;
    padding-top: .75rem;
    margin-top: .25rem;
}
.qow-summary-line {
    display: flex;
    justify-content: space-between;
    padding: .25rem 0;
    font-size: .9375rem;
    color: var(--qow-muted);
}
.qow-summary-total {
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--qow-text);
    border-top: 2px solid #e2e8f0;
    margin-top: .35rem;
    padding-top: .5rem;
}

/* ── Notice (no products) ──────────────────────────────────────── */
.qow-notice {
    color: var(--qow-muted);
    font-style: italic;
    padding: .75rem 0;
}

/* ── Submit ─────────────────────────────────────────────────────── */
.qow-footer { margin-top: 1.5rem; }
.qow-submit {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .75rem 2rem;
    background: var(--qow-primary);
    color: var(--qow-btn-text);
    border: none;
    border-radius: var(--qow-btn-radius);
    font-size: 1rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: background .15s, transform .1s;
}
.qow-submit:hover:not(:disabled) { background: var(--qow-primary-hover); }
.qow-submit:active:not(:disabled) { transform: translateY(1px); }
.qow-submit:disabled { opacity: .65; cursor: not-allowed; }

.qow-spinner {
    width: 1em;
    height: 1em;
    border: 2px solid rgba(255,255,255,.35);
    border-top-color: #fff;
    border-radius: 50%;
    animation: qow-spin .65s linear infinite;
}
@keyframes qow-spin { to { transform: rotate(360deg); } }

.qow-privacy {
    font-size: .8rem;
    color: var(--qow-muted);
    margin: .6rem 0 0;
}
.qow-privacy a { color: var(--qow-primary); }