/* DreamWeb Affiliates — My Account area. Scoped to .woocommerce-account so it
   never leaks into the rest of the site. Primarily black + white, slight rounded
   corners. Two weights only: normal and 600. */

/* --- Width + centering ---------------------------------------------------- */
/* Clamp and center the whole account block. */
.woocommerce-account .woocommerce {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    float: none;
}
/* Only the logged-in dashboard has a nav sidebar → 2-column grid.
   The login/register page has no nav, so it must NOT be a grid. */
.woocommerce-account.logged-in .woocommerce {
    display: grid;
    grid-template-columns: 230px 1fr;
    gap: 2rem;
    align-items: start;
}

/* --- Navigation (sidebar) ------------------------------------------------- */
.woocommerce-account .woocommerce-MyAccount-navigation { width: auto; float: none; }
.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none;
    margin: 0;
    padding: 6px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .12);
    border-radius: 8px;
}
.woocommerce-account .woocommerce-MyAccount-navigation li { margin: 0; border: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li a {
    display: block;
    padding: 10px 14px;
    border-radius: 6px;
    color: #111;
    text-decoration: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover { background: #f2f2f2; }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
    background: #111 !important;
    color: #fff !important;
}

/* --- Content panel -------------------------------------------------------- */
.woocommerce-account .woocommerce-MyAccount-content {
    width: auto;
    float: none;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .12);
    border-radius: 8px;
    padding: 1.75rem 2rem;
}
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3 { margin-top: 0; }
.woocommerce-account .woocommerce-MyAccount-content form { max-width: 480px; }

/* --- Login / register page (logged-out): centered, clean cards ------------ */
.woocommerce-account:not(.logged-in) #customer_login {
    max-width: 920px;
    margin: 0 auto;
}
.woocommerce-account form.login,
.woocommerce-account form.register {
    border: 1px solid rgba(0, 0, 0, .12);
    border-radius: 8px;
    padding: 1.5rem 1.75rem;
}

/* --- Inputs + buttons: consistent black/white across the account ---------- */
.woocommerce-account input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
.woocommerce-account select {
    width: 100%;
    box-sizing: border-box;
    padding: .65rem .8rem;
    border: 1px solid rgba(0, 0, 0, .18);
    border-radius: 8px;
    background: #fff;
    font-size: .95rem;
}
.woocommerce-account input:focus,
.woocommerce-account select:focus {
    outline: none;
    border-color: #111;
    box-shadow: 0 0 0 3px rgba(0, 0, 0, .08);
}
.woocommerce-account .button,
.woocommerce-account button[type="submit"],
.woocommerce-account input[type="submit"] {
    background: #111 !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 8px !important;
    padding: .7rem 1.4rem !important;
    font-weight: 600 !important;
    cursor: pointer;
    box-shadow: none !important;
    text-shadow: none !important;
}
.woocommerce-account .button:hover,
.woocommerce-account button[type="submit"]:hover,
.woocommerce-account input[type="submit"]:hover { opacity: .85; }

