/* ═════════════════════════════════════════════════════════════════════════
   GRANNY'S MEMBER DASHBOARD — STYLES
   ═════════════════════════════════════════════════════════════════════════

   ┌─────────────────────────────────────────────────────────────────────┐
   │  YOUR COLOR CONTROL PANEL                                           │
   │  Change any hex value below and it applies everywhere in the        │
   │  dashboard. Hover, click, backgrounds, badges — all controlled      │
   │  here. Nothing else in this file needs editing to change colors.    │
   └─────────────────────────────────────────────────────────────────────┘ */

.gdash-wrap {
    /* ── Hover & click states ─────────────────────────────────────────── */
    --gdash-hover-bg:      #fcd67e;   /* background when hovering a link/card */
    --gdash-hover-border:  #FDB439;   /* border when hovering                 */
    --gdash-hover-text:    #1F2933;   /* text color when hovering             */
    --gdash-active-bg:     #FFE9BB;   /* background while clicking            */

    /* ── Normal states ────────────────────────────────────────────────── */
    --gdash-card-bg:       #fdf6e6;   /* link card / panel item background    */
    --gdash-card-border:   #FDB439;   /* normal border                        */
    --gdash-card-text:     #1F2933;   /* normal text                          */

    /* ── Panels & headers ─────────────────────────────────────────────── */
    --gdash-panel-bg:      #ffffff;   /* panel (cream) background             */
    --gdash-header-bg:     #FDB439;   /* panel title bar background (gold)    */
    --gdash-header-text:   #1F2933;   /* panel title bar text                 */

    /* ── Accents ──────────────────────────────────────────────────────── */
    --gdash-count-bg:      #E47B02;   /* activity count / badge background    */
    --gdash-count-text:    #FFFFFF;   /* activity count / badge text          */
    --gdash-stat-value:    #8B5A2B;   /* big stat numbers (brown)             */
    --gdash-muted:         #7B8794;   /* dates, small print                   */

    /* Neutralize the site-wide Kadence button color inside the dashboard */
    --global-palette-btn-bg: #FDB439;
    --global-palette-btn-bg-hover: #FFF3D6;
}

/* ═══ Base panel ═══════════════════════════════════════════════════════ */

.gdash-wrap {
    font-size: 17px;
    line-height: 1.5;
    color: var(--gdash-card-text);
    margin-bottom: 24px;
}

.gdash-panel {
    background: var(--gdash-panel-bg) !important;
    border: 1px solid var(--gdash-card-border);
    border-radius: 10px;
    overflow: hidden;
    padding: 0 0 16px 0;
}

.gdash-panel-title {
    background: var(--gdash-header-bg) !important;
    color: var(--gdash-header-text) !important;
    margin: 0 0 14px 0 !important;
    padding: 12px 18px !important;
    font-size: 20px !important;
    font-weight: 700;
}

.gdash-sub-title {
    margin: 18px 16px 8px 16px !important;
    padding: 0 !important;
    font-size: 16px !important;
    color: var(--gdash-card-text);
    border-bottom: 2px solid var(--gdash-header-bg);
    padding-bottom: 4px !important;
}

.gdash-empty {
    margin: 4px 16px 8px 16px;
    color: var(--gdash-muted);
    font-style: italic;
}

/* ═══ Welcome ══════════════════════════════════════════════════════════ */

.gdash-welcome {
    display: flex;
    align-items: center;
    gap: 16px;
    border: 2px solid #FDB439;
    background: #f8f3e6;
    border-radius: 10px;
    padding: 18px 22px;
}

.gdash-welcome-avatar img,
.gdash-welcome-avatar span {
    border-radius: 50%;
    border: 3px solid #FFFFFF;
    display: block;
}

.gdash-welcome-title {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--gdash-header-text) !important;
    font-size: 26px !important;
    font-weight: 800;
}

.gdash-welcome-sub {
    margin: 4px 0 0 0;
    color: var(--gdash-header-text);
    font-size: 16px;
}

/* ═══ Announcements ════════════════════════════════════════════════════ */

.gdash-announcement {
    background: var(--gdash-card-bg);
    border: 1px solid var(--gdash-card-border);
    border-radius: 8px;
    margin: 0 16px 12px 16px;
    padding: 12px 14px;
}

.gdash-announcement-head {
    display: flex;
    align-items: center;
    gap: 10px;
}

.gdash-announcement-title {
    flex: 1;
    font-size: 17px;
}

.gdash-announcement-body {
    margin-top: 6px;
}

.gdash-announcement-body p { margin: 0 0 8px 0; }
.gdash-announcement-body p:last-child { margin-bottom: 0; }

.gdash-announcement-date {
    margin-top: 6px;
    font-size: 13px;
    color: var(--gdash-muted);
}

.gdash-badge {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    color: #1F2933;
    background: #F3F4F7;
}

