/**
 * WC Tea Bulk Ordering — Frontend Styles
 *
 * Green premium theme. BEM naming under the .wc-tea-bulk-* namespace.
 * Button rules are scoped under .wc-tea-bulk-wrap and use !important on the
 * core colour properties so they reliably override theme button styles.
 */

:root {
        --tb-green:        #648935;
        --tb-green-dark:   #486b1b;
        --tb-green-darker: #3a5715;
        --tb-price:        #648935;
        --tb-panel-bg:     #f1f6e9;
        --tb-panel-border: #d7e4c2;
        --tb-row-border:   #e6e6e6;
        --tb-text:         #1c1c1c;
        --tb-muted:        #6b6b6b;
}

/* -----------------------------------------------------------------------
   Wrap
   --------------------------------------------------------------------- */
.wc-tea-bulk-form,
.wc-tea-bulk-wrap {
        margin: 0;
}

.wc-tea-bulk-wrap {
        margin: 16px 0;
        font-family: inherit;
        color: var(--tb-text);
}

.wc-tea-bulk__section {
        margin-bottom: 22px;
}

/* -----------------------------------------------------------------------
   Pricing header (Less than / More than 25 lb)
   --------------------------------------------------------------------- */
.wc-tea-bulk__pricing {
        margin: 0 0 26px;
}

.wc-tea-bulk__price-row {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 12px;
        padding: 14px 0;
        border-bottom: 1px solid #ececec;
        flex-wrap: wrap;
}

.wc-tea-bulk__price-row:last-child {
        border-bottom: none;
}

.wc-tea-bulk__price-label {
        font-size: 1.05rem;
        color: var(--tb-text);
        font-weight: 400;
}

.wc-tea-bulk__price-value {
        font-size: 1.6rem;
        font-weight: 700;
        color: var(--tb-price);
        line-height: 1.2;
        white-space: nowrap;
}

.wc-tea-bulk__price-value .woocommerce-Price-amount,
.wc-tea-bulk__price-value bdi {
        color: var(--tb-price);
}

.wc-tea-bulk__per {
        font-size: 1.6rem;
        font-weight: 700;
        color: var(--tb-price);
}

.wc-tea-bulk__tax {
        font-size: 0.8rem;
        font-style: italic;
        font-weight: 400;
        color: var(--tb-muted);
        margin-left: 4px;
}

/* -----------------------------------------------------------------------
   Heading
   --------------------------------------------------------------------- */
.wc-tea-bulk__heading {
        font-size: 0.95rem;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: var(--tb-green-darker);
        margin: 0 0 12px;
        padding: 0;
}

/* -----------------------------------------------------------------------
   Table
   --------------------------------------------------------------------- */
.wc-tea-bulk__table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
}

.wc-tea-bulk__table {
        width: 100%;
        border-collapse: collapse;
        background: #fff;
        border: 1px solid var(--tb-panel-border);
        border-radius: 10px;
        overflow: hidden;
}

.wc-tea-bulk__table thead tr {
        background: var(--tb-panel-bg);
}

.wc-tea-bulk__table th,
.wc-tea-bulk__table td {
        padding: 12px 14px;
        text-align: left;
        border-bottom: 1px solid #eee;
        font-size: 0.92rem;
        vertical-align: middle;
}

.wc-tea-bulk__table th {
        font-weight: 700;
        color: var(--tb-green-darker);
        white-space: nowrap;
}

.wc-tea-bulk__table tbody tr:last-child td {
        border-bottom: none;
}

.wc-tea-bulk__table tbody tr:hover {
        background: #fafdf5;
}

.wc-tea-bulk__col-remove {
        width: 56px;
        text-align: center !important;
}

/* -----------------------------------------------------------------------
   Package size select
   --------------------------------------------------------------------- */
.wc-tea-bulk__size-select {
        width: 100%;
        max-width: 170px;
        padding: 9px 12px;
        border: 1px solid #cfcfcf;
        border-radius: 8px;
        background: #fff;
        font-size: 0.92rem;
        color: var(--tb-text);
        cursor: pointer;
        transition: border-color 0.2s, box-shadow 0.2s;
}

.wc-tea-bulk__size-select:focus {
        border-color: var(--tb-green);
        outline: 0;
        box-shadow: 0 0 0 3px rgba(100, 137, 53, 0.18);
}

