
/* ==========================================================================
   SliceWP Partner Portal - premium front-end skin
   ========================================================================== */

#slicewp-affiliate-account.slicewp-portal {
    --swp-ink: #10213f;
    --swp-muted: #70809b;
    --swp-blue: #246bfe;
    --swp-blue-dark: #123a91;
    --swp-cyan: #22c7e8;
    --swp-violet: #7a5cff;
    --swp-green: #16b981;
    --swp-orange: #f59e0b;
    --swp-red: #ef476f;
    --swp-surface: #ffffff;
    --swp-bg: #f4f7fc;
    --swp-line: #e8edf5;
    --swp-radius: 20px;
    --swp-shadow: 0 14px 45px rgba(21, 44, 86, .08);
    --swp-shadow-hover: 0 22px 55px rgba(21, 44, 86, .14);
    width: 100%;
    max-width: 100%;
    margin: 0;
    color: var(--swp-ink);
    font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15px;
    line-height: 1.5;
    box-sizing: border-box;
}

#slicewp-affiliate-account.slicewp-portal *,
#slicewp-affiliate-account.slicewp-portal *::before,
#slicewp-affiliate-account.slicewp-portal *::after { box-sizing: border-box; }

#slicewp-affiliate-account.slicewp-portal img { max-width: 100%; }
#slicewp-affiliate-account.slicewp-portal button,
#slicewp-affiliate-account.slicewp-portal input,
#slicewp-affiliate-account.slicewp-portal select { font: inherit; }

#slicewp-affiliate-account.slicewp-portal .slicewp-portal-shell {
    min-height: 720px;
    display: grid;
    grid-template-columns: 270px minmax(0, 1fr);
    background: var(--swp-bg);
    border-radius: 26px;
    overflow: hidden;
    box-shadow: var(--swp-shadow);
    border: 1px solid rgba(221, 229, 242, .9);
}

