/**
 * EU Returns, Refunds & Right of Withdrawal — front office styles.
 *
 * @author    GURU CODERS
 * @copyright 2026 GURU CODERS
 * @license   Commercial license
 *
 * Scoped to .eulr-* so the theme is never affected. The templates use standard
 * classic-theme markup (card / table / alert / data-label), so this only adds
 * module-specific polish and cross-theme badge fallbacks.
 */

/* ---- Status badges ----
 * Templates use `badge badge-X label label-X`. Bootstrap-4 front themes style
 * all six; these scoped fallbacks cover non-BS4 themes (esp. dark / secondary),
 * scoped to module containers so the theme's own badges are untouched. */
.eulr-requests .badge, .eulr-view .badge, .eulr-orderdetail .badge {
    display: inline-block;
    padding: .35em .65em;
    font-size: 75%;
    font-weight: 600;
    line-height: 1;
    border-radius: 10rem;
    vertical-align: baseline;
    color: #fff;
}
.eulr-requests .badge-warning, .eulr-view .badge-warning, .eulr-orderdetail .badge-warning,
.eulr-requests .label-warning, .eulr-view .label-warning, .eulr-orderdetail .label-warning { background: #f0ad4e; color: #503000; }
.eulr-requests .badge-info, .eulr-view .badge-info, .eulr-orderdetail .badge-info,
.eulr-requests .label-info, .eulr-view .label-info, .eulr-orderdetail .label-info { background: #5bc0de; }
.eulr-requests .badge-danger, .eulr-view .badge-danger, .eulr-orderdetail .badge-danger,
.eulr-requests .label-danger, .eulr-view .label-danger, .eulr-orderdetail .label-danger { background: #d9534f; }
.eulr-requests .badge-success, .eulr-view .badge-success, .eulr-orderdetail .badge-success,
.eulr-requests .label-success, .eulr-view .label-success, .eulr-orderdetail .label-success { background: #28a745; }
.eulr-requests .badge-dark, .eulr-view .badge-dark, .eulr-orderdetail .badge-dark,
.eulr-requests .label-dark, .eulr-view .label-dark, .eulr-orderdetail .label-dark { background: #495057; }
.eulr-requests .badge-secondary, .eulr-view .badge-secondary, .eulr-orderdetail .badge-secondary,
.eulr-requests .label-secondary, .eulr-view .label-secondary, .eulr-orderdetail .label-secondary { background: #868e96; }

/* ---- Request form ---- */
/* Keep the form a readable width even on full-width (no-column) pages — otherwise
   a full-width <select>/<textarea> stretches oddly across the whole page. */
.eulr-form { max-width: 760px; }
.eulr-withdrawal-form .form-control { max-width: 520px; }
.eulr-withdrawal-form textarea.form-control { max-width: 100%; }
/* The theme's Bootstrap-3 .form-control forces height:32px; on a <select> the
   browser's native arrow button is drawn over the fixed-height box and clips the
   right border ("cut"). Letting the select size itself fixes it. */
.eulr-withdrawal-form select.form-control { height: auto; min-height: 32px; padding-top: 7px; padding-bottom: 7px; }
.eulr-withdrawal-form .eulr-item-label { font-weight: 600; cursor: pointer; }
.eulr-withdrawal-form input.eulr-qty { width: 80px; display: inline-block; max-width: 80px; }
.eulr-legal-confirm {
    background: #fcf8e3;
    border: 1px solid #faebcc;
    border-radius: 6px;
    padding: 12px 14px;
    margin: 16px 0;
}
.eulr-deadline {
    background: #eef6ff !important;
    border-left: 3px solid #5b9bd5;
    padding: 10px 14px !important;
    margin: 14px 0;
    border-radius: 0 6px 6px 0;
    color: #2c5777 !important;
}
.eulr-modelform-link { font-size: .92em; }

/* ---- Request detail + timeline ---- */
.eulr-summary dt { color: #888; font-weight: 600; }
.eulr-timeline { list-style: none; margin: 0; padding: 0; position: relative; }
.eulr-timeline:before {
    content: "";
    position: absolute;
    left: 7px; top: 4px; bottom: 4px;
    width: 2px;
    background: #e6e6e6;
}
.eulr-timeline-item { position: relative; padding: 0 0 18px 28px; }
.eulr-timeline-marker {
    position: absolute;
    left: 0; top: 3px;
    width: 16px; height: 16px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid #5b9bd5;
}
.eulr-timeline-detail { color: #666; font-size: .9em; }

/* ---- Order-detail widget (hook) ---- */
.eulr-orderdetail {
    border: 1px solid #e6e6e6;
    border-radius: 8px;
    padding: 16px 18px;
    margin: 16px 0;
    background: #fff;
}
.eulr-orderdetail-title { font-weight: 700; margin: 0 0 10px; }
.eulr-orderdetail-status { margin-bottom: 10px; }

/* ---- Account / footer links ---- */
.eulr-account-link .material-icons,
.eulr-account-link [class*="icon-"],
.eulr-myaccount-link .material-icons,
.eulr-myaccount-link [class*="icon-"] { vertical-align: middle; margin-right: 6px; }

/* ---- Success ---- */
.eulr-success { text-align: center; padding: 16px 0; }

/* ---- Model withdrawal form (printable) ---- */
.eulr-modelform .table th { width: 40%; color: #555; }
@media print {
    header, footer, nav, #header, #footer, .eulr-modelform-actions,
    .breadcrumb, #left-column, #right-column { display: none !important; }
    .eulr-modelform { border: 0 !important; box-shadow: none !important; }
    body { background: #fff !important; }
}

/* ---- Order confirmation widget ---- */
.eulr-orderconfirmation { margin: 16px 0; }
.eulr-orderconfirmation .material-icons,
.eulr-orderconfirmation [class*="icon-"] { vertical-align: middle; margin-right: 6px; }

/* ---- Product page withdrawal info ---- */
.eulr-product-info { margin: 12px 0; font-size: .95em; }
.eulr-product-info p { display: flex; align-items: center; margin: 0; }
.eulr-product-info .material-icons,
.eulr-product-info [class*="icon-"] { font-size: 18px; margin-right: 6px; }
.eulr-product-info-ok { color: #2b7a2b; }
.eulr-product-info-exempt { color: #b33; }
.eulr-product-info a { margin-left: 6px; }

/* ---- Checkout payment-top notice ---- */
.eulr-payment-top { display: flex; align-items: center; margin-bottom: 16px; }
.eulr-payment-top .material-icons,
.eulr-payment-top [class*="icon-"] { font-size: 18px; margin-right: 8px; }
.eulr-payment-top a { margin-left: 6px; font-weight: 600; }

/* Transparent click-catch painted ON TOP of each payment button while the waiver is
   unticked. It sits above the PayPal SDK iframe (which sets its own pointer-events),
   so it reliably blocks the click. pointer-events:auto keeps it active even if an
   ancestor was greyed. */
.eulr-dc-overlay {
    position: absolute;
    inset: 0;
    z-index: 2147483000;
    background: transparent;
    cursor: not-allowed;
    pointer-events: auto !important;
}

/* Visual greying of the payment area while unticked (clicks are handled by the
   overlay above, so we must NOT set pointer-events:none here — it would disable the
   overlay too). */
body.eulr-dc-block .ps_checkout-button,
body.eulr-dc-block .js-payment-binary,
body.eulr-dc-block #payment-confirmation,
body.eulr-dc-block #btn-placer_order {
    opacity: 0.55;
}

/* ---- Digital-content waiver checkbox (Art. 16m) ---- */
.eulr-digital-consent { margin-bottom: 16px; }
.eulr-digital-consent-label { display: flex; align-items: flex-start; gap: 8px; margin: 0; cursor: pointer; font-weight: 400; }
.eulr-digital-consent-label .eulr-dc-checkbox { margin-top: 3px; flex: 0 0 auto; }
.eulr-digital-consent .eulr-dc-hint { margin: 6px 0 0 24px; transition: color .2s ease; }

/* Missing/required-not-accepted state — make it unmistakable. */
.eulr-digital-consent.eulr-dc-missing {
    border-color: #c0392b;
    box-shadow: 0 0 0 2px #c0392b inset;
    background: #fdecea;
}
.eulr-digital-consent.eulr-dc-missing .eulr-digital-consent-label { color: #922b21; }
.eulr-digital-consent.eulr-dc-missing .eulr-dc-checkbox {
    outline: 2px solid #c0392b;
    outline-offset: 2px;
}
.eulr-digital-consent.eulr-dc-missing .eulr-dc-hint {
    color: #c0392b;
    font-weight: 700;
}
.eulr-digital-consent.eulr-dc-missing .eulr-dc-hint::before {
    content: "\26A0";
    margin-right: 6px;
}

/* Shake the box on every blocked place-order attempt. */
@keyframes eulr-dc-shake {
    0%, 100% { transform: translateX(0); }
    15% { transform: translateX(-7px); }
    30% { transform: translateX(7px); }
    45% { transform: translateX(-5px); }
    60% { transform: translateX(5px); }
    75% { transform: translateX(-3px); }
    90% { transform: translateX(3px); }
}
.eulr-digital-consent.eulr-dc-shake { animation: eulr-dc-shake .45s ease; }

/* ---- View request action buttons ---- */
.eulr-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin-top: 16px;
}
.eulr-actions .eulr-cancel-form { margin: 0; }

/* ---- Start-a-request box on the account "Returns & withdrawals" page ---- */
.eulr-new-request { margin-bottom: 20px; }
.eulr-new-request .eulr-eligible-orders { list-style: none; margin: 12px 0 0; padding: 0; }
.eulr-eligible-order {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    border-top: 1px solid #eee;
}
.eulr-eligible-order:first-child { border-top: 0; }
.eulr-eligible-order .eulr-eo-ref { font-weight: 600; }
.eulr-eligible-order .eulr-eo-date { font-size: 0.9em; }
.eulr-eligible-order .btn { margin-left: auto; }
.eulr-eligible-order .eulr-eo-reason { margin-left: auto; text-align: right; font-size: 0.9em; }
.eulr-order-ineligible { opacity: 0.7; }
.eulr-order-ineligible .eulr-eo-ref { font-weight: 500; }