/* --- Ambassador dashboard (approved layout) ------------------------------- */
.woocommerce-account .dwaff-dashboard h3 { margin: 2rem 0 .8rem; }
.woocommerce-account .dwaff-dashboard .dwaff-sub { color: #666; margin: 0 0 .7rem; }
.woocommerce-account .dwaff-dashboard .dwaff-link-row {
    display: flex;
    gap: 10px;
    align-items: stretch;
    max-width: 560px;
}
.woocommerce-account .dwaff-dashboard .dwaff-link {
    flex: 1;
    width: auto !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: .9rem;
    background: #f7f7f7 !important;
}
.woocommerce-account .dwaff-dashboard .dwaff-copy {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #111 !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 8px !important;
    padding: 0 1.1rem !important;
    font-size: .9rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}
.woocommerce-account .dwaff-dashboard .dwaff-copy:hover { opacity: .85; }
.woocommerce-account .dwaff-dashboard .dwaff-code { color: #888; font-size: .85rem; margin: .55rem 0 0; }
.woocommerce-account .dwaff-dashboard .dwaff-code span {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    color: #111;
}
.woocommerce-account .dwaff-dashboard .dwaff-tiles { display: grid; gap: 12px; }
.woocommerce-account .dwaff-dashboard .dwaff-tiles-4 { grid-template-columns: repeat(4, 1fr); }
.woocommerce-account .dwaff-dashboard .dwaff-tiles-3 { grid-template-columns: repeat(3, 1fr); }
.woocommerce-account .dwaff-dashboard .dwaff-tile {
    background: #f7f7f7;
    border-radius: 10px;
    padding: 1rem 1.1rem;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.woocommerce-account .dwaff-dashboard .dwaff-tile-label {
    font-size: .74rem;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: #888;
}
.woocommerce-account .dwaff-dashboard .dwaff-tile-value { font-size: 1.5rem; font-weight: 600; line-height: 1.1; }
.woocommerce-account .dwaff-dashboard .dwaff-payout-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 1.5rem;
    padding: .9rem 1.1rem;
    border: 1px solid rgba(0, 0, 0, .10);
    border-radius: 10px;
    color: #666;
    font-size: .9rem;
}
.woocommerce-account .dwaff-dashboard .dwaff-payout-bar em { color: #999; font-style: normal; }

/* --- Responsive ----------------------------------------------------------- */
@media (max-width: 780px) {
    .woocommerce-account.logged-in .woocommerce { grid-template-columns: 1fr; gap: 1.25rem; }
    .woocommerce-account .woocommerce-MyAccount-content { padding: 1.5rem 1.25rem; }
}
@media (max-width: 640px) {
    .woocommerce-account .dwaff-dashboard .dwaff-tiles-4,
    .woocommerce-account .dwaff-dashboard .dwaff-tiles-3 { grid-template-columns: repeat(2, 1fr); }
    .woocommerce-account .dwaff-dashboard .dwaff-link-row { flex-direction: column; }
}

/* --- Dark theme friendliness ---------------------------------------------- */
@media (prefers-color-scheme: dark) {
    .woocommerce-account .woocommerce-MyAccount-navigation ul,
    .woocommerce-account .woocommerce-MyAccount-content,
    .woocommerce-account form.login,
    .woocommerce-account form.register {
        background: #16161c;
        border-color: rgba(255, 255, 255, .12);
    }
    .woocommerce-account .woocommerce-MyAccount-navigation li a { color: #e6e6ea; }
    .woocommerce-account .woocommerce-MyAccount-navigation li a:hover { background: #20202a; }
    .woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { background: #fff !important; color: #111 !important; }
    .woocommerce-account input,
    .woocommerce-account select,
    .woocommerce-account .dwaff-dashboard .dwaff-link { background: #0f0f14 !important; color: #eee; border-color: rgba(255, 255, 255, .18); }
    .woocommerce-account .button,
    .woocommerce-account button[type="submit"],
    .woocommerce-account input[type="submit"],
    .woocommerce-account .dwaff-dashboard .dwaff-copy { background: #fff !important; color: #111 !important; }
    .woocommerce-account .dwaff-dashboard .dwaff-tile { background: #1d1d25; }
    .woocommerce-account .dwaff-dashboard .dwaff-code span { color: #eee; }
    .woocommerce-account .dwaff-dashboard .dwaff-payout-bar { border-color: rgba(255, 255, 255, .12); color: #aaa; }
}

/* --- Log-out confirmation modal (unscoped: appended to <body> by account.js) --- */
#dwaff-logout-modal {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100000;
}
#dwaff-logout-modal .dwaff-modal-card {
    background: #fff;
    border-radius: 14px;
    padding: 28px 26px;
    max-width: 380px;
    width: 88%;
    text-align: center;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
}
#dwaff-logout-modal h3 { margin: 0 0 8px; font-size: 20px; color: #111; }
#dwaff-logout-modal p { margin: 0 0 22px; color: #555; }
#dwaff-logout-modal .dwaff-modal-actions { display: flex; gap: 10px; justify-content: center; }
#dwaff-logout-modal .dwaff-modal-cancel {
    background: #f2f2f2; color: #111; border: 0; border-radius: 8px;
    padding: 10px 20px; font-weight: 600; cursor: pointer;
}
#dwaff-logout-modal .dwaff-modal-confirm {
    background: #111; color: #fff; border-radius: 8px;
    padding: 10px 20px; font-weight: 600; text-decoration: none;
}
@media (prefers-color-scheme: dark) {
    #dwaff-logout-modal .dwaff-modal-card { background: #16161c; }
    #dwaff-logout-modal h3 { color: #eee; }
    #dwaff-logout-modal p { color: #aaa; }
    #dwaff-logout-modal .dwaff-modal-cancel { background: #24242c; color: #eee; }
    #dwaff-logout-modal .dwaff-modal-confirm { background: #fff; color: #111; }
}