.slicewp-portal-sidebar {
    position: relative;
    z-index: 20;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 24px 15px 18px;
    background:
        radial-gradient(circle at 10% 0%, rgba(70, 137, 255, .28), transparent 35%),
        radial-gradient(circle at 100% 65%, rgba(122, 92, 255, .18), transparent 35%),
        linear-gradient(180deg, #0d1e3c 0%, #0a1730 100%);
    color: #fff;
}

.slicewp-portal-brand { min-height: 52px; display:flex; align-items:center; justify-content:space-between; padding: 0 9px 20px; }
.slicewp-portal-brand-link { display:flex; align-items:center; gap:11px; color:#fff !important; text-decoration:none !important; min-width:0; }
.slicewp-portal-logo-image { display:block; width:auto; max-width:145px; max-height:38px; object-fit:contain; filter: brightness(0) invert(1); }
.slicewp-portal-logo-mark {
    display:grid; place-items:center; width:38px; height:38px; flex:0 0 38px; border-radius:12px;
    background:linear-gradient(135deg, var(--swp-blue), var(--swp-violet));
    font-size:16px; font-weight:800; box-shadow:0 9px 25px rgba(36,107,254,.3);
}
.slicewp-portal-brand-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:17px; font-weight:800; letter-spacing:-.3px; }
.slicewp-portal-mobile-close { display:none; background:transparent; border:0; color:#fff; cursor:pointer; padding:7px; }
.slicewp-portal-mobile-close svg { width:21px; height:21px; }

.slicewp-portal-profile {
    display:flex; align-items:center; gap:11px; margin: 2px 5px 25px; padding:13px 11px;
    border:1px solid rgba(255,255,255,.08); border-radius:16px; background:rgba(255,255,255,.055);
}
.slicewp-portal-avatar { width:42px !important; height:42px !important; border-radius:13px !important; object-fit:cover; border:2px solid rgba(255,255,255,.22); }
.slicewp-portal-profile-copy { min-width:0; display:flex; flex-direction:column; }
.slicewp-portal-profile-copy strong { color:#fff; font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.slicewp-portal-profile-copy span { color:#9eafd0; font-size:11px; display:flex; align-items:center; gap:5px; margin-top:2px; }
.slicewp-portal-profile-copy i { width:6px; height:6px; border-radius:50%; background:#3cda9b; box-shadow:0 0 0 3px rgba(60,218,155,.12); }

.slicewp-portal-nav-label { padding:0 11px 9px; color:#7084a8; text-transform:uppercase; letter-spacing:1.25px; font-size:9px; font-weight:800; }
.slicewp-portal-nav ul { list-style:none !important; margin:0 !important; padding:0 !important; display:grid; gap:5px; }
.slicewp-portal-nav li { list-style:none !important; margin:0 !important; padding:0 !important; position:relative; }
.slicewp-portal-nav li a {
    position:relative; min-height:47px; display:flex !important; align-items:center; gap:12px; padding:0 13px !important;
    border-radius:13px; color:#9aaaca !important; text-decoration:none !important; font-size:13px; font-weight:650;
    transition:transform .22s ease, color .22s ease, background .22s ease, box-shadow .22s ease;
}
.slicewp-portal-nav li a:hover { color:#fff !important; background:rgba(255,255,255,.065); transform:translateX(2px); }
.slicewp-portal-nav li.slicewp-active a {
    color:#fff !important;
    background:linear-gradient(90deg, rgba(43,111,255,.98), rgba(57,117,255,.76));
    box-shadow:0 9px 24px rgba(36,107,254,.23);
}
.slicewp-portal-nav li a svg { width:19px !important; height:19px !important; flex:0 0 19px; opacity:.88; }
.slicewp-portal-nav li.slicewp-active a svg { opacity:1; }
.slicewp-portal-nav-dot { width:6px; height:6px; margin-left:auto; border-radius:50%; background:#55e5b0; box-shadow:0 0 0 4px rgba(85,229,176,.09); }

.slicewp-portal-sidebar-bottom { margin-top:auto; padding:17px 5px 0; border-top:1px solid rgba(255,255,255,.07); }
.slicewp-portal-home-link { display:flex; align-items:center; gap:9px; color:#8295b7 !important; text-decoration:none !important; font-size:11px; padding:9px; border-radius:10px; transition:all .2s ease; }
.slicewp-portal-home-link:hover { color:#fff !important; background:rgba(255,255,255,.05); }
.slicewp-portal-home-link svg { width:15px; height:15px; }

.slicewp-portal-main { min-width:0; background:var(--swp-bg); }
.slicewp-portal-topbar {
    height:74px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 34px;
    background:rgba(255,255,255,.88); border-bottom:1px solid var(--swp-line); backdrop-filter:blur(18px);
}
.slicewp-portal-menu-toggle { display:none; width:40px; height:40px; border:1px solid var(--swp-line); background:#fff; border-radius:12px; padding:9px; cursor:pointer; }
.slicewp-portal-menu-toggle span { display:block; height:2px; width:19px; margin:3px auto; border-radius:4px; background:var(--swp-ink); }
.slicewp-portal-breadcrumbs { display:flex; align-items:center; gap:10px; min-width:0; color:#9aa7bb; font-size:12px; }
.slicewp-portal-breadcrumbs span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.slicewp-portal-breadcrumbs b { color:#ccd3de; font-weight:500; }
.slicewp-portal-breadcrumbs strong { color:var(--swp-ink); font-weight:750; }
.slicewp-portal-top-actions { display:flex; align-items:center; gap:12px; }
.slicewp-portal-icon-button {
    width:38px; height:38px; border:1px solid var(--swp-line); border-radius:12px; background:#fff; color:#71819a;
    display:grid; place-items:center; cursor:pointer; transition:all .2s ease;
}
.slicewp-portal-icon-button:hover { color:var(--swp-blue); border-color:#cddcff; transform:translateY(-1px); box-shadow:0 7px 16px rgba(28,75,150,.08); }
.slicewp-portal-help-button span { font-weight:800; font-size:14px; }
.slicewp-portal-user-mini { display:flex; align-items:center; gap:8px; font-size:12px; font-weight:750; color:var(--swp-ink); }
.slicewp-portal-user-mini img { width:34px; height:34px; border-radius:11px; object-fit:cover; }

.slicewp-portal-content { padding:30px 34px 42px; max-width:1500px; margin:0 auto; }
.slicewp-portal-welcome {
    position:relative; overflow:hidden; min-height:190px; margin-bottom:25px; padding:30px 31px;
    display:flex; align-items:center; justify-content:space-between; gap:25px; border-radius:22px;
    color:#fff; background:
      radial-gradient(circle at 75% 10%, rgba(84,221,255,.30), transparent 25%),
      radial-gradient(circle at 90% 120%, rgba(123,92,255,.40), transparent 35%),
      linear-gradient(120deg, #112f69 0%, #1553bd 52%, #1c75db 100%);
    box-shadow:0 17px 42px rgba(24,83,178,.2);
}
.slicewp-portal-welcome::after { content:""; position:absolute; width:250px; height:250px; right:-90px; top:-120px; border:1px solid rgba(255,255,255,.11); border-radius:50%; box-shadow:0 0 0 28px rgba(255,255,255,.025), 0 0 0 56px rgba(255,255,255,.018); }
.slicewp-portal-welcome-glow { position:absolute; left:35%; bottom:-120px; width:270px; height:220px; background:rgba(68,234,245,.17); filter:blur(60px); border-radius:50%; pointer-events:none; }
.slicewp-portal-welcome-copy { position:relative; z-index:2; }
.slicewp-portal-eyebrow { display:inline-flex; align-items:center; gap:7px; margin-bottom:9px; color:#b9dcff; font-size:10px; font-weight:850; text-transform:uppercase; letter-spacing:1.4px; }
.slicewp-portal-eyebrow::before { content:""; width:19px; height:2px; border-radius:4px; background:#57d9f3; }
.slicewp-portal-welcome h1 { margin:0 !important; color:#fff !important; font-size:31px !important; line-height:1.12 !important; letter-spacing:-1px; font-weight:800 !important; }
.slicewp-portal-welcome h1 span { color:#73e6ff; font-size:22px; }
.slicewp-portal-welcome p { margin:9px 0 0 !important; max-width:560px; color:#c7dcfb; font-size:13px; }
.slicewp-portal-referral {
    position:relative; z-index:2; min-width:360px; max-width:460px; display:flex; align-items:center; gap:11px;
    padding:10px 10px 10px 12px; border:1px solid rgba(255,255,255,.17); border-radius:15px; background:rgba(255,255,255,.10); backdrop-filter:blur(10px);
}
.slicewp-portal-referral-icon { width:39px; height:39px; flex:0 0 39px; display:grid; place-items:center; border-radius:11px; background:rgba(255,255,255,.12); }
.slicewp-portal-referral-icon svg { width:18px; height:18px; }
.slicewp-portal-referral-copy { min-width:0; flex:1; display:flex; flex-direction:column; }
.slicewp-portal-referral-copy span { color:#a9c9ee; font-size:9px; text-transform:uppercase; letter-spacing:1px; font-weight:800; }
.slicewp-portal-referral-copy strong { margin-top:2px; color:#fff; font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.slicewp-portal-copy-link {
    flex:0 0 auto; min-height:38px; padding:0 13px; display:flex; align-items:center; gap:6px; border:0; border-radius:10px;
    background:#fff; color:#1749a0; font-size:11px; font-weight:800; cursor:pointer; transition:transform .2s ease, box-shadow .2s ease;
}
.slicewp-portal-copy-link:hover { transform:translateY(-1px); box-shadow:0 7px 18px rgba(0,0,0,.13); }
.slicewp-portal-copy-link svg { width:15px; height:15px; }

.slicewp-portal-panels { min-width:0; }
.slicewp-portal-panels > .slicewp-tab { animation:swpFadeUp .42s ease both; }
@keyframes swpFadeUp { from { opacity:0; transform:translateY(7px); } to { opacity:1; transform:none; } }

/* Re-skin native SliceWP cards and grids. */
#slicewp-affiliate-account.slicewp-portal .slicewp-grid {
    gap:16px !important; margin:0 0 18px !important;
}
#slicewp-affiliate-account.slicewp-portal .slicewp-card {
    border:1px solid var(--swp-line) !important;
    border-radius:17px !important;
    background:var(--swp-surface) !important;
    box-shadow:0 7px 25px rgba(27,56,102,.045) !important;
    overflow:hidden;
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
#slicewp-affiliate-account.slicewp-portal .slicewp-card:hover {
    transform:translateY(-3px);
    border-color:#dce5f3 !important;
    box-shadow:var(--swp-shadow-hover) !important;
}
#slicewp-affiliate-account.slicewp-portal .slicewp-card-inner { padding:20px !important; }
#slicewp-affiliate-account.slicewp-portal .slicewp-card-title {
    color:#7a89a1 !important; font-size:10px !important; text-transform:uppercase; letter-spacing:.9px; font-weight:800 !important;
}
#slicewp-affiliate-account.slicewp-portal .slicewp-kpi-value {
    color:var(--swp-ink) !important; font-size:27px !important; font-weight:820 !important; letter-spacing:-.7px; margin-top:5px;
}
#slicewp-affiliate-account.slicewp-portal .slicewp-kpi-direction { font-size:10px !important; font-weight:750; }
#slicewp-affiliate-account.slicewp-portal .slicewp-card-footer {
    padding:12px 20px !important; background:#fafbfd !important; border-top:1px solid #eef2f7 !important;
}
#slicewp-affiliate-account.slicewp-portal .slicewp-card-footer a { color:var(--swp-blue) !important; font-size:11px; font-weight:750; text-decoration:none; }
#slicewp-affiliate-account.slicewp-portal .slicewp-section-heading {
    margin:27px 0 11px !important; color:var(--swp-ink) !important; font-size:14px !important; font-weight:800 !important; letter-spacing:-.2px;
}
#slicewp-affiliate-account.slicewp-portal .slicewp-affiliate-dashboard-filters {
    display:flex; justify-content:flex-end; margin:0 0 15px; padding:0 !important;
}
#slicewp-affiliate-account.slicewp-portal .slicewp-affiliate-dashboard-filters form { display:flex; align-items:center; gap:8px; }
#slicewp-affiliate-account.slicewp-portal .slicewp-button-primary {
    min-height:38px !important; border:0 !important; border-radius:10px !important; background:var(--swp-blue) !important; box-shadow:0 7px 18px rgba(36,107,254,.2);
    font-size:11px !important; font-weight:800 !important; padding:0 15px !important; transition:transform .2s ease, box-shadow .2s ease;
}
#slicewp-affiliate-account.slicewp-portal .slicewp-button-primary:hover { transform:translateY(-1px); box-shadow:0 10px 22px rgba(36,107,254,.28); }
#slicewp-affiliate-account.slicewp-portal .slicewp-chart-before { padding-bottom:13px; }
#slicewp-affiliate-account.slicewp-portal .slicewp-chart-time-unit-selector,
#slicewp-affiliate-account.slicewp-portal select,
#slicewp-affiliate-account.slicewp-portal input[type="text"],
#slicewp-affiliate-account.slicewp-portal input[type="email"],
#slicewp-affiliate-account.slicewp-portal input[type="password"] {
    min-height:40px; border:1px solid #dfe6f0 !important; border-radius:10px !important; background:#fff !important; color:var(--swp-ink) !important;
}
#slicewp-affiliate-account.slicewp-portal table { border-collapse:separate !important; border-spacing:0 !important; width:100%; border:1px solid var(--swp-line); border-radius:15px; overflow:hidden; background:#fff; }
#slicewp-affiliate-account.slicewp-portal th { background:#f8faff !important; color:#74839b !important; font-size:9px !important; text-transform:uppercase; letter-spacing:.7px; font-weight:800 !important; border-bottom:1px solid var(--swp-line) !important; }
#slicewp-affiliate-account.slicewp-portal td { border-bottom:1px solid #eef2f7 !important; color:#53637b !important; font-size:12px !important; }
#slicewp-affiliate-account.slicewp-portal tr:last-child td { border-bottom:0 !important; }
#slicewp-affiliate-account.slicewp-portal a { transition:color .2s ease; }
#slicewp-affiliate-account.slicewp-portal .slicewp-positive { color:var(--swp-green) !important; }
#slicewp-affiliate-account.slicewp-portal .slicewp-negative { color:var(--swp-red) !important; }

/* Status / message polish. */
#slicewp-affiliate-account.slicewp-portal .slicewp-user-notice,
#slicewp-affiliate-account.slicewp-portal .slicewp-notice {
    border-radius:13px !important; border:1px solid var(--swp-line); box-shadow:0 5px 20px rgba(25,50,90,.04);
}

/* Mobile drawer. */
.slicewp-portal-mobile-backdrop { display:none; }

@media (max-width: 1100px) {
    #slicewp-affiliate-account.slicewp-portal .slicewp-portal-shell { grid-template-columns:230px minmax(0,1fr); }
    .slicewp-portal-content { padding:25px; }
    .slicewp-portal-topbar { padding:0 25px; }
    .slicewp-portal-welcome { align-items:flex-start; flex-direction:column; }
    .slicewp-portal-referral { width:100%; max-width:620px; min-width:0; }
}

@media (max-width: 820px) {
    #slicewp-affiliate-account.slicewp-portal .slicewp-portal-shell { display:block; border-radius:0; border:0; box-shadow:none; min-height:100vh; }
    .slicewp-portal-sidebar {
        position:fixed; inset:0 auto 0 0; width:280px; transform:translateX(-102%); transition:transform .28s cubic-bezier(.22,.61,.36,1);
        box-shadow:20px 0 55px rgba(6,18,42,.25);
    }
    #slicewp-affiliate-account.slicewp-portal.slicewp-menu-open .slicewp-portal-sidebar { transform:translateX(0); }
    .slicewp-portal-mobile-close { display:block; }
    .slicewp-portal-mobile-backdrop { position:fixed; inset:0; z-index:15; background:rgba(7,19,40,.48); backdrop-filter:blur(2px); opacity:0; pointer-events:none; display:block; transition:opacity .25s ease; }
    #slicewp-affiliate-account.slicewp-portal.slicewp-menu-open .slicewp-portal-mobile-backdrop { opacity:1; pointer-events:auto; }
    .slicewp-portal-topbar { height:66px; padding:0 18px; }
    .slicewp-portal-menu-toggle { display:block; }
    .slicewp-portal-breadcrumbs { flex:1; }
    .slicewp-portal-user-mini span,
    .slicewp-portal-help-button { display:none; }
    .slicewp-portal-content { padding:18px 16px 30px; }
    .slicewp-portal-welcome { padding:23px 20px; border-radius:18px; margin-bottom:18px; }
    .slicewp-portal-welcome h1 { font-size:25px !important; }
    .slicewp-portal-welcome p { font-size:12px; }
    .slicewp-portal-referral { padding:8px; }
    #slicewp-affiliate-account.slicewp-portal .slicewp-affiliate-dashboard-filters { justify-content:stretch; }
    #slicewp-affiliate-account.slicewp-portal .slicewp-affiliate-dashboard-filters form { width:100%; }
}

@media (max-width: 560px) {
    .slicewp-portal-referral-copy strong { max-width:130px; }
    .slicewp-portal-copy-link span { display:none; }
    .slicewp-portal-copy-link { width:39px; padding:0; justify-content:center; }
    .slicewp-portal-content { padding:13px 11px 25px; }
    .slicewp-portal-topbar { padding:0 12px; }
    .slicewp-portal-breadcrumbs { font-size:11px; }
    #slicewp-affiliate-account.slicewp-portal .slicewp-grid { grid-template-columns:1fr !important; }
    #slicewp-affiliate-account.slicewp-portal .slicewp-card-inner { padding:17px !important; }
    #slicewp-affiliate-account.slicewp-portal .slicewp-kpi-value { font-size:24px !important; }
    #slicewp-affiliate-account.slicewp-portal table { display:block; overflow-x:auto; white-space:nowrap; }
}

/* Reduced motion accessibility. */
@media (prefers-reduced-motion: reduce) {
    #slicewp-affiliate-account.slicewp-portal *,
    #slicewp-affiliate-account.slicewp-portal *::before,
    #slicewp-affiliate-account.slicewp-portal *::after {
        animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important;
    }
}
