/* Guild Shares - Modern Premium Theme */
:root{
    --bg: #f5f1e8;
    --bg-soft: #fbf8f2;
    --surface: rgba(255,255,255,0.82);
    --surface-strong: #ffffff;
    --border: rgba(16,24,40,0.08);
    --text: #15233b;
    --muted: #667085;
    --navy: #0f2341;
    --navy-2: #162d52;
    --gold: #b5843a;
    --gold-2: #d5b078;
    --success: #1e8e5b;
    --warning: #c88a10;
    --danger: #c24747;
    --shadow-lg: 0 18px 50px rgba(15, 35, 65, 0.10);
    --shadow-md: 0 10px 28px rgba(15, 35, 65, 0.08);
    --radius-xl: 28px;
    --radius-lg: 22px;
    --radius-md: 16px;
    --radius-sm: 12px;
}

*{box-sizing:border-box}
body{
    margin:0;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color:var(--text);
    background:
        radial-gradient(circle at top left, rgba(181,132,58,0.10), transparent 28%),
        radial-gradient(circle at right 12%, rgba(15,35,65,0.08), transparent 20%),
        linear-gradient(180deg, #fbf8f2 0%, #f4efe5 100%);
    min-height:100vh;
}

a{color:var(--navy)}
a:hover{color:var(--gold)}
img{max-width:100%}

.app-shell{
    min-height:100vh;
    display:flex;
    flex-direction:column;
}

.app-main{
    flex:1 1 auto;
}

.container-xxl{
    max-width:1360px;
}

.glass-nav{
    position:sticky;
    top:0;
    z-index:1020;
    backdrop-filter: blur(14px);
    background:rgba(255,255,255,0.72);
    border-bottom:1px solid rgba(181,132,58,0.16);
}

.brand-wrap{
    display:flex;
    align-items:center;
    gap:14px;
    text-decoration:none;
}

.brand-mark{
    width:52px;
    height:52px;
    border-radius:18px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:linear-gradient(145deg, var(--navy), #1b3b6b);
    box-shadow:0 8px 20px rgba(15,35,65,0.25);
}

.brand-copy{
    display:flex;
    flex-direction:column;
    line-height:1.05;
}

.brand-title{
    font-size:1.05rem;
    font-weight:800;
    letter-spacing:0.14em;
    color:var(--navy);
}

.brand-subtitle{
    color:var(--muted);
    font-size:0.78rem;
}

.navbar{
    padding:14px 0;
}

.navbar-nav{
    gap:8px;
}

.nav-link{
    border-radius:999px;
    padding:10px 16px !important;
    color:var(--navy);
    font-weight:600;
    transition:all .18s ease;
    white-space:nowrap;
}

.nav-link:hover,
.nav-link.active{
    color:#fff !important;
    background:linear-gradient(135deg, var(--navy), #274674);
    box-shadow:0 10px 22px rgba(15,35,65,0.18);
}

.top-user-pill{
    padding:8px 14px;
    border-radius:999px;
    background:rgba(15,35,65,0.06);
    color:var(--navy);
    font-weight:600;
}

.btn{
    border-radius:14px;
    padding:11px 18px;
    font-weight:700;
    box-shadow:none !important;
}

.btn-sm{
    border-radius:12px;
    padding:8px 14px;
}

.btn-primary,
.btn-dark{
    border:none;
    color:#fff;
    background:linear-gradient(135deg, var(--gold), #9c6c24);
}
.btn-primary:hover,
.btn-dark:hover{
    color:#fff;
    filter:brightness(0.98);
}

.btn-outline-secondary,
.btn-outline-dark{
    border:1px solid rgba(15,35,65,0.10);
    color:var(--navy);
    background:rgba(255,255,255,0.7);
}
.btn-outline-secondary:hover,
.btn-outline-dark:hover{
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg, var(--navy), #274674);
}

.form-control,
.form-select{
    border-radius:14px;
    border:1px solid rgba(15,35,65,0.10);
    padding:12px 14px;
    background:rgba(255,255,255,0.86);
    color:var(--text);
}
.form-control:focus,
.form-select:focus{
    border-color:rgba(181,132,58,0.38);
    box-shadow:0 0 0 4px rgba(181,132,58,0.13);
}

.card{
    border:none;
    border-radius:var(--radius-lg);
    background:var(--surface);
    backdrop-filter:blur(10px);
    box-shadow:var(--shadow-md);
}

.section-card{
    border:none;
    border-radius:var(--radius-xl);
    background:var(--surface);
    box-shadow:var(--shadow-lg);
}

.page-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    margin-bottom:20px;
}

.page-kicker{
    color:var(--gold);
    text-transform:uppercase;
    letter-spacing:0.12em;
    font-size:0.78rem;
    font-weight:800;
    margin-bottom:8px;
}

.page-title{
    margin:0;
    font-size:clamp(1.8rem, 2.7vw, 2.6rem);
    font-weight:900;
    color:var(--navy);
}

.page-lead{
    margin:8px 0 0;
    color:var(--muted);
    max-width:740px;
}

.hero-premium{
    position:relative;
    overflow:hidden;
    padding:34px;
    border-radius:34px;
    color:#fff;
    background:
        radial-gradient(circle at 80% 20%, rgba(213,176,120,0.20), transparent 18%),
        radial-gradient(circle at 20% 0%, rgba(255,255,255,0.08), transparent 20%),
        linear-gradient(135deg, #0f2341 0%, #162f58 45%, #0c1730 100%);
    box-shadow:0 20px 50px rgba(15,35,65,0.22);
}
.hero-premium:before{
    content:"";
    position:absolute;
    right:-120px;
    bottom:-120px;
    width:420px;
    height:420px;
    border:1px solid rgba(213,176,120,0.25);
    border-radius:50%;
}
.hero-premium:after{
    content:"";
    position:absolute;
    right:40px;
    top:30px;
    width:180px;
    height:180px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(213,176,120,0.16), transparent 70%);
}
.hero-badge{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:10px 14px;
    border-radius:999px;
    background:rgba(255,255,255,0.08);
    border:1px solid rgba(255,255,255,0.10);
    font-weight:700;
}
.hero-title{
    font-size:clamp(2rem, 4vw, 3.2rem);
    line-height:1.02;
    font-weight:900;
    margin:18px 0 10px;
}
.hero-title .accent{
    color:var(--gold-2);
}
.hero-text{
    max-width:760px;
    color:rgba(255,255,255,0.78);
    font-size:1.03rem;
}

.kpi-card{
    height:100%;
    padding:24px;
    position:relative;
    overflow:hidden;
}
.kpi-card .label{
    color:var(--muted);
    font-size:0.93rem;
}
.kpi-card .value{
    font-size:2rem;
    font-weight:900;
    color:var(--navy);
}
.kpi-card .mini{
    color:var(--muted);
    font-size:0.9rem;
}
.kpi-card .dot{
    position:absolute;
    width:92px;
    height:92px;
    border-radius:50%;
    right:-18px;
    top:-18px;
    background:radial-gradient(circle, rgba(181,132,58,0.20), rgba(181,132,58,0.02));
}

.section-title{
    font-size:1.1rem;
    font-weight:800;
    color:var(--navy);
    margin-bottom:4px;
}
.section-subtitle{
    color:var(--muted);
    font-size:0.95rem;
}

.table{
    --bs-table-bg: transparent;
    vertical-align:middle;
}
.table thead th{
    border-bottom:1px solid rgba(15,35,65,0.08);
    color:var(--muted);
    font-weight:800;
    font-size:0.88rem;
    text-transform:uppercase;
    letter-spacing:0.06em;
}
.table tbody td{
    border-color:rgba(15,35,65,0.06);
    color:var(--text);
}
.table tbody tr:hover{
    background:rgba(255,255,255,0.44);
}

.badge{
    border-radius:999px;
    padding:8px 12px;
    font-weight:800;
}
.badge-soft{
    background:rgba(15,35,65,0.08);
    color:var(--navy);
}
.bg-success{
    background:linear-gradient(135deg, #1f9a61, #17794b) !important;
}
.bg-warning{
    background:linear-gradient(135deg, #d89a1f, #b97a10) !important;
}
.bg-danger{
    background:linear-gradient(135deg, #d45e5e, #b23f3f) !important;
}
.bg-secondary{
    background:linear-gradient(135deg, #98a2b3, #7c8799) !important;
}
.bg-info{
    background:linear-gradient(135deg, #a1d0ea, #7bb1d2) !important;
}
.text-dark{
    color:#1b2737 !important;
}

.alert{
    border:none;
    border-radius:18px;
    box-shadow:var(--shadow-md);
}
.alert-info{
    color:#123154;
    background:rgba(161,208,234,0.32);
}
.alert-warning{
    color:#5f4207;
    background:rgba(216,154,31,0.18);
}
.alert-danger{
    color:#7a1f1f;
    background:rgba(212,94,94,0.16);
}
.alert-success{
    color:#175336;
    background:rgba(31,154,97,0.15);
}

.small-muted{
    color:var(--muted);
    font-size:0.92rem;
}

.stat-stack{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.soft-box{
    border:1px solid rgba(15,35,65,0.08);
    border-radius:20px;
    background:rgba(255,255,255,0.58);
    padding:20px;
}

.footer-note{
    color:var(--muted);
    font-size:0.9rem;
    text-align:center;
}

/* Login page */
.login-shell{
    min-height:100vh;
    display:grid;
    grid-template-columns:1.05fr 0.95fr;
    padding:18px;
    gap:0;
}
.login-brand-panel{
    position:relative;
    overflow:hidden;
    border-radius:30px 0 0 30px;
    padding:48px 54px;
    color:#fff;
    background:
        radial-gradient(circle at 20% 0%, rgba(255,255,255,0.09), transparent 22%),
        radial-gradient(circle at 90% 70%, rgba(181,132,58,0.15), transparent 20%),
        linear-gradient(135deg, #071326 0%, #102a4a 42%, #08111f 100%);
}
.login-brand-panel:before{
    content:"";
    position:absolute;
    right:-160px;
    bottom:-180px;
    width:620px;
    height:620px;
    border-radius:50%;
    border:1px solid rgba(213,176,120,0.24);
}
.login-brand-panel:after{
    content:"";
    position:absolute;
    left:-100px;
    bottom:-120px;
    width:280px;
    height:280px;
    background:radial-gradient(circle, rgba(213,176,120,0.22), transparent 70%);
    border-radius:50%;
}
.login-panel-inner{
    position:relative;
    z-index:2;
    max-width:640px;
}
.login-logo{
    display:flex;
    align-items:center;
    gap:16px;
    margin-bottom:36px;
}
.login-logo-text{
    display:flex;
    flex-direction:column;
}
.login-logo-title{
    font-size:1.1rem;
    letter-spacing:0.24em;
    font-weight:800;
}
.login-logo-sub{
    color:rgba(255,255,255,0.74);
    font-size:0.9rem;
}
.login-headline{
    margin-top:14px;
    font-family: Georgia, "Times New Roman", serif;
    font-size:clamp(2.5rem, 4.2vw, 4.4rem);
    line-height:1.02;
    margin-bottom:18px;
}
.login-headline .gold{
    color:var(--gold-2);
}
.login-divider{
    width:220px;
    height:1px;
    background:linear-gradient(90deg, rgba(213,176,120,0.0), rgba(213,176,120,0.85), rgba(213,176,120,0.0));
    margin:28px 0;
}
.login-tagline{
    font-size:2rem;
    font-weight:800;
    letter-spacing:0.16em;
    color:var(--gold-2);
    margin-bottom:8px;
}
.login-support{
    color:rgba(255,255,255,0.76);
    font-size:1.08rem;
}
.login-visual{
    position:absolute;
    bottom:24px;
    left:24px;
    right:24px;
    z-index:2;
    min-height:220px;
    border-radius:28px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.00)),
        radial-gradient(circle at center bottom, rgba(213,176,120,0.12), transparent 45%);
    border:1px solid rgba(255,255,255,0.06);
    overflow:hidden;
}
.login-scene{
    position:absolute;
    inset:0;
    opacity:0.9;
}
.login-form-panel{
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:0 30px 30px 0;
    padding:44px;
    background:rgba(255,252,247,0.78);
    backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,0.72);
}
.login-card{
    width:min(520px, 100%);
    background:rgba(255,255,255,0.88);
    border-radius:30px;
    padding:40px;
    box-shadow:0 20px 46px rgba(15,35,65,0.10);
    border:1px solid rgba(15,35,65,0.06);
}
.login-avatar{
    width:76px;
    height:76px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 18px;
    background:linear-gradient(180deg, rgba(181,132,58,0.12), rgba(181,132,58,0.04));
}
.login-title{
    font-family: Georgia, "Times New Roman", serif;
    font-weight:800;
    font-size:2.4rem;
    text-align:center;
    color:var(--navy);
    margin-bottom:10px;
}
.login-subtitle{
    text-align:center;
    color:var(--muted);
    margin-bottom:28px;
}
.login-field{
    margin-bottom:18px;
}
.login-label{
    display:block;
    color:var(--text);
    font-weight:800;
    margin-bottom:8px;
}
.input-with-icon{
    position:relative;
}
.input-with-icon .form-control{
    padding-left:48px;
    padding-right:46px;
    min-height:58px;
}
.input-icon{
    position:absolute;
    left:16px;
    top:50%;
    transform:translateY(-50%);
    color:#8a94a6;
}
.login-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin:8px 0 18px;
}
.login-footer-note{
    text-align:center;
    color:var(--muted);
    margin-top:24px;
}

@media (max-width: 1100px){
    .login-shell{
        grid-template-columns:1fr;
    }
    .login-brand-panel{
        min-height:420px;
        border-radius:30px 30px 0 0;
    }
    .login-form-panel{
        border-radius:0 0 30px 30px;
    }
    .login-visual{
        min-height:160px;
    }
}
@media (max-width: 767px){
    .login-brand-panel{padding:30px 26px}
    .login-form-panel{padding:24px}
    .login-card{padding:28px 20px}
    .hero-premium{padding:26px}
    .page-head{flex-direction:column}
}