/* -----------------------------------------------------------------------
   Quantity input
   --------------------------------------------------------------------- */
.wc-tea-bulk__qty-input {
        width: 100%;
        max-width: 110px;
        padding: 9px 12px;
        border: 1px solid #cfcfcf;
        border-radius: 8px;
        font-size: 0.92rem;
        color: var(--tb-text);
        text-align: center;
        transition: border-color 0.2s, box-shadow 0.2s;
}

.wc-tea-bulk__qty-input:focus {
        border-color: var(--tb-green);
        outline: 0;
        box-shadow: 0 0 0 3px rgba(100, 137, 53, 0.18);
}

/* -----------------------------------------------------------------------
   Remove button (round, green) — override theme button styles
   --------------------------------------------------------------------- */
.wc-tea-bulk-wrap .wc-tea-bulk__remove-row {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        background: #fff !important;
        border: 1.5px solid var(--tb-green) !important;
        border-radius: 50% !important;
        color: var(--tb-green) !important;
        font-size: 1.1rem;
        line-height: 1;
        cursor: pointer;
        transition: background 0.2s, color 0.2s, transform 0.15s;
        padding: 0;
        box-shadow: none;
}

.wc-tea-bulk-wrap .wc-tea-bulk__remove-row:hover,
.wc-tea-bulk-wrap .wc-tea-bulk__remove-row:focus {
        background: var(--tb-green) !important;
        color: #fff !important;
        outline: 0;
        transform: scale(1.08);
}

/* -----------------------------------------------------------------------
   Add Package button (round pill — green border + green text;
   hover: green bg + white text) — override theme button styles
   --------------------------------------------------------------------- */
.wc-tea-bulk-wrap .wc-tea-bulk__add-row {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        margin-top: 14px;
        padding: 11px 26px;
        background: #fff !important;
        border: 2px solid var(--tb-green) !important;
        border-radius: 999px !important;
        color: var(--tb-green) !important;
        font-size: 0.95rem;
        font-weight: 700;
        cursor: pointer;
        transition: background 0.2s, color 0.2s, border-color 0.2s;
        box-shadow: none;
        text-transform: none;
        white-space: nowrap;
}

.wc-tea-bulk-wrap .wc-tea-bulk__add-row span[aria-hidden] {
        font-size: 1.2rem;
        line-height: 1;
        color: inherit !important;
}

.wc-tea-bulk-wrap .wc-tea-bulk__add-row:hover,
.wc-tea-bulk-wrap .wc-tea-bulk__add-row:focus {
        background: var(--tb-green) !important;
        color: #fff !important;
        border-color: var(--tb-green) !important;
        outline: 0;
}

/* -----------------------------------------------------------------------
   Live Calculation Panel
   --------------------------------------------------------------------- */
.wc-tea-bulk__calc-panel {
        background: var(--tb-panel-bg);
        border: 1px solid var(--tb-panel-border);
        border-radius: 12px;
        padding: 18px 22px;
}

.wc-tea-bulk__calc-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 8px 0;
        border-bottom: 1px solid #e0eccd;
        font-size: 0.98rem;
        color: #444;
}

.wc-tea-bulk__calc-row:last-child {
        border-bottom: none;
}

.wc-tea-bulk__calc-row--total {
        padding-top: 12px;
        margin-top: 4px;
}

.wc-tea-bulk__calc-label {
        font-weight: 500;
        color: var(--tb-muted);
}

.wc-tea-bulk__calc-value {
        font-weight: 700;
        color: var(--tb-text);
}

.wc-tea-bulk__calc-row--total .wc-tea-bulk__calc-value {
        font-size: 1.4rem;
        color: var(--tb-green-dark);
}

.wc-tea-bulk__zero {
        color: #aec48a;
        font-weight: 400;
}

.wc-tea-bulk__calc-value.wc-tea-bulk--updated {
        animation: wc-tea-bulk-pulse 0.35s ease;
}

@keyframes wc-tea-bulk-pulse {
        0%   { opacity: 0.4; transform: scale(0.97); }
        100% { opacity: 1;   transform: scale(1); }
}

/* -----------------------------------------------------------------------
   Enquiry Checkboxes
   --------------------------------------------------------------------- */
.wc-tea-bulk__enquiry-section {
        border-top: 1px solid #eee;
        padding-top: 18px;
}

