@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Poppins:wght@400;500;600;700;800&family=Playfair+Display:wght@500;600;700;800&family=Inter:wght@400;500;600;700;800&family=Outfit:wght@400;500;600;700;800&family=Sora:wght@400;500;600;700;800&display=swap');

/* ============ FONT VARIABLE SETS ============ */
:root{--gepp-font:'Manrope',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--gepp-font-h:'Manrope',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;}
[data-gepp-font="manrope"]{--gepp-font:'Manrope',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--gepp-font-h:'Manrope',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;}
[data-gepp-font="poppins"]{--gepp-font:'Poppins',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--gepp-font-h:'Poppins',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;}
[data-gepp-font="inter"]{--gepp-font:'Inter',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--gepp-font-h:'Inter',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;}
[data-gepp-font="outfit"]{--gepp-font:'Outfit',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--gepp-font-h:'Outfit',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;}
[data-gepp-font="sora"]{--gepp-font:'Sora',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--gepp-font-h:'Sora',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;}
[data-gepp-font="playfair"]{--gepp-font:'Poppins',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--gepp-font-h:'Playfair Display',Georgia,"Times New Roman",serif;}

/* ============ THEME VARIABLE SETS ============ */
/* Standard (light) themes: colour accents only, light surfaces (defaults below) */
:root{
    --gepp-surface:#fff;--gepp-surface-2:#fbfbfe;--gepp-surface-3:#f4f5f9;
    --gepp-text:#171b2b;--gepp-text-2:#3b4258;--gepp-text-muted:#6b7290;
    --gepp-border:#eef0f5;--gepp-border-2:#e2e6ee;--gepp-border-3:#f0f1f6;
    --gepp-shadow-rgb:15,23,42;--gepp-hero-text:#fff;--gepp-btn-text:#fff;
    --gepp-wrap-bg:transparent;--gepp-wrap-pad:0;--gepp-wrap-radius:0;--gepp-wrap-border:none;--gepp-wrap-shadow:none;
}
[data-gepp-theme="royal-violet"]{--p1:#7c3aed;--p2:#a855f7;--p3:#ec4899;--tint:#f5f3ff;}
[data-gepp-theme="ocean-blue"]{--p1:#0369a1;--p2:#0891b2;--p3:#22d3ee;--tint:#ecfeff;}
[data-gepp-theme="sunset-orange"]{--p1:#c2410c;--p2:#ea580c;--p3:#fb923c;--tint:#fff7ed;}
[data-gepp-theme="emerald-green"]{--p1:#047857;--p2:#059669;--p3:#34d399;--tint:#ecfdf5;}
[data-gepp-theme="midnight-gold"]{--p1:#1e293b;--p2:#334155;--p3:#eab308;--tint:#fefce8;}
[data-gepp-theme="ruby-red"]{--p1:#9f1239;--p2:#e11d48;--p3:#fb7185;--tint:#fff1f2;}
[data-gepp-theme="cyber-teal"]{--p1:#0f766e;--p2:#0d9488;--p3:#2dd4bf;--tint:#f0fdfa;}

/* ============ OBSIDIAN GOLD — the one fully-dark theme ============
   Deep black glass-panel system: dark surfaces, glowing gold accents. */
[data-gepp-theme="obsidian-gold"]{--p1:#a3720a;--p2:#eab308;--p3:#ffd875;--tint:#241d0f;--gepp-btn-text:#1a1408;}

.gepp-dark{
    --gepp-surface:#171310;--gepp-surface-2:#1d1812;--gepp-surface-3:#221b13;
    --gepp-text:#f2ece0;--gepp-text-2:#ddd2ba;--gepp-text-muted:#ab9c81;
    --gepp-border:color-mix(in srgb, var(--p2) 18%, transparent);
    --gepp-border-2:color-mix(in srgb, var(--p2) 32%, transparent);
    --gepp-border-3:color-mix(in srgb, var(--p2) 14%, transparent);
    --gepp-shadow-rgb:0,0,0;--gepp-hero-text:var(--gepp-btn-text);
    --gepp-wrap-bg:
        radial-gradient(1200px 420px at 15% -10%, color-mix(in srgb, var(--p2) 20%, transparent), transparent 60%),
        radial-gradient(900px 380px at 100% 0%, color-mix(in srgb, var(--p2) 12%, transparent), transparent 55%),
        linear-gradient(180deg,#0b0a08,#090807 55%,#0b0a08);
    --gepp-wrap-pad:26px;--gepp-wrap-radius:28px;
    --gepp-wrap-border:1px solid color-mix(in srgb, var(--p2) 30%, transparent);
    --gepp-wrap-shadow:0 30px 80px -30px rgba(0,0,0,.75), 0 0 0 1px color-mix(in srgb, var(--p2) 6%, transparent) inset, 0 0 60px -20px color-mix(in srgb, var(--p2) 22%, transparent);
}

/* ============ THE OTHER 4 PREMIUM THEMES — bright/white surfaces ============
   Same extra polish (glowing accent border, shine-sweep buttons) as Obsidian
   Gold, but cards/nav/inputs stay white/light — only the accent colour and
   glow differ between them. */
[data-gepp-theme="emerald-premium"]{--p1:#047857;--p2:#10b981;--p3:#34d399;--tint:#ecfdf5;--gepp-btn-text:#fff;}
[data-gepp-theme="sapphire-premium"]{--p1:#1d4ed8;--p2:#3b82f6;--p3:#93c5fd;--tint:#eff6ff;--gepp-btn-text:#fff;}
[data-gepp-theme="crimson-premium"]{--p1:#9f1239;--p2:#e11d48;--p3:#fb7185;--tint:#fff1f2;--gepp-btn-text:#fff;}
[data-gepp-theme="platinum-premium"]{--p1:#3f3f46;--p2:#71717a;--p3:#d4d4d8;--tint:#f4f4f5;--gepp-btn-text:#fff;}

.gepp-premium-light{
    --gepp-wrap-pad:22px;--gepp-wrap-radius:28px;
    --gepp-wrap-bg:
        radial-gradient(1100px 380px at 15% -10%, color-mix(in srgb, var(--p2) 8%, transparent), transparent 60%),
        #ffffff;
    --gepp-wrap-border:1px solid color-mix(in srgb, var(--p2) 16%, #eef0f5);
    --gepp-wrap-shadow:0 26px 60px -28px color-mix(in srgb, var(--p1) 35%, transparent), 0 0 0 1px color-mix(in srgb, var(--p2) 5%, transparent) inset;
}
.gepp-premium-light .gepp-hero{box-shadow:0 24px 55px -18px color-mix(in srgb, var(--p1) 55%, transparent), 0 0 0 1px color-mix(in srgb, var(--p3) 30%, transparent) inset}
.gepp-premium-light .gepp-card{border:1.5px solid color-mix(in srgb, var(--p2) 18%, var(--gepp-border));box-shadow:0 16px 40px -20px color-mix(in srgb, var(--p1) 30%, transparent)}
.gepp-premium-light .gepp-card::before{opacity:.9;box-shadow:0 0 12px color-mix(in srgb, var(--p2) 45%, transparent)}
.gepp-premium-light .gepp-nav{border:1.5px solid color-mix(in srgb, var(--p2) 14%, var(--gepp-border))}
.gepp-premium-light .gepp-stat{border:1.5px solid color-mix(in srgb, var(--p2) 16%, transparent)}
.gepp-premium-light .gepp-btn::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;
    background:linear-gradient(120deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);transition:left .5s ease}
.gepp-premium-light .gepp-btn:hover::after{left:130%}
.gepp-premium-light .gepp-hero-badge{background:color-mix(in srgb, var(--p2) 16%, transparent);border:1px solid color-mix(in srgb, var(--p2) 35%, transparent);letter-spacing:.06em;text-transform:uppercase;font-size:11px}

/* ============ BASE ============ */
.gepp-wrap{
    font-family:var(--gepp-font);
    max-width:1100px;margin:30px auto;padding:0 14px;color:var(--gepp-text);line-height:1.55;
    animation:geppFadeUp .5s ease both;
}
.gepp-wrap *{box-sizing:border-box}
@keyframes geppFadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes geppFadeIn{from{opacity:0}to{opacity:1}}

/* Both premium theme groups turn the whole wrap into a floating panel */
.gepp-wrap{background:var(--gepp-wrap-bg);border:var(--gepp-wrap-border);border-radius:var(--gepp-wrap-radius);
    box-shadow:var(--gepp-wrap-shadow);padding-top:var(--gepp-wrap-pad);padding-bottom:var(--gepp-wrap-pad)}
.gepp-wrap.gepp-dark,.gepp-wrap.gepp-premium-light{padding-left:calc(14px + var(--gepp-wrap-pad));padding-right:calc(14px + var(--gepp-wrap-pad))}
@media(max-width:600px){.gepp-wrap.gepp-dark,.gepp-wrap.gepp-premium-light{padding-left:16px;padding-right:16px;--gepp-wrap-pad:18px}}

.gepp-dark ::selection{background:rgba(255,255,255,.25);color:#fff}

/* Force our own text colours to win over the parent WordPress theme's own
   heading/paragraph styling — otherwise a theme that hard-codes dark heading
   colours leaves headings invisible on our dark panels. This applies on
   every theme (light or dark) so third-party theme CSS can never leak in. */
.gepp-wrap h1,.gepp-wrap h2,.gepp-wrap h3,.gepp-wrap h4,.gepp-wrap h5,.gepp-wrap h6{
    color:var(--gepp-text)!important;font-family:var(--gepp-font-h)!important;
}
.gepp-wrap p,.gepp-wrap span,.gepp-wrap li,.gepp-wrap div,.gepp-wrap strong,.gepp-wrap small{color:inherit}
.gepp-wrap label{color:var(--gepp-text-2)!important}
.gepp-wrap .gepp-muted{color:var(--gepp-text-muted)!important}
.gepp-wrap .gepp-table td{color:var(--gepp-text)!important}
.gepp-wrap .gepp-table th{color:var(--gepp-text-muted)!important}
.gepp-wrap .gepp-input,.gepp-wrap .gepp-select,.gepp-wrap textarea.gepp-input{color:var(--gepp-text)!important}
.gepp-auth-widget{color:var(--gepp-text)}

.gepp-hero{
    position:relative;overflow:hidden;border-radius:28px;padding:42px 36px;color:var(--gepp-hero-text);
    background:linear-gradient(135deg,var(--p1),var(--p2) 55%,var(--p3));
    margin-bottom:22px;box-shadow:0 20px 45px -14px color-mix(in srgb, var(--p1) 55%, transparent);
}
.gepp-hero::after{content:"";position:absolute;right:-70px;top:-70px;width:240px;height:240px;border-radius:50%;background:rgba(255,255,255,.14)}
.gepp-hero::before{content:"";position:absolute;left:-50px;bottom:-80px;width:180px;height:180px;border-radius:50%;background:rgba(255,255,255,.10)}
.gepp-hero h1{margin:0 0 8px;font-size:28px;font-weight:800;letter-spacing:-.02em;position:relative;color:var(--gepp-hero-text)!important}
.gepp-hero p{margin:0;opacity:.94;font-size:14.5px;position:relative;color:var(--gepp-hero-text)}
.gepp-hero-badge{position:relative;display:inline-block;margin-top:16px;padding:7px 16px;border-radius:99px;background:rgba(255,255,255,.18);font-size:12.5px;font-weight:700}

/* Noir themes: hero becomes a dark glass panel with a glowing outline in the
   theme's own accent colour instead of a flat colour fill, plus a subtle
   gradient-text heading — reads as "premium tool" rather than a banner */
.gepp-dark .gepp-hero{
    background:linear-gradient(160deg, color-mix(in srgb, var(--p1) 16%, #120f0c), #0d0b09 75%);
    border:1px solid color-mix(in srgb, var(--p2) 45%, transparent);
    box-shadow:0 20px 50px -20px rgba(0,0,0,.7), 0 0 40px -10px color-mix(in srgb, var(--p2) 28%, transparent) inset;
}
.gepp-dark .gepp-hero::after{background:radial-gradient(circle,color-mix(in srgb, var(--p2) 35%, transparent),transparent 70%)}
.gepp-dark .gepp-hero::before{background:radial-gradient(circle,color-mix(in srgb, var(--p2) 18%, transparent),transparent 70%)}
.gepp-dark .gepp-hero h1{background:linear-gradient(90deg,var(--p3),var(--p2) 45%,var(--p3));-webkit-background-clip:text;background-clip:text;color:transparent!important}
.gepp-dark .gepp-hero p{color:var(--gepp-text-2)!important;opacity:1}
.gepp-dark .gepp-hero-badge{background:color-mix(in srgb, var(--p2) 14%, transparent);border:1px solid color-mix(in srgb, var(--p2) 40%, transparent);color:var(--p3);letter-spacing:.06em;text-transform:uppercase;font-size:11px}

.gepp-nav{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;padding:8px;background:var(--gepp-surface);
    border:1px solid var(--gepp-border);border-radius:16px;box-shadow:0 6px 20px rgba(var(--gepp-shadow-rgb),.06)}
.gepp-nav a{flex:1 1 auto;text-align:center;padding:11px 12px;border-radius:11px;
    font-weight:800;font-size:13px;transition:.15s ease;white-space:nowrap;
    text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.3px}
.gepp-nav.gepp-nav-no-underline a{text-decoration:none}
.gepp-wrap.gepp-btn-no-underline .gepp-btn{text-decoration:none}

/* Style 1 (default): "soft" - every item looks like a real button, tinted background */
.gepp-nav[data-style="soft"] a,.gepp-nav:not([data-style]) a{background:var(--tint);color:var(--p1);border:1px solid transparent}
.gepp-nav[data-style="soft"] a:hover,.gepp-nav:not([data-style]) a:hover{filter:brightness(.97)}
.gepp-nav[data-style="soft"] a.active,.gepp-nav:not([data-style]) a.active{background:linear-gradient(135deg,var(--p1),var(--p2));color:#fff;box-shadow:0 8px 16px -8px var(--p1)}
.gepp-dark .gepp-nav[data-style="soft"] a,.gepp-dark .gepp-nav:not([data-style]) a{color:var(--p3)}
.gepp-dark .gepp-nav[data-style="soft"] a.active,
.gepp-dark .gepp-nav:not([data-style]) a.active{color:var(--gepp-btn-text);box-shadow:0 8px 20px -8px color-mix(in srgb, var(--p2) 60%, transparent)}

/* Style 2: "outline" - bordered pill buttons */
.gepp-nav[data-style="outline"] a{background:var(--gepp-surface);color:var(--gepp-text-2);border:1.5px solid var(--gepp-border-2)}
.gepp-nav[data-style="outline"] a:hover{border-color:var(--p1);color:var(--p1)}
.gepp-nav[data-style="outline"] a.active{background:transparent;color:var(--p1);border-color:var(--p1)}
.gepp-dark .gepp-nav[data-style="outline"] a.active{color:var(--p3);border-color:var(--p2)}

/* Style 3: "solid-muted" - light grey buttons, solid colour when active */
.gepp-nav[data-style="solid-muted"] a{background:var(--gepp-surface-3);color:var(--gepp-text-2);border:1px solid transparent}
.gepp-nav[data-style="solid-muted"] a:hover{filter:brightness(1.1)}
.gepp-nav[data-style="solid-muted"] a.active{background:linear-gradient(135deg,var(--p1),var(--p2));color:#fff}
.gepp-dark .gepp-nav[data-style="solid-muted"] a.active{color:var(--gepp-btn-text)}

/* Style 4: "minimal" - text buttons with an underline instead of a fill */
.gepp-nav[data-style="minimal"] a{background:transparent;color:var(--gepp-text-2);border-bottom:2.5px solid transparent;border-radius:4px}
.gepp-nav[data-style="minimal"] a:hover{color:var(--p1)}
.gepp-nav[data-style="minimal"] a.active{color:var(--p1);border-bottom-color:var(--p1);background:var(--tint)}
.gepp-dark .gepp-nav[data-style="minimal"] a.active{color:var(--p3)}

.gepp-card{background:var(--gepp-surface);border:1px solid var(--gepp-border);border-radius:22px;padding:28px;margin:16px 0;
    box-shadow:0 12px 32px rgba(var(--gepp-shadow-rgb),.06);animation:geppFadeIn .4s ease both}
.gepp-card h2{margin:0 0 16px;font-size:20px;font-weight:800;letter-spacing:-.01em}
.gepp-narrow{max-width:520px;margin-left:auto;margin-right:auto}
.gepp-center{text-align:center}
.gepp-dark .gepp-card{box-shadow:0 18px 40px -16px rgba(0,0,0,.6)}

.gepp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin-bottom:6px}
.gepp-stat{position:relative;padding:22px;border-radius:18px;background:var(--tint);border:1px solid rgba(0,0,0,.04);
    transition:transform .15s ease}
.gepp-dark .gepp-stat{border:1px solid var(--gepp-border)}
.gepp-stat:hover{transform:translateY(-3px)}
.gepp-stat .ic{font-size:22px;display:block;margin-bottom:8px}
.gepp-stat span:not(.ic){display:block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--gepp-text-muted)!important}
.gepp-stat strong{font-size:24px;font-weight:800;display:block;margin-top:6px;color:var(--gepp-text)!important;letter-spacing:normal;word-break:break-word}
.gepp-stat-btn{display:inline-block;margin-top:12px;padding:6px 16px;border-radius:99px;
    background:linear-gradient(135deg,var(--p1),var(--p2));color:#fff;font-weight:800;font-size:12.5px;
    text-decoration:none!important;transition:.15s ease;box-shadow:0 6px 14px -8px var(--p1)}
.gepp-stat-btn:hover{filter:brightness(1.08);color:#fff}
.gepp-dark .gepp-stat-btn{color:var(--gepp-btn-text)!important}

label{display:block;font-size:13px;font-weight:700;color:var(--gepp-text-2);margin:0 0 6px}
.gepp-input,.gepp-select,textarea.gepp-input{
    width:100%;padding:13px 14px;border:1.5px solid var(--gepp-border-2);border-radius:13px;margin:0 0 16px;
    font-size:14.5px;line-height:1.4;color:var(--gepp-text);background:var(--gepp-surface-2);transition:.15s ease;font-family:inherit;
}
.gepp-select{
    -webkit-appearance:none;-moz-appearance:none;appearance:none;
    height:48px;padding-right:38px;cursor:pointer;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23565f79'><path d='M5.25 7.5L10 12.25L14.75 7.5H5.25Z'/></svg>");
    background-repeat:no-repeat;background-position:right 12px center;background-size:16px;
}
.gepp-dark .gepp-select{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23d8cfba'><path d='M5.25 7.5L10 12.25L14.75 7.5H5.25Z'/></svg>")}
.gepp-input:focus{outline:none;border-color:var(--p1);background:var(--gepp-surface);box-shadow:0 0 0 4px color-mix(in srgb, var(--p1) 15%, transparent)}
.gepp-select:focus{outline:none;border-color:var(--p1);background-color:var(--gepp-surface);box-shadow:0 0 0 4px color-mix(in srgb, var(--p1) 15%, transparent)}
.gepp-input[readonly]{background:var(--gepp-surface-3);cursor:copy}
.gepp-input::placeholder{color:var(--gepp-text-muted);opacity:.8}

.gepp-pass-wrap{position:relative;margin:0 0 16px}
.gepp-pass-wrap .gepp-input{margin-bottom:0;padding-right:44px}
.gepp-pass-toggle{position:absolute;top:0;right:2px;height:100%;width:40px;display:flex;align-items:center;justify-content:center;
    background:transparent;border:0;padding:0;cursor:pointer;color:var(--gepp-text-muted);transition:color .15s ease}
.gepp-pass-toggle:hover{color:var(--p1)}
.gepp-dark .gepp-pass-toggle:hover,.gepp-premium-light .gepp-pass-toggle:hover{color:var(--p2)}

.gepp-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:13px;
    position:relative;overflow:hidden;
    padding:13px 22px;background:linear-gradient(135deg,var(--p1),var(--p2));color:#fff;cursor:pointer;
    font-weight:800;font-size:14.5px;transition:.15s ease;box-shadow:0 10px 20px -10px var(--p1);
    text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.3px}
.gepp-btn:hover{filter:brightness(1.07);transform:translateY(-1px);color:#fff}
.gepp-btn.ghost{background:var(--gepp-surface);color:var(--p1);border:1.5px solid var(--gepp-border-2);box-shadow:none}
.gepp-btn.block{width:100%}
.gepp-btn.sm{padding:9px 16px;font-size:13px;border-radius:10px}
.gepp-actionrow{display:flex;gap:12px;flex-wrap:wrap}

/* Noir themes: primary buttons use whichever text colour reads best on that
   theme's accent gradient, plus a soft shine sweep on hover for a genuine
   "premium tool" feel */
.gepp-dark .gepp-btn{color:var(--gepp-btn-text)!important;box-shadow:0 10px 26px -10px color-mix(in srgb, var(--p2) 55%, transparent)}
.gepp-dark .gepp-btn:hover{color:var(--gepp-btn-text)!important}
.gepp-dark .gepp-btn::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;
    background:linear-gradient(120deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);transition:left .5s ease}
.gepp-dark .gepp-btn:hover::after{left:130%}
.gepp-dark .gepp-btn.ghost{color:var(--p3)!important;border-color:var(--gepp-border-2)}
.gepp-dark .gepp-btn.ghost:hover{background:color-mix(in srgb, var(--p2) 8%, transparent)}

.gepp-table{width:100%;border-collapse:collapse;font-size:14px}
.gepp-table th{text-align:left;padding:11px 12px;color:var(--gepp-text-muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;border-bottom:2px solid var(--gepp-border-3)}
.gepp-table td{padding:13px 12px;border-bottom:1px solid var(--gepp-border-3);color:var(--gepp-text)}
.gepp-table tr:last-child td{border-bottom:none}
.gepp-table-wrap{overflow-x:auto}

.gepp-badge{display:inline-block;padding:5px 12px;border-radius:99px;font-size:11px;font-weight:800;letter-spacing:.02em}
.gepp-badge-pending{background:#fef3c7;color:#92400e}
.gepp-badge-approved,.gepp-badge-paid,.gepp-badge-active{background:#dcfce7;color:#166534}
.gepp-badge-rejected,.gepp-badge-suspended{background:#fee2e2;color:#991b1b}
.gepp-badge-open{background:#dbeafe;color:#1e40af}
.gepp-badge-closed{background:#e5e7eb;color:#374151}
.gepp-dark .gepp-badge-pending{background:rgba(234,179,8,.16);color:#ffd875}
.gepp-dark .gepp-badge-approved,.gepp-dark .gepp-badge-paid,.gepp-dark .gepp-badge-active{background:rgba(52,211,153,.16);color:#6ee7b7}
.gepp-dark .gepp-badge-rejected,.gepp-dark .gepp-badge-suspended{background:rgba(248,113,113,.16);color:#fca5a5}
.gepp-dark .gepp-badge-open{background:rgba(96,165,250,.16);color:#93c5fd}
.gepp-dark .gepp-badge-closed{background:rgba(255,255,255,.08);color:var(--gepp-text-muted)}

.gepp-alert{padding:14px 16px;border-radius:13px;margin:0 0 16px;font-size:14px;font-weight:600;border:1px solid transparent}
.gepp-alert-error,.gepp-alert.gepp-alert-error{background:#fef2f2;color:#991b1b;border-color:#fecaca}
.gepp-alert-success,.gepp-alert.gepp-alert-success{background:#f0fdf4;color:#166534;border-color:#bbf7d0}
.gepp-alert-info{background:#eff6ff;color:#1e40af;border-color:#bfdbfe}
.gepp-alert-toast{animation:geppToastIn .35s cubic-bezier(.34,1.56,.64,1) both;box-shadow:0 8px 20px rgba(15,23,42,.08)}
@keyframes geppToastIn{from{opacity:0;transform:translateY(-10px) scale(.98)}to{opacity:1;transform:none}}
.gepp-dark .gepp-alert-error,.gepp-dark .gepp-alert.gepp-alert-error{background:rgba(248,113,113,.1);color:#fca5a5;border-color:rgba(248,113,113,.3)}
.gepp-dark .gepp-alert-success,.gepp-dark .gepp-alert.gepp-alert-success{background:rgba(52,211,153,.1);color:#6ee7b7;border-color:rgba(52,211,153,.3)}
.gepp-dark .gepp-alert-info{background:rgba(96,165,250,.1);color:#93c5fd;border-color:rgba(96,165,250,.3)}

.gepp-empty{text-align:center;padding:48px 24px}
.gepp-empty .ic{font-size:36px;margin-bottom:14px;display:inline-flex;align-items:center;justify-content:center;
    width:64px;height:64px;border-radius:50%;background:var(--tint)}
.gepp-empty h2{border:0}
.gepp-empty p{color:var(--gepp-text-muted)!important;margin:6px 0 0}

.gepp-btn:active{transform:translateY(0)}
.gepp-btn:disabled{opacity:.7;cursor:wait;transform:none}
.gepp-card{position:relative}
.gepp-card::before{content:"";position:absolute;top:0;left:24px;right:24px;height:3px;border-radius:0 0 6px 6px;
    background:linear-gradient(90deg,var(--p1),var(--p2),var(--p3));opacity:.55}
.gepp-dark .gepp-card::before{opacity:.9;box-shadow:0 0 12px color-mix(in srgb, var(--p2) 60%, transparent)}

.gepp-copyrow{display:flex;gap:10px;align-items:center;margin-bottom:16px}
.gepp-copyrow .gepp-input{margin-bottom:0}
.gepp-muted{color:var(--gepp-text-muted);font-size:13.5px}

.gepp-switch-line{margin-top:26px;text-align:center}
.gepp-switch-line a{display:inline-block;margin-left:6px;padding:6px 16px;border-radius:99px;
    background:var(--tint);color:var(--p1);font-weight:800;text-decoration:none;transition:.15s ease}
.gepp-switch-line a:hover{filter:brightness(.95)}
.gepp-dark .gepp-switch-line a{color:var(--p3)}

/* ============ HEADER AUTH WIDGET (shortcode: [gepp_auth_buttons]) ============ */
.gepp-auth-widget{display:inline-flex;align-items:center;gap:8px;font-family:var(--gepp-font)}
.gepp-auth-widget .gepp-auth-btn{display:inline-flex;align-items:center;justify-content:center;padding:9px 18px;
    border-radius:10px;font-weight:800;font-size:13.5px;text-decoration:none;transition:.15s ease;white-space:nowrap;letter-spacing:normal}
.gepp-auth-widget .gepp-auth-login{background:var(--gepp-surface);color:var(--p1);border:1.5px solid var(--p1)}
.gepp-auth-widget .gepp-auth-login:hover{background:var(--tint)}
.gepp-auth-widget .gepp-auth-signup{background:linear-gradient(135deg,var(--p1),var(--p2));color:#fff;box-shadow:0 8px 16px -8px var(--p1)}
.gepp-auth-widget .gepp-auth-signup:hover{filter:brightness(1.06)}
.gepp-auth-widget .gepp-auth-balance{background:var(--tint);color:var(--p1);border:1.5px solid transparent}
.gepp-auth-widget .gepp-auth-balance:hover{border-color:var(--p1)}
.gepp-auth-widget.gepp-dark .gepp-auth-login{color:var(--p3)}
.gepp-auth-widget.gepp-dark .gepp-auth-signup,
.gepp-auth-widget.gepp-dark .gepp-auth-balance{color:var(--gepp-btn-text)}

.gepp-thread{margin-bottom:16px}
.gepp-html-widget{line-height:1.6}
.gepp-html-widget p{margin:0 0 10px}
.gepp-html-widget p:last-child{margin-bottom:0}
.gepp-html-widget img{max-width:100%;height:auto}
.gepp-msg{padding:14px 16px;border-radius:14px;margin-bottom:10px;background:var(--gepp-surface-3)}
.gepp-msg-admin{background:var(--tint);border:1px solid rgba(0,0,0,.04)}
.gepp-dark .gepp-msg-admin{border:1px solid var(--gepp-border)}
.gepp-msg p{margin:6px 0}

@media(max-width:600px){
    .gepp-card{padding:20px;border-radius:18px}
    .gepp-hero{padding:30px 22px;border-radius:22px}
    .gepp-nav a{font-size:12px;padding:9px 8px}
}

/* ============ LOGOUT CONFIRMATION MODAL ============ */
body.gepp-modal-open{overflow:hidden}
.gepp-modal-overlay{
    position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;
    background:rgba(10,10,12,.55);backdrop-filter:blur(3px);padding:16px;
    animation:geppFadeIn .18s ease both;font-family:var(--gepp-font);
}
.gepp-modal-overlay *{box-sizing:border-box}
.gepp-modal-box{
    width:100%;max-width:380px;background:var(--gepp-surface);border:1px solid var(--gepp-border);
    border-radius:20px;padding:26px 24px;box-shadow:0 30px 70px -20px rgba(0,0,0,.45);
    animation:geppModalIn .22s cubic-bezier(.34,1.56,.64,1) both;position:relative;overflow:hidden;
}
.gepp-modal-box::before{content:"";position:absolute;top:0;left:22px;right:22px;height:3px;border-radius:0 0 6px 6px;
    background:linear-gradient(90deg,var(--p1),var(--p2),var(--p3));opacity:.55}
@keyframes geppModalIn{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
.gepp-modal-box h3{margin:0 0 10px;font-family:var(--gepp-font-h)!important;font-size:19px;font-weight:800;color:var(--gepp-text)!important}
.gepp-modal-box p{margin:0 0 22px;font-size:14px;line-height:1.55;color:var(--gepp-text-muted)!important}
.gepp-modal-actions{display:flex;gap:10px;justify-content:flex-end}
.gepp-modal-actions .gepp-btn{flex:1 1 auto}
.gepp-modal-overlay.gepp-btn-no-underline .gepp-btn{text-decoration:none}
.gepp-dark.gepp-modal-overlay .gepp-modal-box{box-shadow:0 30px 70px -20px rgba(0,0,0,.7), 0 0 40px -18px color-mix(in srgb, var(--p2) 30%, transparent)}
.gepp-premium-light.gepp-modal-overlay .gepp-modal-box{box-shadow:0 30px 70px -20px color-mix(in srgb, var(--p1) 35%, transparent)}

/* ============ HOME PAGE ============ */
.gepp-ic{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:14px;
    background:var(--tint);color:var(--p1);margin-bottom:12px}
.gepp-ic-svg{width:22px;height:22px}
.gepp-dark .gepp-ic,.gepp-premium-light .gepp-ic{color:var(--p2)}

.gepp-section-title{margin:0 0 4px;font-size:22px}
.gepp-section-sub{margin:0 0 24px!important;font-size:14px}

/* --- Hero --- */
.gepp-home-hero{position:relative;overflow:hidden;border-radius:28px;padding:64px 32px;margin-bottom:22px;
    background:linear-gradient(135deg,var(--p1),var(--p2) 55%,var(--p3));text-align:center;isolation:isolate}
.gepp-dark .gepp-home-hero,.gepp-premium-light .gepp-home-hero{
    background:linear-gradient(160deg, color-mix(in srgb, var(--p1) 16%, #120f0c), #0d0b09 75%);
    border:1px solid color-mix(in srgb, var(--p2) 40%, transparent);
}
.gepp-premium-light .gepp-home-hero{background:linear-gradient(160deg,#fff,color-mix(in srgb, var(--p2) 6%, #fff) 75%);border:1px solid color-mix(in srgb, var(--p2) 20%, #eef0f5)}
.gepp-home-orb{position:absolute;border-radius:50%;filter:blur(10px);z-index:-1;animation:geppOrbFloat 9s ease-in-out infinite}
.gepp-home-orb-1{width:280px;height:280px;top:-100px;left:-60px;background:rgba(255,255,255,.16)}
.gepp-home-orb-2{width:220px;height:220px;bottom:-90px;right:-40px;background:rgba(255,255,255,.12);animation-delay:-4s}
.gepp-dark .gepp-home-orb,.gepp-premium-light .gepp-home-orb{background:color-mix(in srgb, var(--p2) 30%, transparent)!important}
@keyframes geppOrbFloat{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(18px,-14px) scale(1.08)}}
.gepp-home-hero-inner{position:relative;max-width:680px;margin:0 auto}
.gepp-home-hero h1{margin:14px 0 14px;font-size:32px;font-weight:800;letter-spacing:-.02em;line-height:1.2;color:var(--gepp-hero-text)}
.gepp-dark .gepp-home-hero h1,.gepp-premium-light .gepp-home-hero h1{
    background:linear-gradient(90deg,var(--p3),var(--p2) 45%,var(--p3));-webkit-background-clip:text;background-clip:text;color:transparent}
.gepp-home-lead{margin:0;font-size:15px;line-height:1.7;color:var(--gepp-hero-text);opacity:.95}
.gepp-dark .gepp-home-lead,.gepp-premium-light .gepp-home-lead{color:var(--gepp-text-2)!important;opacity:1}

/* --- Animated trust-stat counters --- */
.gepp-count-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:22px}
.gepp-count-card{text-align:center;padding:28px 18px;border-radius:20px;background:var(--gepp-surface);
    border:1px solid var(--gepp-border);box-shadow:0 12px 32px rgba(var(--gepp-shadow-rgb),.06)}
.gepp-dark .gepp-count-card,.gepp-premium-light .gepp-count-card{box-shadow:0 16px 36px -18px color-mix(in srgb, var(--p1) 30%, transparent)}
.gepp-count{display:block;font-size:32px;font-weight:800;letter-spacing:-.02em;
    background:linear-gradient(90deg,var(--p1),var(--p2));-webkit-background-clip:text;background-clip:text;color:transparent}
.gepp-count-card span:not(.gepp-count){display:block;margin-top:8px;font-size:13px;font-weight:700;color:var(--gepp-text-muted);text-transform:uppercase;letter-spacing:.04em}

/* --- How It Works timeline --- */
.gepp-timeline{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:26px;position:relative}
.gepp-timeline-step{position:relative;text-align:left}
.gepp-timeline-step h3{margin:0 0 8px;font-size:16px}
.gepp-timeline-step p{margin:0;font-size:13.5px;color:var(--gepp-text-muted);line-height:1.6}
@media(min-width:760px){
    .gepp-timeline::before{content:"";position:absolute;top:22px;left:calc(100%/6);right:calc(100%/6);height:2px;
        background:linear-gradient(90deg,var(--p1),var(--p2),var(--p3));opacity:.35}
}

/* --- Fresh-Gmail requirement boxes --- */
.gepp-fresh-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.gepp-fresh-box{padding:22px;border-radius:16px;border:1.5px solid var(--gepp-border)}
.gepp-fresh-box h3{margin:0 0 12px;font-size:15px;display:flex;align-items:center;gap:8px}
.gepp-fresh-box h3 .gepp-ic{width:28px;height:28px;margin:0;border-radius:9px}
.gepp-fresh-box h3 .gepp-ic-svg{width:16px;height:16px}
.gepp-fresh-box ul{margin:0;padding-left:20px;font-size:13.5px;color:var(--gepp-text-2);line-height:1.8}
.gepp-fresh-good{background:color-mix(in srgb, #10b981 8%, var(--gepp-surface))}
.gepp-fresh-good h3 .gepp-ic{background:rgba(16,185,129,.15);color:#10b981}
.gepp-fresh-bad{background:color-mix(in srgb, #ef4444 6%, var(--gepp-surface))}
.gepp-fresh-bad h3 .gepp-ic{background:rgba(239,68,68,.13);color:#ef4444}

/* --- Payment methods --- */
.gepp-method-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}
.gepp-method-badge{display:flex;align-items:center;gap:10px;padding:16px;border-radius:14px;background:var(--tint);
    border:1px solid transparent;font-weight:700;font-size:14px;color:var(--gepp-text);transition:.15s ease}
.gepp-method-badge:hover{transform:translateY(-3px);border-color:var(--p2)}
.gepp-method-badge .gepp-ic{width:34px;height:34px;margin:0;border-radius:10px;background:var(--gepp-surface);color:var(--p1)}
.gepp-method-badge .gepp-ic-svg{width:17px;height:17px}
.gepp-dark .gepp-method-badge .gepp-ic,.gepp-premium-light .gepp-method-badge .gepp-ic{color:var(--p2)}

/* --- Final CTA banner --- */
.gepp-home-cta{text-align:center;padding:48px 28px;border-radius:26px;margin:18px 0 6px;
    background:linear-gradient(135deg,var(--p1),var(--p2) 55%,var(--p3))}
.gepp-dark .gepp-home-cta,.gepp-premium-light .gepp-home-cta{
    background:linear-gradient(160deg, color-mix(in srgb, var(--p1) 16%, #120f0c), #0d0b09 75%);
    border:1px solid color-mix(in srgb, var(--p2) 40%, transparent);
}
.gepp-premium-light .gepp-home-cta{background:linear-gradient(160deg,#fff,color-mix(in srgb, var(--p2) 6%, #fff) 75%);border:1px solid color-mix(in srgb, var(--p2) 20%, #eef0f5)}
.gepp-home-cta h2{margin:0 0 10px;font-size:24px;color:var(--gepp-hero-text)}
.gepp-dark .gepp-home-cta h2,.gepp-premium-light .gepp-home-cta h2{color:var(--gepp-text)!important}
.gepp-home-cta p{margin:0 0 22px;color:var(--gepp-hero-text);opacity:.95}
.gepp-dark .gepp-home-cta p,.gepp-premium-light .gepp-home-cta p{color:var(--gepp-text-muted)!important;opacity:1}

/* --- Scroll-reveal animation (fires once via IntersectionObserver) --- */
.gepp-reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease, transform .6s ease}
.gepp-reveal.gepp-reveal-in{opacity:1;transform:none}

@media(max-width:600px){
    .gepp-home-hero{padding:44px 20px;border-radius:22px}
    .gepp-home-hero h1{font-size:24px}
    .gepp-count{font-size:26px}
}

/* ============ WP-ADMIN PANEL STYLING (always light — unaffected by frontend theme) ============ */
.gepp-admin-wrap{font-family:'Manrope',system-ui,sans-serif}
.gepp-admin-cards{display:flex;gap:16px;flex-wrap:wrap;margin:18px 0}
.gepp-admin-card{background:#fff;padding:22px 24px;min-width:190px;border:1px solid #e5e7eb;border-radius:16px;box-shadow:0 8px 22px rgba(15,23,42,.05)}
.gepp-admin-card .ic{font-size:20px;display:block;margin-bottom:6px}
.gepp-admin-card b{color:#6b7280;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.gepp-admin-card h2{margin:6px 0 0;font-size:24px}
.gepp-admin-card.gepp-block{width:100%}
.gepp-tabbar{display:flex;gap:8px;margin:16px 0}
.gepp-tabbar a{padding:8px 16px;border-radius:10px;background:#fff;border:1px solid #e5e7eb;text-decoration:none;color:#374151;font-weight:600;font-size:13px}
.gepp-tabbar a.active{background:#111827;color:#fff;border-color:#111827}
.gepp-bulkbar{display:flex;gap:8px;align-items:center;margin:14px 0}

/* Per-row Approve/Reject with a typed reason (Gmail Management table) */
.gepp-row-decision{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.gepp-row-reason-input{min-width:190px;padding:5px 8px;border:1px solid #dcdcde;border-radius:4px;font-size:13px}

/* Rejected reason shown to users, and mirrored in wp-admin */
.gepp-reason-rejected{color:#dc2626;font-weight:700}