/** DowGold Account Hub v1.2.4 */
.dglm-hub {
    --dglm-bg: #08090c;
    --dglm-panel: #111218;
    --dglm-panel-2: #171820;
    --dglm-border: rgba(255, 205, 73, .22);
    --dglm-gold: #f5c542;
    --dglm-gold-soft: #ffe39a;
    --dglm-text: #f7f7f8;
    --dglm-muted: #9a9ca7;
    --dglm-green: #24df9d;
    --dglm-red: #ff5d6c;
    color: var(--dglm-text);
    background:
        radial-gradient(circle at 90% -20%, rgba(245, 197, 66, .17), transparent 34rem),
        var(--dglm-bg);
    border: 1px solid rgba(255, 205, 73, .28);
    border-radius: 24px;
    box-sizing: border-box;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
    container-name: dglm-hub;
    container-type: inline-size;
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    padding: clamp(18px, 2.4vw, 26px);
    width: 100%;
}

.dglm-hub *, .dglm-hub *::before, .dglm-hub *::after { box-sizing: border-box; }
.dglm-hub [hidden] { display: none !important; }

.dglm-hub__hero > *,
.dglm-hub__hero-meta > *,
.dglm-hub__content,
.dglm-hub__content > *,
.dglm-hub__chart-heading > *,
.dglm-hub__section-heading > *,
.dglm-hub__controls,
.dglm-hub__controls > *,
.dglm-hub__kpis,
.dglm-hub__kpis > *,
.dglm-hub__current-grid,
.dglm-hub__current-grid > *,
.dglm-hub__history,
.dglm-hub__table-wrap {
    min-width: 0;
}

.dglm-hub__hero-meta,
.dglm-hub__chart-heading,
.dglm-hub__win-card > div:first-child,
.dglm-hub__win-card > p,
.dglm-hub__section-heading {
    align-items: center;
    display: flex;
    justify-content: space-between;
    gap: 18px;
}

.dglm-hub .dglm-hub__hero {
    align-content: start !important;
    display: block !important;
    height: auto !important;
    margin: 0 0 12px !important;
    min-height: 0 !important;
    padding: 0 !important;
}
.dglm-hub__hero-meta {
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin: 0 0 7px;
}
.dglm-hub__eyebrow,
.dglm-hub__section-heading > div > span,
.dglm-hub__chart-heading span,
.dglm-hub__kpis span,
.dglm-hub__current-grid span,
.dglm-hub__controls label > span {
    color: var(--dglm-muted);
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    line-height: 1.4;
    margin-bottom: 6px;
    text-transform: uppercase;
}