.wc-tea-bulk__checkbox-label {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        margin-bottom: 12px;
        font-size: 0.92rem;
        color: #444;
        cursor: pointer;
        line-height: 1.45;
}

.wc-tea-bulk__checkbox-label input[type="checkbox"] {
        margin-top: 2px;
        flex-shrink: 0;
        width: 17px;
        height: 17px;
        accent-color: var(--tb-green);
        cursor: pointer;
}

/* -----------------------------------------------------------------------
   Action Buttons (round pill, green) — override theme button styles
   --------------------------------------------------------------------- */
.wc-tea-bulk__actions {
        display: flex;
        gap: 14px;
        flex-wrap: wrap;
}

.wc-tea-bulk-wrap .wc-tea-bulk__btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        padding: 16px 34px;
        border-radius: 999px !important;
        font-size: 1.02rem;
        font-weight: 700;
        cursor: pointer;
        border: 2px solid transparent;
        transition: background 0.2s, color 0.2s, border-color 0.2s, opacity 0.2s, transform 0.12s;
        flex: 1 1 auto;
        min-width: 220px;
        text-transform: none;
        box-shadow: none;
        line-height: 1.2;
}

.wc-tea-bulk-wrap .wc-tea-bulk__btn--primary {
        background: var(--tb-green) !important;
        color: #fff !important;
        border-color: var(--tb-green) !important;
}

.wc-tea-bulk-wrap .wc-tea-bulk__btn--primary span {
        color: #fff !important;
}

.wc-tea-bulk-wrap .wc-tea-bulk__btn--primary:hover,
.wc-tea-bulk-wrap .wc-tea-bulk__btn--primary:focus {
        background: var(--tb-green-dark) !important;
        border-color: var(--tb-green-dark) !important;
        color: #fff !important;
        outline: 0;
        transform: translateY(-1px);
}

.wc-tea-bulk-wrap .wc-tea-bulk__btn--primary:disabled,
.wc-tea-bulk-wrap .wc-tea-bulk__btn--primary.wc-tea-bulk--loading {
        opacity: 0.65;
        cursor: progress;
        transform: none;
}

.wc-tea-bulk__btn-total {
        font-weight: 800;
}

.wc-tea-bulk__btn-sep {
        opacity: 0.6;
        font-weight: 400;
}

.wc-tea-bulk__btn-label {
        text-transform: uppercase;
        letter-spacing: 0.03em;
}

.wc-tea-bulk-wrap .wc-tea-bulk__btn--secondary {
        background: #fff !important;
        color: var(--tb-green) !important;
        border-color: var(--tb-green) !important;
}

.wc-tea-bulk-wrap .wc-tea-bulk__btn--secondary:hover,
.wc-tea-bulk-wrap .wc-tea-bulk__btn--secondary:focus {
        background: var(--tb-green) !important;
        color: #fff !important;
        outline: 0;
}

/* -----------------------------------------------------------------------
   Notices
   --------------------------------------------------------------------- */
.wc-tea-bulk__notices {
        margin-top: 14px;
}

.wc-tea-bulk__notice {
        padding: 11px 15px;
        border-left: 4px solid #d9534f;
        background: #fdf7f7;
        color: #a02020;
        font-size: 0.9rem;
        border-radius: 0 6px 6px 0;
        margin-bottom: 8px;
}

.wc-tea-bulk__notice--success {
        border-left-color: var(--tb-green);
        background: var(--tb-panel-bg);
        color: var(--tb-green-darker);
}

/* -----------------------------------------------------------------------
   Empty state
   --------------------------------------------------------------------- */
.wc-tea-bulk__empty-row td {
        text-align: center;
        color: #aaa;
        font-style: italic;
        padding: 18px !important;
}

/* -----------------------------------------------------------------------
   Shop / archive price (range)
   --------------------------------------------------------------------- */
.wc-tea-bulk__lb {
        font-size: 0.8em;
        color: var(--tb-muted);
}

/* -----------------------------------------------------------------------
   Cart / Checkout package breakdown table
   --------------------------------------------------------------------- */
.wc-tea-bulk-breakdown {
        width: 100%;
        border-collapse: collapse;
        margin: 6px 0;
        font-size: 0.9em;
}

.wc-tea-bulk-breakdown th,
.wc-tea-bulk-breakdown td {
        border: 1px solid var(--tb-panel-border);
        padding: 6px 10px;
        text-align: left;
}

