/* EU Withdrawal Button — Frontend Styles v3
   All rules scoped under .euwb-page for high specificity,
   overriding WP admin bar styles on frontend for logged-in users. */

/* ── CSS Variables ── */
:root {
    --euwb-accent:      #96588a;
    --euwb-accent-text: #ffffff;
    --euwb-accent-rgb:  150,88,138;
    --euwb-radius:      10px;
    --euwb-shadow:      0 4px 20px rgba(0,0,0,0.07), 0 1px 4px rgba(0,0,0,0.04);
    --euwb-border:      rgba(0,0,0,0.10);
    --euwb-bg:          rgba(0,0,0,0.03);
}

/* ── Withdraw button (outside card) ── */
.euwb-button-wrap { margin-top: 1.5em; clear: both; }

a.euwb-withdraw-button,
a.euwb-withdraw-button.button,
button.euwb-withdraw-button {
    display: inline-block !important;
    background-color: var(--euwb-accent) !important;
    color:            var(--euwb-accent-text) !important;
    border-color:     var(--euwb-accent) !important;
    border-radius:    6px !important;
    font-weight:      600 !important;
    letter-spacing:   .02em !important;
    transition:       opacity .15s !important;
    text-decoration:  none !important;
}
a.euwb-withdraw-button:hover,
button.euwb-withdraw-button:hover { opacity: .85 !important; }

/* ── Page wrapper ── */
.euwb-page {
    max-width: 680px;
    margin: 2em 0;
    padding: 0 0 3em;
    box-sizing: border-box;
}
.euwb-page[data-align="center"] { margin: 2em auto; }
.euwb-page[data-align="right"]  { margin: 2em 0 2em auto; }

/* ── Card header ── */
.euwb-page .euwb-card-header {
    background:    var(--euwb-accent) !important;
    color:         var(--euwb-accent-text) !important;
    border-radius: var(--euwb-radius) var(--euwb-radius) 0 0 !important;
    padding:       1.4em 1.8em !important;
    margin:        0 !important;
    border:        none !important;
    box-shadow:    none !important;
}
.euwb-page .euwb-card-header h2,
.euwb-page .euwb-card-header h1,
.euwb-page .euwb-card-header h3 {
    margin:         0 !important;
    padding:        0 !important;
    font-size:      1.2em !important;
    font-weight:    700 !important;
    color:          inherit !important;
    letter-spacing: .01em !important;
    border:         none !important;
    background:     none !important;
}

/* ── Card body ── */
.euwb-page .euwb-card-body {
    background:    #fff !important;
    border:        1px solid var(--euwb-border) !important;
    border-top:    none !important;
    border-radius: 0 0 var(--euwb-radius) var(--euwb-radius) !important;
    padding:       1.8em !important;
    box-shadow:    none !important;
    margin:        0 !important;
}

/* ── Order info strip ── */
.euwb-page .euwb-info-strip {
    display:       flex !important;
    flex-wrap:     wrap !important;
    gap:           .4em 1.6em !important;
    padding:       .9em 1.2em !important;
    background:    var(--euwb-bg) !important;
    border-radius: 6px !important;
    font-size:     .9em !important;
    margin-bottom: 1.4em !important;
    border:        1px solid var(--euwb-border) !important;
    box-shadow:    none !important;
}
.euwb-page .euwb-info-strip span {
    color:         #888 !important;
    font-size:     .85em !important;
    display:       block !important;
    margin-bottom: 1px !important;
}
.euwb-page .euwb-info-strip strong { font-weight: 600 !important; }

/* ── Section box ── */
.euwb-page .euwb-section {
    border:        1px solid var(--euwb-border) !important;
    border-radius: 8px !important;
    padding:       1.2em 1.4em !important;
    margin-bottom: 1.4em !important;
    background:    var(--euwb-bg) !important;
    box-shadow:    none !important;
}
.euwb-page .euwb-section h3 {
    margin:         0 0 .9em !important;
    padding:        0 !important;
    font-size:      .85em !important;
    font-weight:    700 !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    opacity:        .6 !important;
    border:         none !important;
    background:     none !important;
}

/* ── Radio / Checkbox ── */
.euwb-page .euwb-choice {
    display:     flex !important;
    align-items: flex-start !important;
    gap:         .6em !important;
    margin-bottom: .55em !important;
    cursor:      pointer !important;
}
.euwb-page .euwb-choice input[type="radio"],
.euwb-page .euwb-choice input[type="checkbox"] {
    position:          static !important;
    opacity:           1 !important;
    visibility:        visible !important;
    clip:              auto !important;
    clip-path:         none !important;
    -webkit-clip-path: none !important;
    transform:         none !important;
    pointer-events:    auto !important;
    -webkit-appearance: auto !important;
    appearance:        auto !important;
    width:             18px !important;
    height:            18px !important;
    min-width:         18px !important;
    flex-shrink:       0 !important;
    margin:            2px 0 0 !important;
    padding:           0 !important;
    cursor:            pointer !important;
    accent-color:      var(--euwb-accent) !important;
    float:             none !important;
}
.euwb-page .euwb-choice label {
    cursor:      pointer !important;
    line-height: 1.5 !important;
    margin:      0 !important;
    font-weight: normal !important;
    display:     flex !important;
    align-items: center !important;
    gap:         .5em !important;
    flex:        1 !important;
}