.dglm-hub__eyebrow { color: var(--dglm-gold); margin: 0; }
.dglm-hub h2 { color: #fff; font-size: clamp(25px, 3.6vw, 34px); letter-spacing: -.035em; line-height: 1.12; margin: 0; }
.dglm-hub h3 { color: #fff; font-size: 20px; letter-spacing: -.02em; margin: 0; }
.dglm-hub__intro { color: #bfc0c8; line-height: 1.5; margin: 7px 0 0; max-width: 760px; }

.dglm-hub__privacy-badge {
    background: rgba(245, 197, 66, .1);
    border: 1px solid rgba(245, 197, 66, .28);
    border-radius: 999px;
    color: var(--dglm-gold-soft);
    flex: 0 0 auto;
    font-size: 11px;
    font-weight: 700;
    max-width: 100%;
    overflow-wrap: anywhere;
    padding: 6px 10px;
    white-space: nowrap;
}

.dglm-hub__privacy-badge::before { content: "\2022"; color: var(--dglm-gold); margin-right: 7px; }

#dglm-account-hub .dglm-hub__controls {
    align-content: start !important;
    display: grid !important;
    gap: 10px 12px !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    margin: 0 0 12px !important;
}

#dglm-account-hub .dglm-hub__controls > label {
    align-self: start !important;
    clear: none !important;
    display: block !important;
    float: none !important;
    height: auto !important;
    grid-column: auto !important;
    grid-row: auto !important;
    margin: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    order: initial !important;
    padding: 0 !important;
    width: auto !important;
}

/* Defeat theme rules that place individual form fields into named columns. */
html body.woocommerce-account #dglm-account-hub
.dglm-hub__controls > label.dglm-hub__control.dglm-hub__control--product {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: stretch !important;
}

html body.woocommerce-account #dglm-account-hub
.dglm-hub__controls > label.dglm-hub__control.dglm-hub__control--licence {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: stretch !important;
}

html body.woocommerce-account #dglm-account-hub
.dglm-hub__controls > label.dglm-hub__control.dglm-hub__control--account {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: stretch !important;
    width: auto !important;
}

.dglm-hub select {
    appearance: none;
    background: #15161c url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath fill='none' stroke='%23f5c542' stroke-width='2' d='m1 1 5 5 5-5'/%3E%3C/svg%3E") no-repeat right 14px center;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 12px;
    color: #fff;
    clear: none !important;
    float: none !important;
    font-size: 14px;
    height: 42px;
    margin: 0 !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0 40px 0 14px;
    width: 100% !important;
}

.dglm-hub select:focus,
.dglm-hub button:focus-visible { box-shadow: 0 0 0 3px rgba(245, 197, 66, .2); outline: 1px solid var(--dglm-gold); }
.dglm-hub select:disabled { background-image: none; color: #b4b5bd; opacity: .78; }

#dglm-account-hub .dglm-hub__periods {
    background: #111218;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 14px;
    align-items: stretch !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    margin: 0 0 12px !important;
    padding: 5px;
}

#dglm-account-hub .dglm-hub__periods > button[type="button"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    align-items: center !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    color: #9fa1aa !important;
    cursor: pointer !important;
    display: flex !important;
    flex: 1 1 0 !important;
    float: none !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    grid-area: auto !important;
    grid-column: auto !important;
    grid-row: auto !important;
    justify-content: center !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    max-width: none !important;
    min-height: 38px !important;
    min-width: 0 !important;
    order: initial !important;
    padding: 8px !important;
    text-transform: none !important;
    white-space: nowrap !important;
    width: auto !important;
}

#dglm-account-hub .dglm-hub__periods > button[type="button"][aria-selected="true"] {
    background: linear-gradient(135deg, #f7cf62, #c89113) !important;
    box-shadow: 0 6px 18px rgba(196, 141, 13, .2) !important;
    color: #17120a !important;
}

#dglm-account-hub .dglm-hub__periods > button[type="button"]:not([aria-selected="true"]):hover {
    background: rgba(245, 197, 66, .09) !important;
    color: #fff !important;
}