.wc-tea-bulk-breakdown thead th {
        background: var(--tb-panel-bg);
        color: var(--tb-green-darker);
        font-weight: 700;
}

.wc-tea-bulk-breakdown tfoot td {
        font-weight: 700;
        background: #fbfdf7;
}

/* -----------------------------------------------------------------------
   Enquiry mode (package builder cleared; "Add Package" still restores it)
   --------------------------------------------------------------------- */
.wc-tea-bulk__section.wc-tea-bulk--enquiring .wc-tea-bulk__table-wrap {
        opacity: 0.5;
}

/* -----------------------------------------------------------------------
   Enquiry Modal
   --------------------------------------------------------------------- */
.wc-tea-bulk__modal {
        display: none;
        position: fixed;
        inset: 0;
        z-index: 99999;
}

.wc-tea-bulk__modal--open {
        display: block;
}

body.wc-tea-bulk-modal-open {
        overflow: hidden;
}

.wc-tea-bulk__modal-overlay {
        position: absolute;
        inset: 0;
        background: rgba(28, 35, 16, 0.55);
}

.wc-tea-bulk__modal-dialog {
        position: relative;
        max-width: 560px;
        width: calc(100% - 32px);
        margin: 6vh auto;
        max-height: 88vh;
        overflow-y: auto;
        background: #fff;
        border-radius: 16px;
        box-shadow: 0 24px 60px rgba(0, 0, 0, 0.3);
        animation: wc-tea-bulk-modal-in 0.25s ease;
}

@keyframes wc-tea-bulk-modal-in {
        from { opacity: 0; transform: translateY(16px); }
        to   { opacity: 1; transform: translateY(0); }
}

.wc-tea-bulk-wrap .wc-tea-bulk__modal-x,
.wc-tea-bulk__modal .wc-tea-bulk__modal-x {
        position: absolute;
        top: 12px;
        right: 12px;
        width: 36px;
        height: 36px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: transparent !important;
        border: none !important;
        color: var(--tb-muted) !important;
        font-size: 1.6rem;
        line-height: 1;
        cursor: pointer;
        border-radius: 50% !important;
        box-shadow: none;
}

.wc-tea-bulk__modal-x:hover {
        background: #f0f0f0 !important;
        color: var(--tb-text) !important;
}

.wc-tea-bulk__modal-body {
        padding: 30px 30px 26px;
}

.wc-tea-bulk__modal-title {
        margin: 0 0 8px;
        font-size: 1.4rem;
        font-weight: 800;
        color: var(--tb-green-darker);
}

.wc-tea-bulk__modal-intro {
        margin: 0 0 18px;
        color: var(--tb-muted);
        font-size: 0.95rem;
        line-height: 1.5;
}

.wc-tea-bulk__field-product {
        margin: 0 0 16px;
        padding: 10px 14px;
        background: var(--tb-panel-bg);
        border: 1px solid var(--tb-panel-border);
        border-radius: 8px;
        font-size: 0.92rem;
}

.wc-tea-bulk__field-product strong {
        color: var(--tb-green-darker);
        margin-right: 6px;
}

.wc-tea-bulk__field-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 14px;
}

.wc-tea-bulk__field {
        display: flex;
        flex-direction: column;
        gap: 6px;
        margin-bottom: 14px;
        font-size: 0.88rem;
        color: var(--tb-text);
}

.wc-tea-bulk__field--full {
        grid-column: 1 / -1;
        margin-top: 2px;
}

.wc-tea-bulk__field > span {
        font-weight: 600;
}

.wc-tea-bulk__field em {
        color: #d9534f;
        font-style: normal;
}

.wc-tea-bulk__field input,
.wc-tea-bulk__field textarea {
        width: 100%;
        padding: 10px 12px;
        border: 1px solid #cfcfcf;
        border-radius: 8px;
        font-size: 0.95rem;
        color: var(--tb-text);
        background: #fff;
        font-family: inherit;
        transition: border-color 0.2s, box-shadow 0.2s;
}

.wc-tea-bulk__field input:focus,
.wc-tea-bulk__field textarea:focus {
        border-color: var(--tb-green);
        outline: 0;
        box-shadow: 0 0 0 3px rgba(100, 137, 53, 0.18);
}

.wc-tea-bulk__modal-actions {
        margin-top: 6px;
}

.wc-tea-bulk-wrap .wc-tea-bulk__modal-actions .wc-tea-bulk__btn {
        width: 100%;
}