/* ── Partial products ── */
.euwb-page .euwb-partial-list {
    margin-top:  1em !important;
    padding-top: 1em !important;
    border-top:  1px dashed var(--euwb-border) !important;
    display:     none;
}
.euwb-page .euwb-partial-list h4 {
    margin:         0 0 .7em !important;
    padding:        0 !important;
    font-size:      .82em !important;
    font-weight:    700 !important;
    text-transform: uppercase !important;
    letter-spacing: .05em !important;
    opacity:        .55 !important;
    border:         none !important;
    background:     none !important;
}
.euwb-page .euwb-product-row {
    padding:       8px 10px !important;
    border-radius: 6px !important;
    margin-bottom: 4px !important;
    border:        1px solid transparent !important;
    transition:    background .12s, border-color .12s, transform .1s !important;
}
.euwb-page .euwb-product-row:hover {
    background:   rgba(0,0,0,0.03) !important;
    border-color: var(--euwb-border) !important;
    transform:    translateX(2px) !important;
}

/* ── Field label ── */
.euwb-page .euwb-field-label,
.euwb-page label.euwb-field-label {
    display:        block !important;
    font-weight:    600 !important;
    font-size:      .9em !important;
    margin-bottom:  .4em !important;
    letter-spacing: .01em !important;
}

/* ── Textarea ── */
.euwb-page .euwb-textarea {
    width:       100% !important;
    padding:     .7em .9em !important;
    border:      1px solid var(--euwb-border) !important;
    border-radius: 6px !important;
    resize:      vertical !important;
    min-height:  90px !important;
    font-family: inherit !important;
    font-size:   inherit !important;
    background:  #fff !important;
    color:       inherit !important;
    box-sizing:  border-box !important;
    transition:  border-color .15s !important;
}
.euwb-page .euwb-textarea:focus {
    outline:    none !important;
    border-color: var(--euwb-accent) !important;
    box-shadow: 0 0 0 3px rgba(var(--euwb-accent-rgb, 150,88,138), .12) !important;
}

/* ── Input fields ── */
.euwb-page .euwb-input,
.euwb-page input.euwb-input {
    padding:       .65em .9em !important;
    border:        1px solid var(--euwb-border) !important;
    border-radius: 6px !important;
    font-family:   inherit !important;
    font-size:     inherit !important;
    transition:    border-color .15s, box-shadow .15s !important;
    box-sizing:    border-box !important;
    background:    #fff !important;
    color:         inherit !important;
}
.euwb-page .euwb-input:focus,
.euwb-page input.euwb-input:focus {
    outline:    none !important;
    border-color: var(--euwb-accent) !important;
    box-shadow: 0 0 0 3px rgba(var(--euwb-accent-rgb, 150,88,138), .12) !important;
}

/* ── Agreements box ── */
.euwb-page .euwb-agreements {
    border:        1px solid var(--euwb-border) !important;
    border-radius: 8px !important;
    padding:       1em 1.2em !important;
    margin-bottom: 1.4em !important;
    background:    var(--euwb-bg) !important;
    display:       flex !important;
    flex-direction: column !important;
    gap:           .7em !important;
    box-shadow:    none !important;
}

/* ── Field spacing ── */
.euwb-page .euwb-field { margin-bottom: 1.2em !important; }

/* ── Submit area ── */
.euwb-page .euwb-submit-area {
    padding-top: 1.2em !important;
    border-top:  1px solid var(--euwb-border) !important;
    margin-top:  0 !important;
}
.euwb-page .euwb-submit-area .button,
.euwb-page .euwb-submit-area .wp-element-button,
.euwb-page .euwb-submit-area button[type="submit"] {
    display:          inline-block !important;
    background-color: var(--euwb-accent) !important;
    color:            var(--euwb-accent-text) !important;
    border-color:     var(--euwb-accent) !important;
    border-radius:    6px !important;
    padding:          .75em 2em !important;
    font-weight:      700 !important;
    font-size:        1em !important;
    letter-spacing:   .02em !important;
    transition:       opacity .15s, transform .1s !important;
    cursor:           pointer !important;
    text-decoration:  none !important;
    border-width:     1px !important;
    border-style:     solid !important;
}
.euwb-page .euwb-submit-area .button:hover,
.euwb-page .euwb-submit-area button[type="submit"]:hover {
    opacity:   .87 !important;
    transform: translateY(-1px) !important;
}

/* ── Verify form ── */
.euwb-verify-form .euwb-field     { margin-bottom: 1.2em; }
.euwb-verify-form label           { display: block; font-weight: 600; margin-bottom: .35em; }
.euwb-verify-form input.input-text,
.euwb-verify-form input.euwb-input { width: 100%; max-width: 400px; }

/* ── Inline error ── */
#euwb-partial-error {
    color:       #c0392b;
    font-size:   .88em;
    margin:      .4em 0 0;
    font-weight: 600;
    display:     block;
}

/* ── Responsive ── */
@media (max-width: 600px) {
    .euwb-page .euwb-card-body  { padding: 1.2em !important; }
    .euwb-page .euwb-section    { padding: 1em !important; }
    .euwb-page .euwb-info-strip { gap: .4em 1em !important; }
}