.gdash-badge-news        { background: #FDB439; }
.gdash-badge-event       { background: #BFE3C0; }
.gdash-badge-maintenance { background: #D7DDE4; }
.gdash-badge-security    { background: #F6C6C4; }
.gdash-badge-promo       { background: #FFE08A; }

.gdash-dismiss {
    background: none !important;
    border: none !important;
    color: var(--gdash-muted) !important;
    font-size: 22px !important;
    line-height: 1 !important;
    cursor: pointer;
    padding: 0 4px !important;
    width: auto !important;
    box-shadow: none !important;
}

.gdash-dismiss:hover {
    color: var(--gdash-card-text) !important;
    background: none !important;
}

/* ═══ Activity ═════════════════════════════════════════════════════════ */

.gdash-activity-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: var(--gdash-card-bg) !important;
    border: 1px solid var(--gdash-card-border) !important;
    border-radius: 8px;
    margin: 0 16px 10px 16px;
    padding: 12px 14px;
    text-decoration: none !important;
    color: var(--gdash-card-text) !important;
    font-size: 17px;
}

.gdash-activity-row:hover,
.gdash-activity-row:focus {
    background: var(--gdash-hover-bg) !important;
    border-color: var(--gdash-hover-border) !important;
    color: var(--gdash-hover-text) !important;
}

.gdash-activity-row:active {
    background: var(--gdash-active-bg) !important;
}

.gdash-count {
    min-width: 34px;
    text-align: center;
    background: #E8E0D8;
    color: #52606D;
    border-radius: 16px;
    padding: 3px 10px;
    font-weight: 700;
    font-size: 15px;
}

.gdash-has-count .gdash-count {
    background: var(--gdash-count-bg);
    color: var(--gdash-count-text);
}

.gdash-friend-recipe {
    display: block;
    background: var(--gdash-card-bg) !important;
    border: 1px solid var(--gdash-card-border) !important;
    border-radius: 8px;
    margin: 0 16px 8px 16px;
    padding: 10px 14px;
    text-decoration: none !important;
    color: var(--gdash-card-text) !important;
}

.gdash-friend-recipe:hover,
.gdash-friend-recipe:focus {
    background: var(--gdash-hover-bg) !important;
    border-color: var(--gdash-hover-border) !important;
    color: var(--gdash-hover-text) !important;
}

.gdash-friend-recipe:active { background: var(--gdash-active-bg) !important; }

.gdash-friend-recipe-name { font-weight: 700; display: block; }
.gdash-friend-recipe-author { font-size: 14px; color: var(--gdash-muted); }

.gdash-see-all {
    display: inline-block;
    margin: 4px 16px 0 16px;
    color: #B25E00 !important;
    text-decoration: underline !important;
    font-weight: 600;
}

.gdash-see-all:hover { color: var(--gdash-hover-text) !important; }

/* ═══ Stats ════════════════════════════════════════════════════════════ */

.gdash-stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
    margin: 0 16px;
}

.gdash-stat-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background: var(--gdash-card-bg) !important;
    border: 1px solid var(--gdash-card-border) !important;
    border-radius: 8px;
    padding: 16px 10px;
    text-decoration: none !important;
    color: var(--gdash-card-text) !important;
}

a.gdash-stat-card:hover,
a.gdash-stat-card:focus {
    background: var(--gdash-hover-bg) !important;
    border-color: var(--gdash-hover-border) !important;
}

a.gdash-stat-card:active { background: var(--gdash-active-bg) !important; }

.gdash-stat-value {
    font-size: 34px;
    font-weight: 800;
    color: var(--gdash-stat-value);
    line-height: 1.1;
}

.gdash-stat-label {
    font-size: 14px;
    margin-top: 6px;
    color: var(--gdash-card-text);
}

.gdash-review {
    display: block;
    background: var(--gdash-card-bg) !important;
    border: 1px solid var(--gdash-card-border) !important;
    border-radius: 8px;
    margin: 0 16px 8px 16px;
    padding: 10px 14px;
    text-decoration: none !important;
    color: var(--gdash-card-text) !important;
}

.gdash-review:hover,
.gdash-review:focus {
    background: var(--gdash-hover-bg) !important;
    border-color: var(--gdash-hover-border) !important;
    color: var(--gdash-hover-text) !important;
}

.gdash-review:active { background: var(--gdash-active-bg) !important; }

.gdash-review-stars {
    color: #E47B02;
    font-size: 16px;
    letter-spacing: 2px;
    display: block;
}

.gdash-review-meta { display: block; margin-top: 2px; }

.gdash-review-excerpt {
    display: block;
    margin-top: 4px;
    font-style: italic;
    color: var(--gdash-muted);
    font-size: 15px;
}

/* ═══ Links panel ══════════════════════════════════════════════════════ */

.gdash-link-group {
    margin: 16px 16px 8px 16px !important;
    padding: 0 0 4px 0 !important;
    font-size: 16px !important;
    color: var(--gdash-card-text);
    border-bottom: 2px solid var(--gdash-header-bg);
}

.gdash-link-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0 16px;
}

.gdash-link-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    background: var(--gdash-card-bg) !important;
    border: 1px solid var(--gdash-card-border) !important;
    border-radius: 8px;
    padding: 13px 16px;
    font-size: 17px;
    font-weight: 600;
    text-decoration: none !important;
    color: var(--gdash-card-text) !important;
    transition: background 0.12s ease, border-color 0.12s ease;
}

.gdash-link-card:hover,
.gdash-link-card:focus {
    background: var(--gdash-hover-bg) !important;
    border-color: var(--gdash-hover-border) !important;
    color: var(--gdash-hover-text) !important;
}

.gdash-link-card:active {
    background: var(--gdash-active-bg) !important;
    border-color: var(--gdash-hover-border) !important;
}

.gdash-link-badge {
    background: var(--gdash-count-bg);
    color: var(--gdash-count-text);
    border-radius: 16px;
    padding: 2px 10px;
    font-size: 14px;
    font-weight: 700;
}

/* ═══ Mobile ═══════════════════════════════════════════════════════════ */

@media (max-width: 600px) {
    .gdash-welcome { flex-direction: column; text-align: center; }
    .gdash-welcome-title { font-size: 22px !important; }
    .gdash-stat-grid { grid-template-columns: 1fr 1fr; }
}