.wc-tea-bulk__enquiry-feedback {
        margin-top: 12px;
}

.wc-tea-bulk__enquiry-success {
        text-align: center;
        padding: 16px 6px 6px;
}

.wc-tea-bulk__enquiry-success-icon {
        width: 60px;
        height: 60px;
        margin: 0 auto 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: var(--tb-panel-bg);
        color: var(--tb-green);
        font-size: 1.8rem;
        font-weight: 700;
}

.wc-tea-bulk__enquiry-success p {
        font-size: 1.02rem;
        color: var(--tb-text);
        margin: 0 0 18px;
        line-height: 1.5;
}

.wc-tea-bulk-wrap .wc-tea-bulk__enquiry-success .wc-tea-bulk__btn {
        min-width: 160px;
        flex: 0 0 auto;
}

/* -----------------------------------------------------------------------
   Checkout login / register gate
   --------------------------------------------------------------------- */
.wc-tea-bulk-checkout-login {
        max-width: 720px;
        margin: 0 auto;
}

.wc-tea-bulk-checkout-login__intro {
        text-align: center;
        margin-bottom: 24px;
}

.wc-tea-bulk-checkout-login__intro h2 {
        color: var(--tb-green-darker);
        margin: 0 0 8px;
}

.wc-tea-bulk-checkout-login__intro p {
        color: var(--tb-muted);
        margin: 0;
}

/* -----------------------------------------------------------------------
   Responsive — Mobile
   --------------------------------------------------------------------- */
@media (max-width: 600px) {

        .wc-tea-bulk__price-value,
        .wc-tea-bulk__per {
                font-size: 1.3rem;
        }

        .wc-tea-bulk__price-row {
                padding: 12px 0;
        }

        /* Stack table cells vertically on mobile */
        .wc-tea-bulk__table,
        .wc-tea-bulk__table thead,
        .wc-tea-bulk__table tbody,
        .wc-tea-bulk__table th,
        .wc-tea-bulk__table td,
        .wc-tea-bulk__table tr {
                display: block;
        }

        .wc-tea-bulk__table thead tr {
                position: absolute;
                top: -9999px;
                left: -9999px;
        }

        /* Keep size + quantity + remove on a single compact line */
        .wc-tea-bulk__table tbody tr.wc-tea-bulk__row {
                display: flex;
                flex-wrap: nowrap;
                align-items: flex-end;
                gap: 10px;
                border: 1px solid var(--tb-panel-border);
                border-radius: 10px;
                margin-bottom: 12px;
                padding: 10px 12px;
                background: #fff;
        }

        .wc-tea-bulk__table tbody tr.wc-tea-bulk__row td {
                border: none;
                padding: 0;
                display: flex;
                flex-direction: column;
                align-items: stretch;
                gap: 4px;
        }

        .wc-tea-bulk__table tbody tr.wc-tea-bulk__row td[data-label="Package Size"] {
                flex: 1 1 auto;
                min-width: 0;
        }

        .wc-tea-bulk__table tbody tr.wc-tea-bulk__row td[data-label="Quantity"] {
                flex: 0 0 78px;
        }

        .wc-tea-bulk__table tbody tr.wc-tea-bulk__row td.wc-tea-bulk__col-remove {
                flex: 0 0 auto;
        }

        .wc-tea-bulk__table tbody tr.wc-tea-bulk__row td::before {
                content: attr(data-label);
                display: block;
                font-weight: 700;
                color: var(--tb-green-darker);
                font-size: 0.78rem;
        }

        .wc-tea-bulk__table tbody tr.wc-tea-bulk__row td.wc-tea-bulk__col-remove::before {
                display: none;
        }

        .wc-tea-bulk__size-select,
        .wc-tea-bulk__qty-input {
                max-width: none;
                width: 100%;
        }

        .wc-tea-bulk-wrap .wc-tea-bulk__btn {
                width: 100%;
                min-width: 0;
        }

        .wc-tea-bulk__actions {
                flex-direction: column;
        }

        .wc-tea-bulk__calc-panel {
                padding: 14px 16px;
        }

        .wc-tea-bulk__calc-row--total .wc-tea-bulk__calc-value {
                font-size: 1.25rem;
        }
}

@media (min-width: 601px) and (max-width: 900px) {
        .wc-tea-bulk__size-select {
                max-width: 140px;
        }
}