.dglm-hub__notice {
    background: rgba(255, 255, 255, .055);
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 12px;
    color: #c9cad0;
    margin-bottom: 16px;
    padding: 13px 15px;
}
.dglm-hub__notice.is-error { background: rgba(255, 93, 108, .08); border-color: rgba(255, 93, 108, .25); color: #ffabb3; }
.dglm-hub__notice.is-loading::before { animation: dglm-hub-pulse 1.2s infinite; color: var(--dglm-gold); content: "\2022"; margin-right: 8px; }

.dglm-hub__content {
    display: grid;
    gap: 13px;
    grid-template-columns: minmax(0, 1fr);
    max-width: 100%;
    width: 100%;
}
.dglm-hub__content > * { max-width: 100%; width: 100%; }
.dglm-hub__chart-card,
.dglm-hub__win-card,
.dglm-hub__current,
.dglm-hub__history,
.dglm-hub__kpis article {
    background: linear-gradient(145deg, rgba(24, 25, 32, .98), rgba(13, 14, 19, .98));
    border: 1px solid rgba(255, 255, 255, .075);
    border-radius: 18px;
}

.dglm-hub__chart-card { border-color: var(--dglm-border); overflow: hidden; padding: clamp(17px, 2.4vw, 22px); position: relative; }
.dglm-hub__chart-card::after {
    background: linear-gradient(90deg, transparent, var(--dglm-gold), transparent);
    content: "";
    height: 1px;
    left: 10%;
    opacity: .75;
    position: absolute;
    right: 10%;
    top: 0;
}
.dglm-hub__chart-heading { flex-wrap: wrap; }
.dglm-hub__chart-heading strong { color: #fff; display: block; font-size: clamp(26px, 4vw, 38px); letter-spacing: -.045em; line-height: 1.1; overflow-wrap: anywhere; }
.dglm-hub__freshness { color: #b2b4bc; flex: 0 1 auto; font-size: 12px; max-width: 100%; overflow-wrap: anywhere; text-align: right; }
.dglm-hub__canvas-wrap { min-height: 220px; position: relative; }
.dglm-hub__canvas-wrap,
.dglm-hub canvas { max-width: 100%; min-width: 0; }
.dglm-hub canvas { display: block; width: 100%; }

.dglm-hub__empty {
    color: #aaaeb8;
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    padding: 24px 14px;
    text-align: center;
}

.dglm-hub--empty-period .dglm-hub__chart-card { padding: 18px 20px; }
.dglm-hub--empty-period .dglm-hub__chart-heading { gap: 8px 18px; }
.dglm-hub--empty-period .dglm-hub__chart-heading strong { font-size: clamp(24px, 3.2vw, 32px); }
.dglm-hub--empty-period .dglm-hub__canvas-wrap { min-height: 0; }
.dglm-hub--empty-period #dglm-hub-empty-chart {
    padding: 14px 0 2px;
    text-align: left;
}

.dglm-hub__win-card { padding: 15px 18px; }
.dglm-hub__win-card strong { color: var(--dglm-green); }
.dglm-hub__win-card > p { color: #b9bbc3; font-size: 13px; margin: 8px 0 0; }
.dglm-hub__win-card > p span:first-child { color: var(--dglm-green); }
.dglm-hub__win-card > p span:last-child { color: var(--dglm-red); }
.dglm-hub__win-bar { background: rgba(255, 93, 108, .72); border-radius: 99px; height: 9px; margin-top: 13px; overflow: hidden; }
.dglm-hub__win-bar.is-empty { background: rgba(255, 255, 255, .1); }
.dglm-hub__win-bar i { background: var(--dglm-green); border-radius: inherit; display: block; height: 100%; transition: width .35s ease; width: 0; }

.dglm-hub__kpis { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dglm-hub__kpis > article {
    clear: none !important;
    float: none !important;
    grid-column: auto !important;
    grid-row: auto !important;
    margin: 0 !important;
    order: initial !important;
    width: auto !important;
}
.dglm-hub__kpis article { min-height: 94px; padding: 15px 16px; }
.dglm-hub__kpis strong { color: #fff; display: block; font-size: clamp(19px, 3vw, 26px); letter-spacing: -.025em; overflow-wrap: anywhere; }

.dglm-hub__current,
.dglm-hub__history { padding: clamp(16px, 2.4vw, 20px); }
.dglm-hub__section-heading { border-bottom: 1px solid rgba(255, 255, 255, .075); margin-bottom: 14px; padding-bottom: 13px; }
.dglm-hub__section-heading > span,
.dglm-hub__section-heading > strong { color: #b9bbc2; font-size: 13px; }
.dglm-hub__current-grid { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dglm-hub__current-grid > div {
    clear: none !important;
    float: none !important;
    grid-column: auto !important;
    grid-row: auto !important;
    margin: 0 !important;
    order: initial !important;
    width: auto !important;
}
.dglm-hub__current-grid > div { background: rgba(255, 255, 255, .035); border-radius: 12px; padding: 13px 14px; }
.dglm-hub__current-grid strong { color: #fff; font-size: 18px; overflow-wrap: anywhere; }

.dglm-hub__history { overflow: hidden; }
.dglm-hub__table-wrap { -webkit-overflow-scrolling: touch; max-width: 100%; overflow-x: auto; width: 100%; }
.dglm-hub table { border: 0; border-collapse: collapse; color: #e8e8eb; margin: 0; min-width: 560px; width: 100%; }
.dglm-hub th,
.dglm-hub td { background: transparent; border: 0; border-bottom: 1px solid rgba(255, 255, 255, .065); padding: 13px 10px; text-align: left; }
.dglm-hub th { color: #8f929d; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.dglm-hub td { font-size: 13px; }
.dglm-hub th:last-child,
.dglm-hub td:last-child { text-align: right; }
.dglm-hub td.is-buy { color: var(--dglm-green); }
.dglm-hub td.is-sell { color: var(--dglm-red); }

.dglm-hub .is-positive { color: var(--dglm-green) !important; }
.dglm-hub .is-negative { color: var(--dglm-red) !important; }

.dglm-hub__pagination { align-items: center; display: flex; gap: 12px; justify-content: flex-end; padding-top: 16px; }
.dglm-hub .dglm-hub__pagination > button[type="button"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    background: rgba(245, 197, 66, .1) !important;
    border: 1px solid rgba(245, 197, 66, .25) !important;
    border-radius: 9px !important;
    color: var(--dglm-gold-soft) !important;
    cursor: pointer !important;
    float: none !important;
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    min-height: 36px !important;
    padding: 7px 12px !important;
    text-transform: none !important;
    width: auto !important;
}
.dglm-hub .dglm-hub__pagination > button[type="button"]:hover:not(:disabled) {
    background: rgba(245, 197, 66, .18) !important;
}
.dglm-hub .dglm-hub__pagination > button[type="button"]:disabled {
    cursor: not-allowed !important;
    opacity: .35 !important;
}
.dglm-hub__pagination span { color: #a8aab2; font-size: 12px; }

.dglm-hub--empty-trades .dglm-hub__table-wrap,
.dglm-hub--empty-trades .dglm-hub__pagination { display: none; }
.dglm-hub--empty-trades #dglm-hub-empty-trades { padding: 18px 8px 4px; }

@keyframes dglm-hub-pulse { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }

/* The Hub responds to its actual account-content width, not the viewport. */
@container dglm-hub (max-width: 560px) {
    .dglm-hub__chart-heading { align-items: flex-start; flex-direction: column; }
    .dglm-hub__freshness { text-align: left; }
    .dglm-hub__kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dglm-hub__current-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@container dglm-hub (max-width: 460px) {
    #dglm-account-hub .dglm-hub__controls { grid-template-columns: 1fr !important; }
    html body.woocommerce-account #dglm-account-hub
    .dglm-hub__controls > label.dglm-hub__control.dglm-hub__control--product {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }
    html body.woocommerce-account #dglm-account-hub
    .dglm-hub__controls > label.dglm-hub__control.dglm-hub__control--licence {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }
    html body.woocommerce-account #dglm-account-hub
    .dglm-hub__controls > label.dglm-hub__control.dglm-hub__control--account {
        grid-column: 1 !important;
        grid-row: 3 !important;
        width: 100% !important;
    }
    #dglm-account-hub .dglm-hub__periods > button[type="button"] {
        font-size: 10px !important;
        padding-inline: 4px !important;
    }
    .dglm-hub__kpis,
    .dglm-hub__current-grid { grid-template-columns: 1fr; }
}

@media (max-width: 780px) {
    .dglm-hub { border-radius: 18px; padding: 17px; }
}

@media (max-width: 480px) {
    .dglm-hub__privacy-badge { font-size: 11px; }
    .dglm-hub__kpis article { min-height: 88px; }
    .dglm-hub__pagination { justify-content: space-between; }
}

/* Viewport fallbacks for older browsers without container-query support. */
@supports not (container-type: inline-size) {
    @media (max-width: 780px) {
        .dglm-hub__chart-heading { align-items: flex-start; flex-direction: column; }
        .dglm-hub__freshness { text-align: left; }
        .dglm-hub__kpis,
        .dglm-hub__current-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }

    @media (max-width: 480px) {
        #dglm-account-hub .dglm-hub__controls { grid-template-columns: 1fr !important; }
        html body.woocommerce-account #dglm-account-hub
        .dglm-hub__controls > label.dglm-hub__control.dglm-hub__control--product {
            grid-column: 1 !important;
            grid-row: 1 !important;
        }
        html body.woocommerce-account #dglm-account-hub
        .dglm-hub__controls > label.dglm-hub__control.dglm-hub__control--licence {
            grid-column: 1 !important;
            grid-row: 2 !important;
        }
        html body.woocommerce-account #dglm-account-hub
        .dglm-hub__controls > label.dglm-hub__control.dglm-hub__control--account {
            grid-column: 1 !important;
            grid-row: 3 !important;
            width: 100% !important;
        }
        #dglm-account-hub .dglm-hub__periods > button[type="button"] {
            font-size: 10px !important;
            padding-inline: 4px !important;
        }
        .dglm-hub__kpis,
        .dglm-hub__current-grid { grid-template-columns: 1fr; }
    }
}

@media (prefers-reduced-motion: reduce) {
    .dglm-hub *, .dglm-hub *::before, .dglm-hub *::after { animation: none !important; transition: none !important; }
}
