/* =============================================
   NuggetsAbode - Complete Stylesheet
   Dark Black + Gold Theme
   Cloned from nuggetsabode.com
   ============================================= */

:root {
    --gold: #D4AF37;
    --dark-gold: #B8860B;
    --black: #121212;
    --dark-gray: #1E1E1E;
    --medium-gray: #2A2A2A;
    --light-gray: #F5F5F5;
    --white: #FFFFFF;
    --text-primary: #FFFFFF;
    --text-secondary: rgba(255,255,255,0.8);
    --text-muted: rgba(255,255,255,0.5);
    --border-color: rgba(255,255,255,0.1);
    --bg-body: #121212;
    --bg-card: #1E1E1E;
    --shadow-md: 0 4px 20px rgba(0,0,0,0.3);
    --shadow-lg: 0 10px 40px rgba(0,0,0,0.4);
    --shadow-xl: 0 20px 60px rgba(0,0,0,0.5);
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --font-primary: 'Montserrat', sans-serif;
    --font-heading: 'Playfair Display', serif;
    --transition: all 0.3s ease;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }
body {
    font-family: var(--font-primary);
    color: var(--text-primary);
    background-color: var(--black);
    line-height: 1.6;
    overflow-x: hidden;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 600;
    color: var(--gold);
}
a { text-decoration: none; color: var(--gold); transition: var(--transition); }
a:hover { color: var(--white); }
img { max-width: 100%; height: auto; }

/* Loading Spinner */
.loading-spinner {
    position: fixed; top:0; left:0; width:100%; height:100%;
    background: var(--black); display: flex; align-items: center;
    justify-content: center; z-index: 9999;
    transition: opacity 0.5s ease, visibility 0.5s ease;
}
.loading-spinner.hidden { opacity:0; visibility: hidden; }
.spinner { width:50px; height:50px; border:3px solid var(--dark-gray); border-top-color:var(--gold); border-radius:50%; animation:spin 0.8s linear infinite; margin:0 auto; }
@keyframes spin { to { transform: rotate(360deg); } }
.spinner-wrapper { text-align:center; }
.spinner-wrapper p { color:var(--gold); font-weight:600; margin-top:12px; }

/* Container */
.container { width:100%; max-width:1200px; margin:0 auto; padding:0 20px; }

/* Buttons */
.btn {
    display:inline-block; padding:12px 30px; background:var(--gold); color:var(--black);
    border:none; border-radius:var(--radius-sm); font-weight:600; text-transform:uppercase;
    letter-spacing:1px; transition:var(--transition); cursor:pointer; font-family:var(--font-primary);
    font-size:0.9rem; box-shadow:0 4px 15px rgba(212,175,55,0.35);
}
.btn:hover, .btn:focus, .btn:active {
    background:var(--dark-gold); color:var(--white); transform:translateY(-2px);
    box-shadow:0 8px 25px rgba(212,175,55,0.45);
}
.btn:disabled, .btn.disabled { opacity:0.6; transform:none; box-shadow:none; cursor:not-allowed; }

/* Every button variant shares the gold gradient + glow animation */
.btn-outline, .btn-outline-primary, .btn-outline-light, .btn-outline-secondary,
.btn-outline-danger, .btn-outline-success, .btn-outline-warning,
.btn-primary, .btn-primary-gradient, .btn-secondary, .btn-danger, .btn-success,
.btn-warning, .btn-light, .btn-link {
    background:var(--gold); color:var(--black); border:none;
    box-shadow:0 4px 15px rgba(212,175,55,0.35);
}
.btn-outline:hover, .btn-outline-primary:hover, .btn-outline-light:hover,
.btn-outline-secondary:hover, .btn-outline-danger:hover, .btn-outline-success:hover,
.btn-outline-warning:hover, .btn-primary:hover, .btn-primary-gradient:hover,
.btn-secondary:hover, .btn-danger:hover, .btn-success:hover, .btn-warning:hover,
.btn-light:hover, .btn-link:hover {
    background:var(--dark-gold); color:var(--white); transform:translateY(-2px);
    box-shadow:0 8px 25px rgba(212,175,55,0.45);
}
.btn-sm { padding:8px 20px; font-size:0.8rem; }
.btn-lg { padding:16px 36px; font-size:1rem; }

/* Section */
.section { padding:80px 0; }
.section-padding { padding:80px 0; }
.blog-page-padding { padding:60px 0 80px; }
.section-title {
    font-size:2.5rem; text-align:center; position:relative; margin-bottom:40px; color:var(--gold);
}
.section-title::after {
    content:''; display:block; width:80px; height:3px; background:var(--gold); margin:15px auto;
}
.section-subtitle { color:var(--text-secondary); text-align:center; max-width:700px; margin:0 auto 40px; }
.section-badge {
    display:inline-block; padding:6px 16px; background:rgba(212,175,55,0.15); color:var(--gold);
    border-radius:50px; font-size:0.85rem; font-weight:600; margin-bottom:12px; letter-spacing:0.5px;
}
.text-center { text-align:center; }
.bg-light-alt { background:var(--dark-gray); }
.text-gradient {
    background:linear-gradient(135deg, var(--gold), var(--dark-gold));
    -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}

/* =============================================
   Navigation
   ============================================= */
#mainNav {
    padding:12px 0;
    background:rgba(255,255,255,0.95);
    backdrop-filter:blur(10px);
    z-index:1050;
    transition:all 0.3s ease;
    border-bottom:1px solid transparent;
}
#mainNav.scrolled {
    padding:8px 0;
    background:#FFFFFF;
    border-bottom-color:rgba(0,0,0,0.1);
    box-shadow:0 5px 20px rgba(0,0,0,0.15);
}
.navbar-brand {
    display:flex;
    align-items:center;
    gap:8px;
    text-decoration:none;
}

/* Navbar logo hover effect: subtle lift, scale, rotation, and shadow for interactivity */
.navbar-logo img {
    height:40px; /* keeps logo consistent */
    width:auto;
    display:block;
    transition: transform 0.35s ease, filter 0.35s ease;
}
.navbar-logo:hover img {
    transform: translateY(-4px) scale(1.08) rotate(-3deg);
    filter: drop-shadow(0 12px 24px rgba(0,0,0,0.45));
}

@media (max-width: 991.98px) {
    .navbar-logo img { height:34px; }
}
.brand-icon {
    width:40px; height:40px; background:var(--gold); border-radius:var(--radius-sm);
    display:flex; align-items:center; justify-content:center; color:var(--black); font-size:1.1rem;
    transition:var(--transition);
}
.navbar-brand:hover .brand-icon { transform:rotate(10deg) scale(1.05); }
.brand-text { font-family:var(--font-heading); font-size:1.3rem; color:var(--gold); }
.brand-text b { color:var(--black); }
.navbar-toggler {
    border:1px solid rgba(0,0,0,0.2);
    padding:6px 10px;
    outline:none;
    box-shadow:none;
}
.navbar-toggler:focus { box-shadow:none; border-color:var(--gold); }
.navbar-nav .nav-link {
    color:rgba(18,18,18,0.8) !important;
    font-weight:500;
    padding:8px 18px !important;
    border-radius:var(--radius-sm);
    transition:all 0.3s ease;
    font-size:0.9rem;
    text-transform:uppercase;
    letter-spacing:1px;
    font-family:var(--font-primary);
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
    color:var(--gold) !important;
}
.nav-icon-btn {
    width:40px; height:40px; border-radius:50%; border:1px solid rgba(0,0,0,0.2);
    background:transparent; color:rgba(18,18,18,0.7); display:flex; align-items:center;
    justify-content:center; cursor:pointer; transition:all 0.3s ease; font-size:0.95rem;
    text-decoration:none;
}
.nav-icon-btn:hover { background:var(--gold); color:var(--black); border-color:var(--gold); transform:translateY(-2px); }
.cart-badge {
    position:absolute; top:-4px; right:-4px; width:18px; height:18px;
    background:var(--gold); color:var(--black); border-radius:50%;
    font-size:0.65rem; font-weight:700; display:flex; align-items:center; justify-content:center;
}
.btn-login-sm {
    padding:6px 18px; border-radius:50px; font-size:0.85rem; font-weight:600;
    border:1px solid var(--gold); color:var(--gold); background:transparent;
    transition:all 0.3s ease; text-decoration:none;
}
.btn-login-sm:hover { background:var(--gold); color:var(--black); }
.btn-signup-sm {
    padding:6px 18px; border-radius:50px; font-size:0.85rem; font-weight:600;
    border:none; background:var(--gold); color:var(--black);
    transition:all 0.3s ease; text-decoration:none;
}
.btn-signup-sm:hover { background:var(--dark-gold); color:var(--white); transform:translateY(-2px); }
.btn-user {
    background:transparent; border:1px solid var(--gold); border-radius:50px;
    padding:6px 14px; color:var(--gold); font-size:0.85rem; cursor:pointer;
}
.btn-user:hover { background:var(--gold); color:var(--black); }
.user-avatar-sm { width:28px; height:28px; border-radius:50%; object-fit:cover; border:2px solid var(--gold); }
.user-avatar-placeholder-sm {
    width:28px; height:28px; border-radius:50%; background:var(--gold); color:var(--black);
    display:flex; align-items:center; justify-content:center; font-size:0.75rem; font-weight:700;
}

/* Dropdown */
.dropdown-menu {
    background:var(--dark-gray); border:1px solid var(--border-color); border-radius:var(--radius-md);
    box-shadow:var(--shadow-lg); padding:8px; margin-top:8px;
}
.dropdown-item {
    border-radius:var(--radius-sm); padding:8px 12px; font-size:0.9rem;
    transition:all 0.3s ease; color:var(--text-secondary);
}
.dropdown-item:hover { background:rgba(212,175,55,0.15); color:var(--gold); }

/* Search Tags */
.search-tag {
    display:inline-block; padding:4px 12px; border-radius:50px; font-size:0.8rem;
    background:rgba(212,175,55,0.15); color:var(--gold); text-decoration:none;
    transition:all 0.3s ease;
}
.search-tag:hover { background:var(--gold); color:var(--black); }
.search-modal { background:var(--dark-gray); border:1px solid var(--border-color); border-radius:var(--radius-lg); }

/* Mobile */
@media (max-width: 991.98px) {
    .navbar-collapse {
        background:#FFFFFF;
        border:1px solid rgba(0,0,0,0.1);
        border-radius:var(--radius-md);
        margin-top:12px;
        padding:16px;
    }
    .navbar-nav .nav-link {
        padding:10px 16px !important;
        border-bottom:1px solid rgba(0,0,0,0.1);
    }
    .navbar-nav .nav-item:last-child .nav-link { border-bottom:none; }
    .d-flex.align-items-center.gap-2 {
        border-top:1px solid rgba(0,0,0,0.1);
        padding-top:12px;
        margin-top:8px;
    }
}

/* =============================================
   Hero Section
   ============================================= */
.hero-section {
    min-height:100vh; display:flex; align-items:center; text-align:center;
    position:relative; overflow:hidden; padding-top:80px;
    /* Use the locally downloaded hero background image with a dark overlay for readability. */
    background: linear-gradient(rgba(0,0,0,0.65), rgba(0,0,0,0.65)), url('../images/hero-bg.png') no-repeat center center/cover;
}
.hero-particles {
    position:absolute; top:0; left:0; width:100%; height:100%;
    background-image:radial-gradient(rgba(212,175,55,0.05) 1px, transparent 1px);
    background-size:30px 30px;
}
.hero-content { max-width:800px; margin:0 auto; padding:0 20px; position:relative; z-index:2; }
.hero-title { font-size:3.5rem; color:var(--white); line-height:1.2; margin-bottom:20px; }
.hero-title .text-gradient { color:var(--gold); }
.hero-badge {
    display:inline-block; padding:8px 20px; background:rgba(212,175,55,0.15);
    border:1px solid rgba(212,175,55,0.3); border-radius:50px; color:var(--gold);
    font-size:0.85rem; font-weight:500; margin-bottom:24px;
}
.hero-subtitle { font-size:1.15rem; color:rgba(255,255,255,0.8); margin-bottom:30px; line-height:1.8; }
.hero-cta { margin-bottom:48px; }
.hero-cta .btn { margin:0 10px 10px 0; }
.hero-stats { display:flex; gap:40px; justify-content:center; }
.hero-stat { text-align:center; }
.hero-stat-number { display:block; font-size:2rem; font-weight:800; color:var(--gold); font-family:var(--font-primary); }
.hero-stat-label { font-size:0.85rem; color:rgba(255,255,255,0.6); text-transform:uppercase; letter-spacing:1px; }

@media (max-width:767.98px) {
    .hero-title { font-size:2.2rem; }
    .hero-cta .btn { display:block; width:100%; margin:0 0 10px; }
    .hero-stats { flex-wrap:wrap; gap:20px; }
}

/* =============================================
   Feature / Service Cards
   ============================================= */
.feature-card, .service-card {
    background:var(--dark-gray); border:1px solid var(--border-color); border-radius:var(--radius-lg);
    padding:36px 30px; text-align:center; transition:var(--transition); height:100%;
    border-bottom:3px solid transparent;
}
.feature-card:hover, .service-card:hover {
    transform:translateY(-10px); border-bottom-color:var(--gold);
    box-shadow:var(--shadow-lg);
}
.feature-icon, .service-icon {
    width:70px; height:70px; background:rgba(212,175,55,0.1); border-radius:var(--radius-md);
    display:flex; align-items:center; justify-content:center; font-size:1.5rem;
    color:var(--gold); margin:0 auto 20px; transition:var(--transition);
}
.feature-card:hover .feature-icon, .service-card:hover .service-icon {
    background:var(--gold); color:var(--black); transform:rotateY(180deg);
}
.feature-card h4, .service-card h3 { font-size:1.15rem; margin-bottom:12px; }
.feature-card p, .service-card p { color:rgba(255,255,255,0.7); font-size:0.95rem; margin:0; }
.services-grid {
    display:grid; grid-template-columns:repeat(auto-fit, minmax(250px,1fr)); gap:30px; margin-top:50px;
}

/* =============================================
   How It Works / Steps
   ============================================= */
.step-card {
    background:var(--dark-gray); border:1px solid var(--border-color); border-radius:var(--radius-lg);
    padding:40px 30px; text-align:center; transition:var(--transition); height:100%;
}
.step-card:hover { transform:translateY(-6px); border-color:var(--gold); box-shadow:var(--shadow-md); }
.step-number {
    width:64px; height:64px; margin:0 auto 20px; border-radius:50%;
    background:linear-gradient(135deg, var(--gold), var(--dark-gold));
    color:var(--black); font-family:var(--font-primary); font-weight:800; font-size:1.4rem;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 8px 30px rgba(212,175,55,0.25);
}
.step-card h4 { font-size:1.15rem; margin-bottom:12px; }
.step-card p { color:rgba(255,255,255,0.7); font-size:0.95rem; margin:0; }

/* =============================================
   Book / Product Cards
   ============================================= */
.book-card {
    background:var(--dark-gray); border:1px solid var(--border-color); border-radius:var(--radius-lg);
    overflow:hidden; transition:var(--transition); height:100%;
}
.book-card:hover { transform:translateY(-8px); box-shadow:var(--shadow-lg); }
.book-cover {
    position:relative; height:280px; overflow:hidden;
    background:linear-gradient(135deg, var(--dark-gold), var(--gold));
}
.book-cover img { width:100%; height:100%; object-fit:cover; transition:var(--transition); }
.book-card:hover .book-cover img { transform:scale(1.05); }
.dashboard-layout .book-cover { height:auto; aspect-ratio:3 / 4; }
.book-cover-placeholder {
    width:100%; height:100%; display:flex; flex-direction:column; align-items:center;
    justify-content:center; color:var(--black); padding:20px; text-align:center; font-weight:600; font-size:0.9rem;
}
.book-badge {
    position:absolute; top:12px; padding:4px 12px; border-radius:50px;
    font-size:0.75rem; font-weight:600; z-index:2;
}
.book-badge.sale { left:12px; background:#EF4444; color:white; }
.book-badge.bestseller { right:12px; background:var(--gold); color:var(--black); }
.book-overlay {
    position:absolute; top:0; left:0; width:100%; height:100%;
    background:rgba(0,0,0,0.5); display:flex; align-items:center;
    justify-content:center; opacity:0; transition:var(--transition);
}
.book-card:hover .book-overlay { opacity:1; }
.book-info { padding:20px; }
.book-category { font-size:0.8rem; color:var(--gold); font-weight:600; text-transform:uppercase; letter-spacing:0.5px; }
.book-title { font-size:1.05rem; margin:8px 0; font-family:var(--font-heading); }
.book-title a { color:var(--white); }
.book-title a:hover { color:var(--gold); }
.book-rating { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.stars .fa-star { font-size:0.8rem; color:rgba(255,255,255,0.2); }
.stars .fa-star.active { color:var(--gold); }
.rating-count { font-size:0.8rem; color:var(--text-muted); }
.book-price { display:flex; align-items:center; gap:10px; }
.price-current { font-size:1.2rem; font-weight:700; color:var(--gold); }
.price-old { font-size:0.9rem; color:var(--text-muted); text-decoration:line-through; }

/* =============================================
   Category Cards
   ============================================= */
.category-card {
    display:flex; flex-direction:column; align-items:center; text-align:center;
    padding:30px 20px; background:var(--dark-gray); border:1px solid var(--border-color);
    border-radius:var(--radius-lg); transition:var(--transition); height:100%;
}
.category-card:hover {
    transform:translateY(-8px); box-shadow:var(--shadow-lg); border-color:var(--gold);
    background:var(--gold);
}
.category-icon {
    width:60px; height:60px; background:rgba(212,175,55,0.15); border-radius:50%;
    display:flex; align-items:center; justify-content:center; font-size:1.3rem;
    color:var(--gold); margin-bottom:16px; transition:var(--transition);
}
.category-card:hover .category-icon { background:rgba(0,0,0,0.2); color:var(--black); }
.category-card h5 { font-size:1rem; margin-bottom:4px; color:var(--white); font-family:var(--font-heading); }
.category-card:hover h5, .category-card:hover .category-count { color:var(--black); }
.category-count { font-size:0.8rem; color:var(--text-muted); }

/* =============================================
   Blog Hero Header
   ============================================= */
.blog-hero {
    position: relative;
    padding: 130px 0 70px;
    background: linear-gradient(160deg, #0a0a0a 0%, var(--black) 40%, #1a1a0a 100%);
    text-align: center;
    overflow: hidden;
    border-bottom: 1px solid rgba(212,175,55,0.08);
}
.blog-hero::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle at 50% 60%, rgba(212,175,55,0.03) 0%, transparent 50%);
    pointer-events: none;
}
.blog-hero-pattern {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background-image: radial-gradient(rgba(212,175,55,0.04) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
}
.blog-hero-content {
    position: relative;
    z-index: 2;
    max-width: 720px;
    margin: 0 auto;
}
.blog-hero-badge {
    display: inline-block;
    padding: 6px 20px;
    border: 1px solid rgba(212,175,55,0.25);
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 20px;
    background: rgba(212,175,55,0.06);
}
.blog-hero-content h1 {
    font-size: 3rem;
    color: var(--white);
    font-weight: 700;
    margin-bottom: 14px;
    line-height: 1.2;
}
.blog-hero-sub {
    font-size: 1.1rem;
    color: rgba(255,255,255,0.55);
    margin-bottom: 24px;
    font-weight: 400;
}
.blog-hero-content .breadcrumb {
    justify-content: center;
    background: transparent;
    margin: 0;
}
.blog-hero-content .breadcrumb-item,
.blog-hero-content .breadcrumb-item a {
    color: rgba(255,255,255,0.45);
    font-size: 0.82rem;
}
.blog-hero-content .breadcrumb-item.active {
    color: var(--gold);
}
.blog-hero-content .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(255,255,255,0.2);
}

@media (max-width: 767.98px) {
    .blog-hero { padding: 100px 0 50px; }
    .blog-hero-content h1 { font-size: 2rem; }
    .blog-hero-sub { font-size: 0.95rem; }
}

/* =============================================
   Blog Main Layout
   ============================================= */
.blog-main {
    padding: 60px 0 80px;
    background: var(--black);
}

/* =============================================
   Blog Article Cards
   ============================================= */
.blog-article {
    margin-bottom: 32px;
    position: relative;
}
.blog-article-inner {
    display: flex;
    background: var(--dark-gray);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
}
.blog-article-inner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 0;
    background: linear-gradient(180deg, var(--gold), transparent);
    transition: height 0.4s ease;
    z-index: 2;
}
.blog-article-inner:hover::before {
    height: 100%;
}
.blog-article-inner:hover {
    border-color: rgba(212,175,55,0.2);
    box-shadow: 0 12px 40px rgba(0,0,0,0.35), 0 0 0 1px rgba(212,175,55,0.08);
    transform: translateY(-4px);
}

.blog-article-thumb {
    position: relative;
    width: 300px;
    min-height: 260px;
    overflow: hidden;
    flex-shrink: 0;
}
.blog-article-img-link {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    text-decoration: none;
}
.blog-img-wrap {
    width: 100%;
    height: 100%;
    min-height: 260px;
    overflow: hidden;
    position: relative;
}
.blog-img-placeholder {
    width: 100%;
    height: 100%;
    min-height: 260px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #1a1a0a 0%, #2a2a0a 40%, #0a0a0a 100%);
    color: rgba(212,175,55,0.5);
    font-size: 3.5rem;
    position: relative;
    transition: all 0.6s ease;
    overflow: hidden;
}
.blog-img-pattern {
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background:
        radial-gradient(circle at 30% 40%, rgba(212,175,55,0.08) 0%, transparent 40%),
        radial-gradient(circle at 70% 60%, rgba(212,175,55,0.05) 0%, transparent 35%);
    transition: all 0.8s ease;
}
.blog-article-inner:hover .blog-img-pattern {
    transform: scale(1.1) rotate(5deg);
    opacity: 0.7;
}
.blog-img-placeholder i {
    position: relative;
    z-index: 1;
    transition: all 0.5s ease;
    filter: drop-shadow(0 2px 8px rgba(212,175,55,0.2));
}
.blog-article-inner:hover .blog-img-placeholder i {
    transform: scale(1.15) rotate(-5deg);
    color: rgba(212,175,55,0.8);
}
.blog-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.7s ease;
}
.blog-article-inner:hover .blog-img-wrap img {
    transform: scale(1.08);
}

.blog-article-category {
    position: absolute;
    bottom: 14px;
    left: 14px;
    right: 14px;
    padding: 6px 14px;
    background: rgba(0,0,0,0.8);
    color: var(--gold);
    border-radius: 50px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(212,175,55,0.2);
    transition: all 0.3s ease;
    z-index: 3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 28px);
    pointer-events: none;
}

.blog-article-body {
    flex: 1;
    padding: 32px 34px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}
.blog-article-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}
.blog-article-meta span {
    font-size: 0.76rem;
    color: rgba(255,255,255,0.4);
    display: inline-flex;
    align-items: center;
    gap: 5px;
    letter-spacing: 0.2px;
}
.blog-article-meta span i {
    font-size: 0.7rem;
    color: var(--gold);
    opacity: 0.6;
}
.meta-divider {
    width: 3px;
    height: 3px;
    background: rgba(255,255,255,0.2);
    border-radius: 50%;
    display: inline-block;
}
.blog-article-title {
    font-size: 1.45rem;
    margin-bottom: 12px;
    line-height: 1.3;
    font-family: var(--font-heading);
    font-weight: 700;
}
.blog-article-title a {
    color: var(--white);
    text-decoration: none;
    background: linear-gradient(to right, var(--gold), var(--gold));
    background-size: 0 2px;
    background-position: 0 100%;
    background-repeat: no-repeat;
    transition: background-size 0.4s ease, color 0.3s ease;
    padding-bottom: 2px;
}
.blog-article-title a:hover {
    color: var(--gold);
    background-size: 100% 2px;
}
.blog-article-excerpt {
    font-size: 0.92rem;
    color: rgba(255,255,255,0.55);
    line-height: 1.75;
    margin-bottom: 22px;
    flex: 1;
}
.blog-article-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,0.06);
}
.blog-article-author {
    display: flex;
    align-items: center;
    gap: 10px;
}
.blog-author-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    border: 2px solid rgba(212,175,55,0.15);
    transition: border-color 0.3s ease;
}
.blog-article-inner:hover .blog-author-avatar {
    border-color: rgba(212,175,55,0.4);
}
.blog-author-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.blog-author-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gold);
    color: var(--black);
    font-size: 0.85rem;
    font-weight: 700;
}
.blog-author-name {
    font-size: 0.85rem;
    font-weight: 500;
    color: rgba(255,255,255,0.5);
    transition: color 0.3s ease;
}
.blog-article-inner:hover .blog-author-name {
    color: rgba(255,255,255,0.75);
}
.blog-article-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--gold);
    text-decoration: none;
    padding: 8px 20px;
    border: 1px solid rgba(212,175,55,0.2);
    border-radius: 50px;
    transition: all 0.35s ease;
    background: transparent;
    position: relative;
    overflow: hidden;
}
.blog-article-cta::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(212,175,55,0.1), transparent);
    transition: left 0.5s ease;
}
.blog-article-cta:hover::before {
    left: 100%;
}
.blog-article-cta:hover {
    background: var(--gold);
    color: var(--black);
    border-color: var(--gold);
    transform: translateX(2px);
    box-shadow: 0 4px 15px rgba(212,175,55,0.25);
}
.blog-article-cta span {
    position: relative;
    z-index: 1;
}
.blog-article-cta i {
    font-size: 0.7rem;
    transition: transform 0.35s ease;
    position: relative;
    z-index: 1;
}
.blog-article-cta:hover i {
    transform: translateX(5px);
}

@media (max-width: 991.98px) {
    .blog-article-thumb {
        width: 260px;
        min-height: 240px;
    }
    .blog-img-wrap { min-height: 240px; }
    .blog-img-placeholder { min-height: 240px; }
    .blog-article-body {
        padding: 24px 26px;
    }
    .blog-article-title {
        font-size: 1.25rem;
    }
}
@media (max-width: 767.98px) {
    .blog-article-inner {
        flex-direction: column;
    }
    .blog-article-thumb {
        width: 100%;
        min-height: 200px;
    }
    .blog-img-wrap { min-height: 200px; }
    .blog-img-placeholder { min-height: 200px; }
    .blog-article-body {
        padding: 22px;
    }
    .blog-article-title {
        font-size: 1.2rem;
    }
    .blog-article-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
    }
    .blog-article-cta {
        width: 100%;
        justify-content: center;
    }
}

/* =============================================
   Blog Pagination
   ============================================= */
.blog-pagination {
    margin-top: 48px;
}
.blog-pagination .pagination {
    justify-content: center;
    gap: 4px;
}
.blog-pagination .page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-sm) !important;
    border: 1px solid var(--border-color);
    background: var(--dark-gray);
    color: rgba(255,255,255,0.6);
    font-size: 0.88rem;
    font-weight: 500;
    transition: all 0.3s ease;
    margin: 0;
    padding: 0;
}
.blog-pagination .page-link:hover {
    background: var(--gold);
    border-color: var(--gold);
    color: var(--black);
}
.blog-pagination .page-item.active .page-link {
    background: var(--gold);
    border-color: var(--gold);
    color: var(--black);
}
.blog-pagination .page-item.disabled .page-link {
    opacity: 0.4;
    pointer-events: none;
}

/* =============================================
   Blog Empty State
   ============================================= */
.blog-empty {
    text-align: center;
    padding: 60px 20px;
}
.blog-empty-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 24px;
    background: rgba(212,175,55,0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: var(--gold);
}
.blog-empty h3 {
    font-size: 1.5rem;
    margin-bottom: 10px;
    color: var(--white);
    font-family: var(--font-heading);
}
.blog-empty p {
    color: rgba(255,255,255,0.55);
    margin-bottom: 24px;
    font-size: 0.95rem;
}
.blog-empty-btn {
    background: var(--gold);
    color: var(--black);
    border-radius: 50px;
    padding: 10px 28px;
    font-weight: 600;
    font-size: 0.85rem;
    transition: all 0.3s ease;
    border: none;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
}
.blog-empty-btn:hover {
    background: var(--dark-gold);
    color: var(--white);
    transform: translateY(-2px);
}

/* =============================================
   Blog Sidebar
   ============================================= */
.blog-sidebar {
    position: sticky;
    top: 100px;
}
.sidebar-widget {
    background: var(--dark-gray);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 24px;
    margin-bottom: 24px;
    transition: border-color 0.3s ease;
}
.sidebar-widget:hover {
    border-color: rgba(212,175,55,0.12);
}
.sidebar-widget-title {
    font-size: 0.82rem;
    font-family: var(--font-primary);
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 18px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Sidebar Search */
.sidebar-search {
    display: flex;
    align-items: center;
    position: relative;
}
.sidebar-search-input {
    width: 100%;
    padding: 12px 52px 12px 18px;
    background: #ffffff;
    border: 2px solid #d0d0d0;
    border-radius: 50px;
    color: #000000;
    font-size: 0.88rem;
    font-family: var(--font-primary);
    transition: all 0.3s ease;
    outline: none;
    line-height: 1.4;
}
.sidebar-search-input:focus {
    border-color: var(--gold);
    background: #ffffff;
    box-shadow: 0 0 0 4px rgba(212,175,55,0.1);
}
.sidebar-search-input::placeholder {
    color: #999999;
    font-size: 0.85rem;
}
.sidebar-search-btn {
    position: absolute;
    right: 5px;
    top: 5px;
    bottom: 5px;
    width: 38px;
    border: none;
    border-radius: 50%;
    background: var(--gold);
    color: var(--black);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 0.85rem;
    flex-shrink: 0;
}
.sidebar-search-btn:hover {
    background: var(--dark-gold);
    color: var(--white);
    transform: scale(1.05);
}
.sidebar-search-btn:active {
    transform: scale(0.95);
}

/* Sidebar Categories */
.sidebar-categories {
    list-style: none;
    padding: 0;
    margin: 0;
}
.sidebar-categories li {
    border-bottom: 1px solid rgba(255,255,255,0.05);
    transition: all 0.3s ease;
}
.sidebar-categories li:last-child {
    border-bottom: none;
}
.sidebar-categories li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 0;
    color: rgba(255,255,255,0.7);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.3s ease;
}
.sidebar-categories li a:hover {
    color: var(--gold);
    padding-left: 6px;
}
.sidebar-cat-name {
    transition: color 0.3s ease;
}
.sidebar-cat-count {
    background: rgba(212,175,55,0.1);
    color: var(--gold);
    padding: 2px 10px;
    border-radius: 50px;
    font-size: 0.72rem;
    font-weight: 600;
    min-width: 26px;
    text-align: center;
    transition: all 0.3s ease;
}
.sidebar-categories li a:hover .sidebar-cat-count {
    background: var(--gold);
    color: var(--black);
}

/* Sidebar Recent Posts */
.sidebar-recent {
    list-style: none;
    padding: 0;
    margin: 0;
}
.sidebar-recent li {
    border-bottom: 1px solid rgba(255,255,255,0.05);
    transition: all 0.3s ease;
}
.sidebar-recent li:last-child {
    border-bottom: none;
}
.sidebar-recent li a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 0;
    text-decoration: none;
    transition: all 0.3s ease;
}
.sidebar-recent li a:hover {
    padding-left: 4px;
}
.sidebar-recent-thumb {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-sm);
    background: rgba(212,175,55,0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gold);
    font-size: 0.95rem;
    flex-shrink: 0;
    transition: all 0.3s ease;
}
.sidebar-recent li a:hover .sidebar-recent-thumb {
    background: var(--gold);
    color: var(--black);
}
.sidebar-recent-info {
    flex: 1;
    min-width: 0;
}
.sidebar-recent-title {
    display: block;
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--white);
    line-height: 1.35;
    margin-bottom: 3px;
    transition: color 0.3s ease;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.sidebar-recent li a:hover .sidebar-recent-title {
    color: var(--gold);
}
.sidebar-recent-date {
    display: block;
    font-size: 0.72rem;
    color: rgba(255,255,255,0.4);
    letter-spacing: 0.2px;
}

/* Sidebar Newsletter */
.sidebar-newsletter {
    border: 1px solid rgba(212,175,55,0.12);
    background: linear-gradient(180deg, var(--dark-gray), rgba(30,30,30,0.5));
    padding: 0;
    overflow: hidden;
}
.sidebar-newsletter-inner {
    padding: 32px 24px;
    text-align: center;
    position: relative;
}
.sidebar-newsletter-inner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 10%;
    right: 10%;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
    border-radius: 2px;
}
.sidebar-newsletter-icon {
    width: 56px;
    height: 56px;
    margin: 0 auto 16px;
    background: rgba(212,175,55,0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    color: var(--gold);
}
.sidebar-newsletter-title {
    font-size: 1.1rem;
    font-family: var(--font-heading);
    color: var(--white);
    margin-bottom: 10px;
}
.sidebar-newsletter-text {
    font-size: 0.85rem;
    color: rgba(255,255,255,0.55);
    margin-bottom: 20px;
    line-height: 1.6;
    max-width: 240px;
    margin-left: auto;
    margin-right: auto;
}
.sidebar-newsletter-btn {
    background: var(--gold);
    color: var(--black);
    border: none;
    border-radius: 50px;
    padding: 10px 28px;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.3px;
    transition: all 0.3s ease;
    width: 100%;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
}
.sidebar-newsletter-btn:hover {
    background: var(--dark-gold);
    color: var(--white);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(212,175,55,0.25);
}

/* =============================================
   Blog Responsive
   ============================================= */
@media (max-width: 991.98px) {
    .blog-sidebar {
        position: static;
        margin-top: 40px;
    }
}

/* =============================================
   Testimonial / Disclaimer Cards
   ============================================= */
.testimonial-card, .disclaimer {
    background:var(--dark-gray); border-radius:var(--radius-lg); padding:40px;
    position:relative; margin:0 15px;
}
.testimonial-card::before, .disclaimer::before {
    content:'\201C'; position:absolute; top:20px; left:20px; font-size:4rem;
    color:var(--gold); opacity:0.2; font-family:var(--font-heading);
}
.testimonial-content, .disclaimer-content {
    position:relative; z-index:1; margin-bottom:20px; font-style:italic;
    color:rgba(255,255,255,0.9); line-height:1.8;
}
.testimonial-author, .disclaimer-author { display:flex; align-items:center; }
.author-image { width:60px; height:60px; border-radius:50%; overflow:hidden; margin-right:15px; border:2px solid var(--gold); }
.author-image img { width:100%; height:100%; object-fit:cover; }
.author-info h4 { margin-bottom:5px; font-size:1.1rem; color:var(--gold); }
.author-info p { color:var(--gold); font-size:0.9rem; }
.testimonials-slider, .disclaimers-slider { max-width:800px; margin:50px auto 0; }

/* =============================================
   Why Us / Value Props
   ============================================= */
.why-us {
    background:linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.8)),
        url('../images/hero-bg.png') no-repeat center center/cover;
    background-attachment:fixed;
}
.why-us-content { max-width:800px; margin:0 auto; text-align:center; }
.value-props { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); gap:30px; margin-top:50px; }
.value-prop {
    background:rgba(212,175,55,0.1); padding:30px 20px; border-radius:var(--radius-lg);
    border-left:3px solid var(--gold);
}
.value-number { font-size:2rem; color:var(--gold); margin-bottom:10px; font-family:var(--font-primary); font-weight:700; }
.value-title { font-size:1.2rem; margin-bottom:10px; color:var(--gold); }
.value-description { color:rgba(255,255,255,0.7); font-size:0.9rem; }

/* =============================================
    About Page Visual
    ============================================= */
.about-visual {
    position:relative; min-height:400px; display:flex; align-items:center; justify-content:center;
}
.about-card {
    position:absolute; background:var(--dark-gray); border:1px solid var(--border-color);
    border-radius:var(--radius-lg); padding:20px 24px; display:flex; align-items:center;
    gap:12px; box-shadow:var(--shadow-md); transition:var(--transition); z-index:2;
}
.about-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:var(--gold); }
.about-card i { font-size:1.5rem; color:var(--gold); }
.about-card h5 { margin:0; font-size:1rem; font-family:var(--font-heading); color:var(--white); }
.about-card-1 { top:10%; left:0; }
.about-card-2 { bottom:10%; right:0; }
.about-main-visual {
    width:min(320px, 100%); min-height:320px; border-radius:24px; background:linear-gradient(135deg, rgba(212,175,55,0.18), rgba(17,17,17,0.95));
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    color:var(--white); text-align:center; box-shadow:0 0 60px rgba(212,175,55,0.16);
    position:relative; z-index:1; padding:24px; overflow:hidden; border:1px solid rgba(212,175,55,0.25);
}
.about-main-visual img {
    width:100%; max-width:240px; height:auto; object-fit:contain; border-radius:16px; display:block;
    box-shadow:0 20px 45px rgba(0,0,0,0.25);
}
.about-main-caption { margin-top:18px; }
.about-main-visual h3 { margin:0 0 4px; font-size:1.3rem; color:var(--gold); }
.about-main-visual p { font-size:0.9rem; color:rgba(255,255,255,0.8); margin:0; }
.about-highlights { display:flex; flex-direction:column; gap:12px; margin-top:20px; }
.about-highlight-item { display:flex; align-items:center; gap:12px; color:rgba(255,255,255,0.85); }
.about-highlight-item i { color:var(--gold); font-size:1rem; }
.about-stats-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:20px; margin-top:30px; }
.about-stat-card { background:linear-gradient(135deg, rgba(212,175,55,0.12), rgba(255,255,255,0.03)); border:1px solid rgba(212,175,55,0.2); border-radius:20px; padding:24px; text-align:center; transition:var(--transition); }
.about-stat-card:hover { transform:translateY(-6px); border-color:rgba(212,175,55,0.55); box-shadow:var(--shadow-md); }
.about-stat-card h3 { font-size:2.2rem; color:var(--gold); margin-bottom:8px; }
.about-stat-card p { margin:0; color:rgba(255,255,255,0.8); }
.stat-counter { display:inline-block; min-width:1ch; }

/* Journey Timeline */
.journey-timeline { position:relative; max-width:860px; margin:0 auto; padding:20px 0; }
.journey-timeline::before {
    content:''; position:absolute; top:0; bottom:0; left:50%; width:2px;
    background:linear-gradient(180deg, transparent, var(--gold), var(--gold), transparent);
    transform:translateX(-50%);
}
.journey-item { position:relative; width:50%; padding:0 40px 48px; }
.journey-item:nth-child(odd) { left:0; text-align:right; }
.journey-item:nth-child(even) { left:50%; text-align:left; }
.journey-dot {
    position:absolute; top:8px; width:16px; height:16px; border-radius:50%;
    background:var(--gold); border:3px solid var(--black); box-shadow:0 0 0 3px rgba(212,175,55,0.35);
}
.journey-item:nth-child(odd) .journey-dot { right:-8px; }
.journey-item:nth-child(even) .journey-dot { left:-8px; }
.journey-card {
    background:var(--dark-gray); border:1px solid var(--border-color); border-radius:var(--radius-lg);
    padding:24px; transition:var(--transition);
}
.journey-card:hover { transform:translateY(-5px); border-color:var(--gold); box-shadow:var(--shadow-lg); }
.journey-year {
    display:inline-block; padding:4px 14px; border-radius:50px; font-size:0.8rem; font-weight:700;
    background:linear-gradient(135deg, var(--gold), var(--dark-gold)); color:var(--black); margin-bottom:10px;
    font-family:var(--font-primary); letter-spacing:0.5px;
}
.journey-card h4 { font-size:1.15rem; margin-bottom:8px; }
.journey-card p { color:rgba(255,255,255,0.7); font-size:0.95rem; margin:0; line-height:1.7; }

/* Team Cards */
.team-card {
    background:var(--dark-gray); border:1px solid var(--border-color); border-radius:var(--radius-lg);
    padding:36px 24px; transition:var(--transition); height:100%; border-bottom:3px solid transparent;
}
.team-card:hover { transform:translateY(-10px); border-bottom-color:var(--gold); box-shadow:var(--shadow-lg); }
.team-avatar {
    width:90px; height:90px; margin:0 auto 18px; border-radius:50%;
    background:linear-gradient(135deg, rgba(212,175,55,0.2), rgba(212,175,55,0.05));
    border:2px solid var(--gold); display:flex; align-items:center; justify-content:center;
    font-family:var(--font-heading); font-size:1.8rem; font-weight:700; color:var(--gold);
    box-shadow:0 0 0 6px rgba(212,175,55,0.08); transition:var(--transition);
}
.team-card:hover .team-avatar { background:linear-gradient(135deg, var(--gold), var(--dark-gold)); color:var(--black); }
.team-role { color:var(--gold); font-size:0.9rem; font-weight:600; }
.team-bio { color:rgba(255,255,255,0.6); font-size:0.9rem; line-height:1.6; }
.team-social { display:flex; gap:10px; justify-content:center; margin-top:16px; }
.team-social a {
    width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center;
    background:rgba(212,175,55,0.1); border:1px solid rgba(212,175,55,0.25); color:var(--gold); font-size:0.9rem;
    transition:var(--transition);
}
.team-social a:hover { background:var(--gold); color:var(--black); transform:translateY(-3px); border-color:var(--gold); }

/* Base style for initials-based avatars */
.author-avatar-placeholder {
    border-radius:50%; background:linear-gradient(135deg, var(--gold), var(--dark-gold));
    color:var(--black); display:flex; align-items:center; justify-content:center;
    font-weight:700; font-family:var(--font-heading); flex-shrink:0;
}

@media (max-width: 767.98px) {
    .about-stats-grid { grid-template-columns:1fr; }
    .journey-timeline::before { left:8px; }
    .journey-item, .journey-item:nth-child(odd), .journey-item:nth-child(even) {
        width:100%; left:0; text-align:left; padding:0 0 40px 40px;
    }
    .journey-item:nth-child(odd) .journey-dot, .journey-item:nth-child(even) .journey-dot { left:0; right:auto; }
}

/* =============================================
    Contact
    ============================================= */
.contact-container { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px,1fr)); gap:50px; margin-top:50px; }
.contact-info { display:flex; flex-direction:column; gap:30px; }
.contact-item { display:flex; align-items:flex-start; gap:15px; }
.contact-icon { font-size:1.5rem; color:var(--gold); margin-top:5px; }
.contact-details h4 { font-size:1.2rem; margin-bottom:5px; }
.contact-details p, .contact-details a { color:rgba(255,255,255,0.8); font-size:0.9rem; }
.contact-info-card {
    background:var(--dark-gray); border:1px solid var(--border-color); border-radius:var(--radius-lg);
    padding:32px; text-align:center; height:100%; transition:var(--transition);
}
.contact-info-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-md); }
.contact-info-icon {
    width:60px; height:60px; background:rgba(212,175,55,0.15); border-radius:50%;
    display:flex; align-items:center; justify-content:center; font-size:1.3rem;
    color:var(--gold); margin:0 auto 16px;
}

/* Forms */
.contact-form .form-group, .form-group { margin-bottom:20px; }
.contact-form label, label { display:block; margin-bottom:8px; font-weight:500; color:var(--gold); font-size:0.9rem; }
.contact-form input, .contact-form textarea,
input, textarea, select, .form-control {
    width:100%; padding:12px 15px; background:#ffffff;
    border:1px solid #ced4da; border-radius:var(--radius-sm);
    color:#000000; font-family:var(--font-primary); font-size:0.95rem; transition:var(--transition);
}
input:focus, textarea:focus, select:focus, .form-control:focus {
    outline:none; border-color:var(--gold); background:#ffffff;
    box-shadow:0 0 0 3px rgba(212,175,55,0.15);
}
.form-control::placeholder { color:#6c757d; }
input::placeholder, textarea::placeholder { color:#6c757d; }
select { appearance:auto; }
select option { background:#ffffff; color:#000000; }
.form-floating > .form-control {
    border-radius:var(--radius-sm); border:1px solid #ced4da;
    background:#ffffff; color:#000000;
}
.form-floating > .form-control:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(212,175,55,0.15); }

/* =============================================
   Newsletter
   ============================================= */
.newsletter-section { padding:60px 0; background:var(--dark-gray); }
.newsletter-wrapper {
    background:var(--black); border-radius:var(--radius-xl); padding:48px;
    color:var(--white); border:1px solid var(--border-color);
}
.newsletter-title { color:var(--gold); font-size:1.8rem; margin-bottom:8px; }
.newsletter-text { color:rgba(255,255,255,0.7); margin:0; }
.newsletter-form-footer .form-control {
    background:#ffffff; border:1px solid #ced4da;
    color:#000000; border-radius:var(--radius-sm) 0 0 var(--radius-sm); padding:12px 20px;
}
.newsletter-form-footer .form-control::placeholder { color:#6c757d; }
.newsletter-form-footer .form-control:focus { box-shadow:none; border-color:var(--gold); background:#ffffff; }
.newsletter-form-footer .btn { border-radius:0 var(--radius-sm) var(--radius-sm) 0; padding:12px 28px; }

/* Newsletter Popup */
.newsletter-popup-overlay {
    position:fixed; top:0; left:0; width:100%; height:100%;
    background:rgba(0,0,0,0.7); backdrop-filter:blur(5px); z-index:9998;
    display:none; align-items:center; justify-content:center;
}
.newsletter-popup-overlay.active { opacity:1; visibility:visible; }
.newsletter-popup {
    background:var(--dark-gray); border-radius:var(--radius-xl); padding:48px;
    max-width:480px; width:90%; position:relative; transform:scale(0.9);
    transition:var(--transition); border:1px solid var(--border-color);
}
.newsletter-popup-overlay.active .newsletter-popup { transform:scale(1); }
.newsletter-popup-close {
    position:absolute; top:16px; right:16px; width:32px; height:32px;
    border-radius:50%; border:none; background:var(--medium-gray); color:var(--text-muted);
    display:flex; align-items:center; justify-content:center; cursor:pointer; transition:var(--transition);
}
.newsletter-popup-close:hover { background:#EF4444; color:white; }
.newsletter-popup-content { text-align:center; }
.newsletter-popup-icon {
    width:70px; height:70px; background:rgba(212,175,55,0.15); border-radius:50%;
    display:flex; align-items:center; justify-content:center; margin:0 auto 20px;
    font-size:1.5rem; color:var(--gold);
}
.newsletter-popup-content h3 { font-size:1.5rem; margin-bottom:8px; color:var(--gold); }
.newsletter-popup-content p { color:rgba(255,255,255,0.7); margin-bottom:24px; }

/* =============================================
   Footer
   ============================================= */
.site-footer, footer {
    background:var(--black); padding:60px 0 20px; border-top:1px solid var(--border-color);
}
.footer-content {
    display:grid; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); gap:40px; margin-bottom:40px;
}
.footer-logo { font-family:var(--font-heading); font-size:1.8rem; font-weight:700; color:var(--gold); margin-bottom:20px; display:inline-block; }
.footer-logo span { color:var(--white); }
.footer-about, .footer-desc { color:rgba(255,255,255,0.7); font-size:0.9rem; line-height:1.8; margin-bottom:20px; }
.social-links { display:flex; gap:10px; }
.social-link {
    display:flex; align-items:center; justify-content:center; width:40px; height:40px;
    padding:8px;
    background:var(--dark-gray); border-radius:50%; transition:var(--transition);
    border:1px solid var(--border-color);
    color:rgba(255,255,255,0.7); font-size:1.1rem;
}
.social-link i { transition:var(--transition); }
.social-link img {
    width:100%; height:100%; object-fit:contain; border-radius:50%;
    transition:var(--transition);
}
.social-link:hover img { transform:scale(1.1); }
.social-link:hover { background:var(--gold); transform:translateY(-3px); border-color:var(--gold); color:var(--black); }
.footer-title {
    font-size:1.2rem; margin-bottom:20px; position:relative; padding-bottom:10px; color:var(--gold);
}
.footer-title::after { content:''; position:absolute; bottom:0; left:0; width:40px; height:2px; background:var(--gold); }
.footer-heading {
    color:var(--gold); font-size:1.05rem; font-family:var(--font-heading);
    margin-bottom:20px; font-weight:600;
}
.footer-links, .footer-contact { list-style:none; padding:0; }
.footer-links li { margin-bottom:10px; }
.footer-links a, .footer-contact a {
    color:rgba(255,255,255,0.6); font-size:0.9rem; transition:var(--transition); display:inline-block;
}
.footer-links a:hover { color:var(--gold); padding-left:5px; }
.footer-contact li { font-size:0.9rem; margin-bottom:10px; color:rgba(255,255,255,0.6); }
.footer-bottom {
    border-top:1px solid rgba(255,255,255,0.1); padding:20px 0; margin-top:20px; text-align:center;
}
.footer-bottom p { font-size:0.85rem; color:rgba(255,255,255,0.5); }
.footer-bottom a { color:var(--gold); }

/* =============================================
   Pages (Blog, Shop, etc.)
   ============================================= */
.page-header {
    background:linear-gradient(rgba(0,0,0,0.75), rgba(0,0,0,0.75)),
        url('../images/hero-bg.png') no-repeat center center/cover;
    padding:120px 0 60px; text-align:center; position:relative;
    border-bottom: 1px solid rgba(212,175,55,0.08);
}
.page-header h1 {
    color:var(--white); font-size:2.8rem; margin-bottom:12px;
    font-family: var(--font-heading); font-weight: 700;
}
.page-header .breadcrumb { justify-content:center; }
.page-header-subtitle {
    color:rgba(255,255,255,0.7); font-size:1.05rem; max-width:560px; margin:0 auto 16px;
    font-family:var(--font-heading); font-style:italic;
}
.page-header .breadcrumb-item, .page-header .breadcrumb-item a { color:rgba(255,255,255,0.6); font-size:0.85rem; letter-spacing:0.3px; }
.page-header .breadcrumb-item.active { color:var(--gold); }
.page-header .breadcrumb-item + .breadcrumb-item::before { color:rgba(255,255,255,0.3); }

/* =============================================
   Auth Pages - Styled via auth.css
   ============================================= */

/* =============================================
   Shop / Book Detail
   ============================================= */
.shop-sidebar { position:sticky; top:100px; }
.filter-group {
    background:var(--dark-gray); border:1px solid var(--border-color);
    border-radius:var(--radius-lg); padding:24px; margin-bottom:24px;
    transition: var(--transition);
}
.filter-group:hover {
    border-color: rgba(212,175,55,0.15);
}
.filter-group h5 {
    font-size:0.95rem;
    font-family:var(--font-primary);
    margin-bottom:18px;
    color:var(--gold);
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:1px;
    padding-bottom:12px;
    border-bottom:1px solid var(--border-color);
    display:flex;
    align-items:center;
    gap:10px;
}
.filter-group h5 i {
    font-size:0.85rem;
    opacity:0.8;
}

/* Sidebar Categories */
.filter-group ul li {
    transition: var(--transition);
    padding: 10px 0 !important;
}
.filter-group ul li:first-child {
    padding-top: 0 !important;
}
.filter-group ul li:last-child {
    border-bottom: none !important;
}
.filter-group ul li a {
    transition: var(--transition);
    padding: 4px 0;
    font-size: 0.92rem;
    font-weight: 500;
    color: rgba(255,255,255,0.75);
}
.filter-group ul li a:hover {
    color: var(--gold);
    padding-left: 6px;
}
.filter-group ul li a .tag {
    background: rgba(212,175,55,0.12);
    color: var(--gold);
    padding: 2px 10px;
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 600;
    min-width: 24px;
    text-align: center;
    transition: var(--transition);
}
.filter-group ul li a:hover .tag {
    background: var(--gold);
    color: var(--black);
}

/* Sidebar Recent Posts */
.filter-group ul li a small.text-muted {
    font-size: 0.75rem;
    color: rgba(255,255,255,0.4) !important;
    display: block;
    margin-bottom: 4px;
    letter-spacing: 0.3px;
}
.filter-group ul li a div.fw-semibold {
    font-size: 0.9rem;
    line-height: 1.4;
    transition: var(--transition);
}
.filter-group ul li a:hover div.fw-semibold {
    color: var(--gold) !important;
}

/* Sidebar Newsletter CTA */
.filter-group[style*="text-align:center"] {
    background: linear-gradient(180deg, var(--dark-gray), rgba(30,30,30,0.6));
    border: 1px solid rgba(212,175,55,0.15);
    position: relative;
    overflow: hidden;
}
.filter-group[style*="text-align:center"]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
}
.filter-group[style*="text-align:center"] i.fa-envelope-open-text {
    font-size: 2rem;
    margin-bottom: 16px;
}
.filter-group[style*="text-align:center"] h5 {
    justify-content: center;
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 8px;
    font-size: 1.05rem;
    text-transform: none;
    letter-spacing: 0;
    font-family: var(--font-heading);
}
.filter-group[style*="text-align:center"] p {
    font-size: 0.88rem !important;
    max-width: 220px;
    margin: 0 auto 20px !important;
}
.filter-group[style*="text-align:center"] .btn {
    border-radius: 50px;
    padding: 10px 24px;
    font-size: 0.82rem;
    letter-spacing: 0.5px;
}

/* Sidebar Search */
.filter-group:first-child .input-group .form-control {
    border-radius: 50px 0 0 50px;
    background: #ffffff;
    border: 1px solid #ced4da;
    padding: 10px 16px;
    font-size: 0.88rem;
    color: #000000;
}
.filter-group:first-child .input-group .form-control:focus {
    background: #ffffff;
    border-color: var(--gold);
}
.filter-group:first-child .input-group .btn {
    border-radius: 0 50px 50px 0;
    padding: 10px 18px;
    border: none;
}

.price-range { display:flex; gap:10px; align-items:center; }
.price-range input { width:100%; padding:8px 12px; border:1px solid #ced4da; border-radius:var(--radius-sm); background:#ffffff; color:#000000; }
.book-detail-hero { background:var(--dark-gray); padding:100px 0 60px; }
.book-detail-cover {
border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); max-height:500px;
}
.book-detail-cover img { width:100%; height:100%; object-fit:cover; }
.book-detail-cover-placeholder {
    width:100%; height:400px; background:linear-gradient(135deg, var(--gold), var(--dark-gold));
    display:flex; align-items:center; justify-content:center; color:var(--black);
    font-size:2rem; font-weight:700; text-align:center; padding:20px;
}
.book-detail-info h1 { font-size:2rem; margin-bottom:12px; color:var(--gold); }
.book-meta-list { list-style:none; padding:0; }
.book-meta-list li {
    padding:10px 0; border-bottom:1px solid var(--border-color);
    display:flex; align-items:center; gap:12px; font-size:0.95rem; color:var(--text-secondary);
}
.book-meta-list li i { width:20px; color:var(--gold); }

/* =============================================
   Blog Detail
   ============================================= */
.blog-detail-hero { padding:120px 0 60px; background:var(--dark-gray); }
.blog-detail-content { font-size:1.05rem; line-height:1.9; color:var(--text-secondary); }
.blog-detail-content h2, .blog-detail-content h3 { margin-top:32px; margin-bottom:16px; color:var(--gold); }
.blog-detail-content p { margin-bottom:20px; }
.blog-detail-content img { border-radius:var(--radius-md); margin:20px 0; }
.comment-form {
    background:var(--dark-gray); border:1px solid var(--border-color);
    border-radius:var(--radius-lg); padding:32px;
}
.comment-item {
    display:flex; gap:16px; padding:20px 0; border-bottom:1px solid var(--border-color);
}
.comment-avatar .author-avatar-placeholder { width:44px; height:44px; font-size:0.85rem; }
.comment-body { flex:1; }
.comment-header { display:flex; align-items:center; gap:12px; margin-bottom:8px; }
.comment-header strong { font-size:0.95rem; color:var(--white); }
.comment-header span { font-size:0.8rem; color:var(--text-muted); }
.comment-content { font-size:0.95rem; color:var(--text-secondary); line-height:1.7; }

/* =============================================
   Cart & Checkout
   ============================================= */
.cart-item {
    display:flex; align-items:flex-start; gap:20px; padding:18px 0;
    border-bottom:1px solid var(--border-color);
}
.cart-item-image {
    width:100px; height:120px; border-radius:var(--radius-md); overflow:hidden; flex-shrink:0;
    background:linear-gradient(135deg, rgba(212,175,55,0.06), rgba(0,0,0,0.06));
}
.cart-item-image img { width:100%; height:100%; object-fit:cover; display:block; }
.cart-item-info { flex:1; display:flex; flex-direction:column; justify-content:space-between; gap:8px; }
.cart-item-info h6 { font-family:var(--font-heading); font-size:1rem; margin-bottom:4px; color:var(--white); }
.cart-item-category { color:var(--gold); font-size:0.9rem; }
.cart-item-line-total { color:var(--text-secondary); font-size:0.95rem; }
.cart-item-actions {
    min-width:140px; display:flex; flex-direction:column; align-items:flex-end; gap:10px;
}
.cart-item-actions .remove-btn { background:transparent; border:none; color:var(--text-muted); font-weight:600; cursor:pointer; }
.cart-item-actions .remove-btn:hover { color:var(--gold); }

.cart-quantity-control {
   display:inline-flex; align-items:center; gap:6px; border:1px solid var(--border-color);
   border-radius:8px; padding:4px; background:rgba(255,255,255,0.02);
}
.cart-quantity-control.is-loading { opacity:0.7; pointer-events:none; }
.qty-btn {
   width:34px; height:34px; border:none; border-radius:6px; background:transparent;
   color:var(--gold); display:flex; align-items:center; justify-content:center; cursor:pointer; border:1px solid transparent;
}
.qty-btn:hover { background:var(--gold); color:var(--black); border-color:var(--gold); }
.qty-btn:disabled { opacity:0.6; cursor:not-allowed; }
.qty-input {
   width:56px; border:1px solid #ced4da; background:#ffffff; color:#000000; text-align:center;
   font-weight:700; outline:none; font-size:0.95rem; border-radius:6px; padding:4px 0;
}
.qty-input::-webkit-outer-spin-button, .qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.cart-summary {
   background:var(--dark-gray); border:1px solid var(--border-color); border-radius:var(--radius-lg);
   padding:28px; position:sticky; top:100px; box-shadow:var(--shadow-md);
}
.cart-summary h5 { font-family:var(--font-heading); font-size:1.1rem; margin-bottom:20px; color:var(--gold); }
.cart-summary-row { display:flex; justify-content:space-between; padding:10px 0; font-size:0.95rem; color:var(--text-secondary); }
.cart-summary-total {
   border-top:2px solid var(--gold); padding-top:12px; margin-top:8px;
   font-weight:700; font-size:1.1rem; color:var(--gold);
}
.cart-summary-note {
   padding:12px 14px; border-radius:var(--radius-sm); background:rgba(212,175,55,0.08);
   color:var(--gold); font-size:0.9rem; border:1px solid rgba(212,175,55,0.14);
}

/* Checkout Page */
#checkoutForm .filter-group {
    background: var(--dark-gray);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 24px;
}
#checkoutForm .filter-group h5 {
    font-size: 1rem;
    font-family: var(--font-heading);
    margin-bottom: 20px;
    color: var(--gold);
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border-color);
}
/* Payment method cards */
#checkoutForm .payment-option {
    border: 1.5px solid var(--border-color) !important;
    border-radius: 12px !important;
    cursor: pointer;
    transition: all 0.3s ease;
    background: rgba(255,255,255,0.02);
}
#checkoutForm .payment-option:hover {
    border-color: rgba(212,175,55,0.4) !important;
    background: rgba(212,175,55,0.04);
}
#checkoutForm .payment-option:has(input:checked) {
    border-color: var(--gold) !important;
    background: rgba(212,175,55,0.08);
    box-shadow: 0 0 0 3px rgba(212,175,55,0.1);
}
#checkoutForm .payment-option .form-check-input:checked {
    background-color: var(--gold);
    border-color: var(--gold);
}
#checkoutForm .payment-option .form-check-label {
    color: var(--text-secondary);
    font-size: 0.9rem;
    cursor: pointer;
}
#checkoutForm .payment-option .form-check-label i {
    font-size: 1.1rem;
}

/* Order summary items */
.cart-summary-item {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid var(--border-color);
}
.cart-summary-item div small:first-child {
    color: var(--white);
}
.cart-summary-item div small.d-block {
    color: var(--white);
    opacity: 0.6;
    font-size: 0.8rem;
    margin-top: 2px;
}
.cart-summary-item .fw-semibold:last-child {
    color: var(--gold);
}
.cart-summary-discount {
    color: #10B981;
}
.cart-summary-security {
    text-align: center;
    margin-top: 16px;
    color: var(--text-muted);
    font-size: 0.85rem;
}
.cart-summary-security i {
    color: var(--gold);
}

/* Review Form */
.review-form-card {
    background: var(--dark-gray);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 24px;
}
.review-form-card h6 {
    color: var(--gold);
    font-family: var(--font-heading);
}
.review-label {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: rgba(255,255,255,0.6);
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.review-input {
    width: 100%;
    padding: 10px 14px;
    background: #fff;
    border: 1.5px solid #d0d0d0;
    border-radius: 8px;
    color: #000;
    font-size: 0.9rem;
    outline: none;
    transition: border-color 0.3s;
}
.review-input:focus {
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(212,175,55,0.15);
}
.review-input::placeholder {
    color: #aaa;
}
.review-textarea {
    resize: vertical;
    min-height: 100px;
}

/* Star Rating Selector */
.star-rating {
    display: flex;
    gap: 6px;
}
.star-rating .fa-star {
    font-size: 1.6rem;
    color: rgba(255,255,255,0.15);
    cursor: pointer;
    transition: color 0.2s, transform 0.15s;
}
.star-rating .fa-star.active {
    color: var(--gold);
}
.star-rating .fa-star:hover {
    color: var(--gold);
    transform: scale(1.15);
}

/* Checkout button */
#checkoutForm .btn-primary-gradient {
    font-size: 1rem;
    letter-spacing: 0.3px;
    border-radius: 10px;
    transition: all 0.3s ease;
}
#checkoutForm .btn-primary-gradient:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(212,175,55,0.4);
}
#checkoutForm .btn-primary-gradient:disabled {
    transform: none;
    box-shadow: none;
}

.cart-empty { text-align:center; padding:40px 20px; color:var(--text-secondary); }

/* Responsive adjustments */
@media (max-width: 991.98px) {
    .cart-summary { position:static; margin-top:20px; }
}

@media (max-width: 767.98px) {
   .cart-item { flex-direction:column; align-items:flex-start; gap:12px; }
   .cart-item-actions { width:100%; display:flex; justify-content:space-between; flex-direction:row-reverse; }
   .cart-summary { position:static; width:100%; margin-top:18px; }
}

/* =============================================
   Dashboard
   ============================================= */
.dashboard-layout { padding-top:80px; min-height:100vh; background:var(--black); }

/* My Reviews */
.review-card {
    background:var(--dark-gray);
    border:1px solid var(--border-color);
    border-radius:var(--radius-md);
    padding:16px;
    transition:all 0.3s ease;
}
.review-card:hover {
    border-color:rgba(212,175,55,0.3);
    box-shadow:0 4px 20px rgba(0,0,0,0.2);
    transform:translateY(-2px);
}
.review-cover-link { text-decoration:none; }
.review-cover {
    width:72px;
    height:96px;
    border-radius:8px;
    overflow:hidden;
    background:linear-gradient(135deg, rgba(212,175,55,0.08), rgba(0,0,0,0.08));
}
.review-cover img { width:100%; height:100%; object-fit:cover; transition:transform 0.3s ease; }
.review-card:hover .review-cover img { transform:scale(1.08); }
.review-book-title {
    color:var(--white);
    font-weight:600;
    font-size:0.95rem;
    text-decoration:none;
    transition:color 0.3s ease;
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    max-width:320px;
}
.review-book-title:hover { color:var(--gold); }
.review-stars { margin-top:4px; display:flex; gap:2px; }
.review-stars .fa-star.active { color:#F59E0B; font-size:0.8rem; }
.review-stars .fa-star.inactive { color:#374151; font-size:0.8rem; }
.review-date {
    font-size:0.72rem;
    color:var(--text-muted);
    margin-top:4px;
    white-space:nowrap;
}
.review-title-text {
    color:var(--gold);
    font-size:0.85rem;
    font-weight:600;
    margin-top:6px;
}
.review-body-text {
    color:var(--text-secondary);
    font-size:0.82rem;
    margin-top:4px;
    line-height:1.6;
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

@media (max-width:576px) {
    .review-book-title { max-width:180px; }
}
.dashboard-sidebar {
    background:var(--dark-gray); border:1px solid var(--border-color);
    border-radius:var(--radius-lg); padding:24px; position:sticky; top:100px;
}
.dashboard-nav-link {
    display:flex; align-items:center; gap:12px; padding:10px 16px;
    border-radius:var(--radius-sm); color:rgba(255,255,255,0.6);
    font-weight:500; font-size:0.9rem; transition:var(--transition); margin-bottom:4px;
}
.dashboard-nav-link:hover { background:rgba(212,175,55,0.1); color:var(--gold); }
.dashboard-nav-link.active { background:var(--gold); color:var(--black); }
.dashboard-nav-link i { width:20px; text-align:center; }
/* Dashboard Welcome */
.dashboard-welcome {
    display:flex; align-items:center; justify-content:space-between;
    flex-wrap:wrap; gap:16px; margin-bottom:32px;
    background:linear-gradient(135deg, rgba(212,175,55,0.06), transparent);
    border:1px solid rgba(212,175,55,0.1);
    border-radius:var(--radius-lg); padding:28px 32px;
}
.dashboard-welcome-title {
    font-family:var(--font-heading); font-size:1.6rem;
    color:var(--white); margin-bottom:4px;
}
.dashboard-welcome-subtitle { color:var(--text-muted); font-size:0.9rem; margin:0; }

/* Dashboard Stat Cards */
.dashboard-stat-card {
    background:var(--dark-gray); border:1px solid var(--border-color);
    border-radius:var(--radius-lg); padding:20px;
    display:flex; align-items:center; gap:16px;
    transition:var(--transition);
}
.dashboard-stat-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-md); border-color:rgba(212,175,55,0.15); }

.stat-icon {
    width:48px; height:48px; min-width:48px;
    border-radius:var(--radius-md);
    display:flex; align-items:center; justify-content:center;
    font-size:1.1rem;
}
.stat-icon-orders { background:rgba(212,175,55,0.15); color:var(--gold); }
.stat-icon-downloads { background:rgba(16,185,129,0.15); color:#10B981; }
.stat-icon-wishlist { background:rgba(239,68,68,0.15); color:#EF4444; }
.stat-icon-saved { background:rgba(59,130,246,0.15); color:#3B82F6; }
.stat-icon-reviews { background:rgba(168,85,247,0.15); color:#A855F7; }
.stat-icon-users { background:rgba(59,130,246,0.12); color:#3B82F6; }
.stat-icon-revenue { background:rgba(16,185,129,0.12); color:#10B981; }
.stat-icon-orders-lg { background:rgba(245,158,11,0.12); color:#F59E0B; }
.stat-icon-books { background:rgba(168,85,247,0.12); color:#A855F7; }
.stat-icon-posts { background:rgba(212,175,55,0.12); color:var(--gold); }
.stat-icon-subscribers { background:rgba(59,130,246,0.12); color:#3B82F6; }
.stat-icon-contacts { background:rgba(239,68,68,0.12); color:#EF4444; }
.stat-icon-comments { background:rgba(245,158,11,0.12); color:#F59E0B; }
.admin-stat-card { padding:16px 20px !important; }
.admin-stat-card .stat-icon { width:40px; height:40px; min-width:40px; font-size:0.9rem; }
.admin-stat-card .stat-body h3 { font-size:1.4rem; }
.stat-icon-pending { background:rgba(234,179,8,0.12); color:#EAB308; }
.stat-icon-avg { background:rgba(59,130,246,0.12); color:#3B82F6; }

.stat-body h3 { font-size:1.6rem; font-weight:700; margin-bottom:0; color:var(--white); line-height:1.2; }
.stat-body p { color:var(--text-muted); font-size:0.8rem; margin:0; text-transform:uppercase; letter-spacing:0.5px; }

/* Dashboard Cards */
.dashboard-card {
    background:var(--dark-gray); border:1px solid var(--border-color);
    border-radius:var(--radius-lg); overflow:hidden;
}
.dashboard-card-header {
    display:flex; align-items:center; justify-content:space-between;
    padding:18px 24px; border-bottom:1px solid var(--border-color);
}
.dashboard-card-header h5 { margin:0; font-size:1rem; color:var(--white); font-weight:600; }
.dashboard-card-header h5 i { color:var(--gold); }
.dashboard-card-body { padding:0; }

/* Dashboard Table */
.dashboard-table { width:100%; border-collapse:collapse; }
.dashboard-table thead th {
    font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;
    color:var(--text-muted); padding:12px 20px; font-weight:600;
    border-bottom:1px solid var(--border-color); background:rgba(0,0,0,0.15);
}
.dashboard-table tbody td {
    padding:14px 20px; font-size:0.9rem; color:rgba(255,255,255,0.8);
    border-bottom:1px solid rgba(255,255,255,0.04);
    vertical-align:middle;
}
.dashboard-table tbody tr:last-child td { border-bottom:none; }
.dashboard-table tbody tr:hover { background:rgba(212,175,55,0.03); }
.dashboard-table .order-number { font-family:monospace; font-size:0.82rem; color:var(--gold); font-weight:600; }
.dashboard-table .order-date { font-size:0.85rem; color:var(--text-muted); }
.dashboard-table .order-total { font-weight:700; color:var(--white); }
.dashboard-table .btn-outline-light {
    width:32px; height:32px; padding:0; display:flex; align-items:center; justify-content:center;
    background:var(--gold); color:var(--black); border:none;
    box-shadow:0 4px 15px rgba(212,175,55,0.35);
}
.dashboard-table .btn-outline-light:hover { background:var(--dark-gold); color:var(--white); transform:translateY(-2px); box-shadow:0 8px 25px rgba(212,175,55,0.45); }

/* Status Badges */
.status-badge {
    display:inline-flex; align-items:center; gap:6px;
    padding:4px 14px; border-radius:50px; font-size:0.78rem; font-weight:600;
}
.status-completed { background:rgba(16,185,129,0.12); color:#10B981; }
.status-pending { background:rgba(245,158,11,0.12); color:#F59E0B; }
.status-cancelled { background:rgba(239,68,68,0.12); color:#EF4444; }
.status-paid { background:rgba(16,185,129,0.12); color:#10B981; }
.status-processing { background:rgba(59,130,246,0.12); color:#3B82F6; }
.status-failed { background:rgba(239,68,68,0.12); color:#EF4444; }
.status-refunded { background:rgba(168,85,247,0.12); color:#A855F7; }
.order-items-pill {
    background:rgba(255,255,255,0.08); color:rgba(255,255,255,0.7);
    padding:4px 12px;
}

/* Admin Filter Pills */
.admin-filter-btn {
    display:inline-flex; align-items:center; gap:6px;
    padding:7px 16px; border-radius:50px; font-size:0.82rem; font-weight:600;
    border:1px solid var(--border-color); background:transparent; color:var(--text-muted);
    text-decoration:none; transition:var(--transition); cursor:pointer;
}
.admin-filter-btn:hover { color:var(--gold); border-color:rgba(212,175,55,0.4); text-decoration:none; }
.admin-filter-btn.active { background:var(--gold); color:var(--black); border-color:var(--gold); }
.admin-filter-count {
    min-width:20px; height:20px; padding:0 6px; border-radius:50px;
    background:rgba(255,255,255,0.12); color:inherit;
    font-size:0.7rem; font-weight:700;
    display:inline-flex; align-items:center; justify-content:center;
}
.admin-filter-btn.active .admin-filter-count { background:rgba(0,0,0,0.18); }

/* Order Status Select */
.order-status-select {
    background:#ffffff !important;
    color:#000000 !important;
    border:1px solid #ced4da !important;
    border-radius:var(--radius-sm) !important;
    padding:6px 10px;
    background-image:none !important;
    width:140px;
    transition:var(--transition);
}
.order-status-select:focus {
    border-color:var(--gold) !important;
    box-shadow:0 0 0 3px rgba(212,175,55,0.15) !important;
}

/* Order Actions */
.order-actions { display:flex; align-items:center; gap:6px; }
.dashboard-table .order-actions .btn {
    width:32px; height:32px; padding:0;
    display:inline-flex; align-items:center; justify-content:center;
}
.dashboard-table .btn-outline-danger {
    background:var(--gold); color:var(--black); border:none;
    box-shadow:0 4px 15px rgba(212,175,55,0.35);
}
.dashboard-table .btn-outline-danger:hover {
    background:var(--dark-gold); color:var(--white); transform:translateY(-2px);
    box-shadow:0 8px 25px rgba(212,175,55,0.45);
}

@media (max-width:575.98px) {
    .orders-table .dashboard-table th:nth-child(2),
    .orders-table .dashboard-table td:nth-child(2),
    .orders-table .dashboard-table th:nth-child(4),
    .orders-table .dashboard-table td:nth-child(4),
    .orders-table .dashboard-table th:nth-child(5),
    .orders-table .dashboard-table td:nth-child(5),
    .orders-table .dashboard-table th:nth-child(7),
    .orders-table .dashboard-table td:nth-child(7) { display:none; }
}

/* Notifications */
.notification-item {
    display:flex; align-items:flex-start; gap:14px;
    padding:16px 24px; position:relative;
    border-bottom:1px solid rgba(255,255,255,0.04);
    transition:var(--transition);
}
.notification-item:last-child { border-bottom:none; }
.notification-item:hover { background:rgba(212,175,55,0.03); }
.notification-dot {
    width:8px; height:8px; min-width:8px;
    border-radius:50%; background:var(--gold);
    position:absolute; top:20px; left:12px;
}
.notification-icon {
    width:36px; height:36px; min-width:36px;
    border-radius:var(--radius-sm);
    background:rgba(212,175,55,0.1);
    display:flex; align-items:center; justify-content:center;
    color:var(--gold); font-size:0.85rem;
}
.notification-content p { margin:0; font-size:0.88rem; color:rgba(255,255,255,0.8); line-height:1.4; }
.notification-time { font-size:0.75rem; color:var(--text-muted); }

/* Quick Actions */
.quick-actions {
    display:grid; grid-template-columns:repeat(2, 1fr); gap:12px; padding:20px 24px;
}
.quick-action {
    display:flex; flex-direction:column; align-items:center; gap:10px;
    padding:20px 12px; border-radius:var(--radius-md);
    border:1px solid var(--border-color); text-decoration:none;
    transition:var(--transition); color:rgba(255,255,255,0.7);
    font-size:0.85rem; font-weight:500;
}
.quick-action:hover {
    border-color:rgba(212,175,55,0.25);
    background:rgba(212,175,55,0.05);
    color:var(--gold); text-decoration:none;
    transform:translateY(-2px);
}
.quick-action-icon {
    width:42px; height:42px; border-radius:var(--radius-sm);
    background:rgba(212,175,55,0.08);
    display:flex; align-items:center; justify-content:center;
    font-size:1rem; color:var(--gold);
}
.quick-action:hover .quick-action-icon { background:rgba(212,175,55,0.15); }

/* Dashboard Empty State */
.dashboard-empty {
    text-align:center; padding:48px 24px;
}
.dashboard-empty i { font-size:2.5rem; color:rgba(255,255,255,0.1); margin-bottom:16px; display:block; }
.dashboard-empty p { color:var(--text-muted); margin-bottom:16px; }

/* =============================================
   Admin Dashboard
   ============================================= */
.admin-layout { display:flex; min-height:100vh; background:var(--black); }
.admin-sidebar {
    width:260px; background:var(--dark-gray); color:var(--white);
    position:fixed; top:0; left:0; height:100vh; overflow-y:auto;
    z-index:1040; transition:var(--transition); border-right:1px solid var(--border-color);
}
.admin-sidebar-brand { padding:20px 24px; border-bottom:1px solid var(--border-color); }
.admin-sidebar-brand a { display:flex; align-items:center; gap:10px; color:var(--white); text-decoration:none; }
.admin-sidebar-nav { padding:16px 12px; }
.admin-nav-item {
    display:flex; align-items:center; gap:12px; padding:10px 16px;
    border-radius:var(--radius-sm); color:rgba(255,255,255,0.6);
    font-size:0.9rem; font-weight:500; transition:var(--transition); margin-bottom:2px;
}
.admin-nav-item:hover { background:rgba(255,255,255,0.08); color:var(--white); }
.admin-nav-item.active { background:var(--gold); color:var(--black); }
.admin-nav-item i { width:20px; text-align:center; }
.admin-nav-heading {
    font-size:0.7rem; text-transform:uppercase; letter-spacing:1.5px;
    color:rgba(255,255,255,0.3); padding:16px 16px 8px; font-weight:600;
}
.admin-content {
    margin-left:260px; flex:1; padding:24px 32px;
    background:var(--black); min-height:100vh;
}
.admin-topbar { display:flex; align-items:center; justify-content:space-between; padding:16px 0; margin-bottom:24px; }
.admin-card {
    background:var(--dark-gray); border:1px solid var(--border-color);
    border-radius:var(--radius-md); padding:24px;
}

/* Admin Post Form — white fields with black text */
.admin-form-light .form-control,
.admin-form-light .form-select,
.admin-form-light textarea,
.admin-form-light select,
.admin-form-light input {
    background:#ffffff !important;
    color:#000000 !important;
    border:1px solid #ced4da !important;
}
.admin-form-light .form-control:focus,
.admin-form-light .form-select:focus,
.admin-form-light textarea:focus,
.admin-form-light select:focus,
.admin-form-light input:focus {
    background:#ffffff !important;
    color:#000000 !important;
    border-color:var(--gold) !important;
    box-shadow:0 0 0 3px rgba(212,175,55,0.15);
}
.admin-form-light .form-control::placeholder { color:#6c757d !important; }
.admin-form-light select option { background:#ffffff !important; color:#000000 !important; }
.admin-form-light .form-label { color:#000000 !important; }
.admin-table { width:100%; border-collapse:collapse; }
.admin-table th {
    background:var(--medium-gray); padding:12px 16px; font-size:0.8rem;
    font-weight:600; text-transform:uppercase; letter-spacing:0.5px;
    color:var(--gold); border-bottom:1px solid var(--border-color); white-space:nowrap;
}
.admin-table td {
    padding:12px 16px; border-bottom:1px solid var(--border-color);
    font-size:0.9rem; vertical-align:middle; color:var(--text-secondary);
}
.admin-table tr:hover td { background:rgba(255,255,255,0.03); }
.admin-table tr { transition:var(--transition); }

/* Admin Books List */
.admin-books-cover {
    width:40px; height:50px; border-radius:var(--radius-sm);
    object-fit:cover; transition:transform 0.3s ease, box-shadow 0.3s ease;
}
.admin-books-cover:hover {
    transform:scale(1.15); box-shadow:0 4px 20px rgba(0,0,0,0.5);
    position:relative; z-index:2;
}
.admin-books-cover-placeholder {
    width:40px; height:50px; border-radius:var(--radius-sm);
    background:var(--medium-gray); border:1px solid var(--border-color);
    display:flex; align-items:center; justify-content:center;
    color:var(--gold); font-size:0.9rem; transition:var(--transition);
}
.admin-books-title {
    font-size:0.9rem; font-weight:600; color:var(--text-primary);
    max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
    display:block;
}
.admin-books-rating {
    display:inline-flex; align-items:center; gap:4px;
    color:var(--gold); font-size:0.8rem;
}
.admin-books-rating-count {
    color:var(--text-muted); font-size:0.75rem;
}
.admin-books-sales {
    font-weight:600; color:var(--text-primary);
    font-size:0.9rem;
}
.admin-books-actions {
    display:flex; gap:6px; align-items:center;
}
.admin-books-actions .btn {
    width:32px; height:32px; padding:0; display:inline-flex;
    align-items:center; justify-content:center; border-radius:var(--radius-sm);
    transition:var(--transition);
}
.admin-books-actions .btn:hover {
    transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,0.3);
}
.admin-books-actions .btn-outline-primary {
    background:var(--gold); color:var(--black); border:none;
    box-shadow:0 4px 15px rgba(212,175,55,0.35);
}
.admin-books-actions .btn-outline-primary:hover {
    background:var(--dark-gold); color:var(--white); transform:translateY(-2px);
    box-shadow:0 8px 25px rgba(212,175,55,0.45);
}
.admin-books-actions .btn-outline-danger {
    background:var(--gold); color:var(--black); border:none;
    box-shadow:0 4px 15px rgba(212,175,55,0.35);
}
.admin-books-actions .btn-outline-danger:hover {
    background:var(--dark-gold); color:var(--white); transform:translateY(-2px);
    box-shadow:0 8px 25px rgba(212,175,55,0.45);
}

@media (max-width:991.98px) {
    .admin-sidebar { transform:translateX(-100%); }
    .admin-sidebar.show { transform:translateX(0); }
    .admin-content { margin-left:0; }
}
@media (max-width:767.98px) {
    .admin-books-title { max-width:140px; }
    .admin-table th, .admin-table td { padding:10px 12px; }
}
@media (max-width:575.98px) {
    .admin-table td:nth-child(2),
    .admin-table th:nth-child(2),
    .admin-table td:nth-child(4),
    .admin-table th:nth-child(4),
    .admin-table td:nth-child(5),
    .admin-table th:nth-child(5) { display:none; }
    .admin-books-title { max-width:100px; }
}

/* Admin Form */
.admin-form-section {
    background:var(--medium-gray); border-radius:var(--radius-md);
    padding:20px; margin-bottom:20px; border:1px solid var(--border-color);
}
.admin-form-section-title {
    font-size:0.85rem; font-weight:600; text-transform:uppercase;
    letter-spacing:1px; color:var(--gold); margin-bottom:16px;
    padding-bottom:10px; border-bottom:1px solid var(--border-color);
    display:flex; align-items:center; gap:8px;
}
.admin-form-section-title i { font-size:0.9rem; }
.admin-form-row {
    display:grid; grid-template-columns:1fr 1fr; gap:16px;
}
@media (max-width:767.98px) {
    .admin-form-row { grid-template-columns:1fr; }
}
.admin-file-current {
    display:flex; align-items:center; gap:10px; margin-top:10px;
    padding:10px 14px; background:rgba(255,255,255,0.03);
    border-radius:var(--radius-sm); border:1px solid var(--border-color);
}
.admin-file-current i { color:var(--gold); font-size:1.1rem; }
.admin-file-current span { font-size:0.85rem; color:var(--text-secondary); }
.admin-cover-preview {
    margin-top:12px; border-radius:var(--radius-sm); overflow:hidden;
    border:1px solid var(--border-color); max-width:140px;
    transition:var(--transition); cursor:pointer;
}
.admin-cover-preview:hover {
    border-color:var(--gold); box-shadow:0 4px 15px rgba(212,175,55,0.2);
}

/* =============================================
   FAQ
   ============================================= */
.faq-item {
    background:var(--dark-gray); border:1px solid var(--border-color);
    border-radius:var(--radius-md); margin-bottom:12px; overflow:hidden;
}
.faq-question {
    padding:18px 24px; display:flex; align-items:center; justify-content:space-between;
    cursor:pointer; font-weight:600; color:var(--white); transition:var(--transition);
}
.faq-question:hover { color:var(--gold); }
.faq-question i { transition:var(--transition); color:var(--text-muted); }
.faq-question.active i { transform:rotate(180deg); color:var(--gold); }
.faq-answer {
    padding:0 24px; max-height:0; overflow:hidden;
    transition:max-height 0.3s ease, padding 0.3s ease; color:rgba(255,255,255,0.7); line-height:1.8;
}
.faq-answer.active { max-height:500px; padding:0 24px 20px; }

/* =============================================
   404 Page
   ============================================= */
.error-page {
    min-height:100vh; display:flex; align-items:center; justify-content:center;
    text-align:center; background:var(--black); padding:20px;
}
.error-code {
    font-size:8rem; font-weight:900; color:var(--gold); line-height:1;
}
.error-message { color:rgba(255,255,255,0.8); font-size:1.2rem; margin-bottom:32px; }

/* =============================================
   Pagination
   ============================================= */
.pagination .page-link {
    border-radius:var(--radius-sm); margin:0 2px; color:rgba(255,255,255,0.6);
    border:1px solid var(--border-color); padding:8px 14px; font-size:0.9rem;
    transition:var(--transition); background:var(--dark-gray);
}
.pagination .page-link:hover { background:var(--gold); border-color:var(--gold); color:var(--black); }
.pagination .page-item.active .page-link { background:var(--gold); border-color:var(--gold); color:var(--black); }

/* =============================================
   Badges & Tags
   ============================================= */
.badge-status { padding:4px 10px; border-radius:50px; font-size:0.75rem; font-weight:600; }
.badge-success { background:rgba(16,185,129,0.15); color:#10B981; }
.badge-warning { background:rgba(245,158,11,0.15); color:#F59E0B; }
.badge-danger { background:rgba(239,68,68,0.15); color:#EF4444; }
.badge-info { background:rgba(59,130,246,0.15); color:#3B82F6; }
.tag { display:inline-block; padding:4px 12px; background:rgba(212,175,55,0.15); color:var(--gold); border-radius:50px; font-size:0.8rem; font-weight:500; margin:2px; }
.tag:hover { background:var(--gold); color:var(--black); text-decoration:none; }

/* =============================================
   Back to Top
   ============================================= */
.back-to-top {
    position:fixed; bottom:30px; right:30px; width:48px; height:48px;
    border-radius:50%; background:var(--gold); color:var(--black); border:none;
    display:flex; align-items:center; justify-content:center; cursor:pointer;
    z-index:1000; opacity:0; visibility:hidden; transform:translateY(20px);
    transition:var(--transition); box-shadow:0 4px 15px rgba(212,175,55,0.4);
}
.back-to-top.visible { opacity:1; visibility:visible; transform:translateY(0); }
.back-to-top:hover { transform:translateY(-4px); background:var(--dark-gold); color:var(--white); }

/* =============================================
   Tables (Bootstrap overrides)
   ============================================= */
.table { color:var(--text-secondary); --bs-table-bg:transparent; --bs-table-border-color:var(--border-color); }
.table-dark { --bs-table-bg:var(--dark-gray); --bs-table-border-color:var(--border-color); }
.table > :not(caption) > * > * { background-color:transparent; color:var(--text-secondary); }

/* =============================================
   Bootstrap Dark Overrides
   ============================================= */
.bg-dark { background-color:var(--dark-gray) !important; }
.bg-black { background-color:var(--black) !important; }
.text-white { color:var(--white) !important; }
.text-gold { color:var(--gold) !important; }
.text-muted { color:var(--text-muted) !important; }
.border-dark { border-color:var(--border-color) !important; }
.card { background:var(--dark-gray); border:1px solid var(--border-color); border-radius:var(--radius-md); }
.card-body { color:var(--text-secondary); }
.modal-content { background:var(--dark-gray); border:1px solid var(--border-color); color:var(--text-primary); }
.modal-header { border-bottom-color:var(--border-color); }
.modal-footer { border-top-color:var(--border-color); }
.btn-close { filter:invert(1); }

/* =============================================
   Toast / Flash Messages
   ============================================= */
.alert { border-radius:var(--radius-md); border:none; }
.alert-success { background:rgba(16,185,129,0.15); color:#10B981; border:1px solid rgba(16,185,129,0.3); }
.alert-danger { background:rgba(239,68,68,0.15); color:#EF4444; border:1px solid rgba(239,68,68,0.3); }
.alert-warning { background:rgba(245,158,11,0.15); color:#F59E0B; border:1px solid rgba(245,158,11,0.3); }
.alert-info { background:rgba(59,130,246,0.15); color:#3B82F6; border:1px solid rgba(59,130,246,0.3); }

/* =============================================
   Responsive
   ============================================= */
@media (max-width:991.98px) {
    .section { padding:60px 0; }
    .section-title { font-size:2rem; }
    .newsletter-wrapper { padding:32px; }
    .cta-wrapper { padding:40px 24px; }
}
@media (max-width:767.98px) {
    .section-padding { padding:60px 0; }
    .section-title { font-size:1.6rem; }
    .newsletter-popup { padding:32px 24px; }
}
@media (max-width:575.98px) {
    .hero-section { min-height:auto; padding-top:100px; padding-bottom:80px; }
    .value-props { grid-template-columns:1fr; }
    .blog-posts-grid { grid-template-columns:1fr; }
}

/* =============================================
   Subscribers Bar (Social Proof)
   ============================================= */
.subscribers-bar {
    background: linear-gradient(135deg, var(--dark-gray), var(--medium-gray));
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
    padding: 20px 0;
}
.subscribers-bar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}
.subscribers-bar-left {
    display: flex;
    align-items: center;
    gap: 14px;
}
.subscribers-avatars {
    display: flex;
    align-items: center;
}
.subscriber-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--white);
    border: 2px solid var(--dark-gray);
    margin-left: -8px;
}
.subscriber-avatar:first-child { margin-left: 0; }
.subscriber-avatar-more {
    background: var(--gold) !important;
    color: var(--black) !important;
    font-size: 0.7rem;
}
.subscribers-bar-text {
    font-size: 0.9rem;
    color: var(--text-secondary);
}
.subscribers-bar-text strong {
    color: var(--gold);
}
.subscribers-bar-names {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.subscriber-name-tag {
    background: rgba(212,175,55,0.1);
    border: 1px solid rgba(212,175,55,0.2);
    color: var(--gold);
    font-size: 0.75rem;
    padding: 3px 10px;
    border-radius: 20px;
    font-weight: 500;
}
@media (max-width: 767.98px) {
    .subscribers-bar-inner { flex-direction: column; align-items: flex-start; }
    .subscribers-bar-names { display: none; }
}

/* =============================================
   Animations
   ============================================= */
.fade-in { animation:fadeIn 0.6s ease-out; }
@keyframes fadeIn { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
@keyframes float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-15px); } }

/* Scrollbar */
::-webkit-scrollbar { width:8px; }
::-webkit-scrollbar-track { background:var(--dark-gray); }
::-webkit-scrollbar-thumb { background:rgba(212,175,55,0.4); border-radius:4px; }
::-webkit-scrollbar-thumb:hover { background:var(--gold); }

/* Print */
@media print { .navbar,.footer,.back-to-top,.newsletter-popup-overlay { display:none !important; } }

/* =============================================
   Auth-style form fields (contact, checkout)
   ============================================= */
.contact-form .input-wrapper,
#checkoutForm .input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}
.contact-form .input-wrapper i,
#checkoutForm .input-wrapper i {
    position: absolute;
    left: 14px;
    color: #bbb;
    font-size: 0.85rem;
    pointer-events: none;
    z-index: 2;
    transition: color 0.3s;
}
.contact-form .input-wrapper:focus-within i,
#checkoutForm .input-wrapper:focus-within i {
    color: var(--gold);
}
.contact-form .input-wrapper input,
.contact-form .input-wrapper select,
.contact-form .input-wrapper textarea,
#checkoutForm .input-wrapper input,
#checkoutForm .input-wrapper select,
#checkoutForm .input-wrapper textarea {
    width: 100%;
    padding: 11px 14px 11px 40px;
    background: #fff;
    border: 1.5px solid #d0d0d0;
    border-radius: 10px;
    color: #000;
    font-size: 0.88rem;
    font-family: var(--font-primary);
    transition: all 0.3s ease;
    outline: none;
}
.contact-form .input-wrapper input:focus,
.contact-form .input-wrapper select:focus,
.contact-form .input-wrapper textarea:focus,
#checkoutForm .input-wrapper input:focus,
#checkoutForm .input-wrapper select:focus,
#checkoutForm .input-wrapper textarea:focus {
    border-color: var(--gold);
    box-shadow: 0 0 0 4px rgba(212,175,55,0.15);
}
.contact-form .input-wrapper input::placeholder,
.contact-form .input-wrapper textarea::placeholder,
#checkoutForm .input-wrapper input::placeholder,
#checkoutForm .input-wrapper textarea::placeholder {
    color: #aaa;
}
.contact-form .input-wrapper select,
#checkoutForm .input-wrapper select {
    padding-right: 30px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23999' d='M6 8L1 3h10z'/%3E%3C/svg%3E") no-repeat right 12px center;
}
.contact-form .input-wrapper select option,
#checkoutForm .input-wrapper select option {
    background: #fff;
    color: #000;
}
.contact-form .input-wrapper textarea,
#checkoutForm .input-wrapper textarea {
    padding-top: 12px;
    resize: vertical;
    min-height: 100px;
}
.contact-form .input-wrapper textarea ~ i,
#checkoutForm .input-wrapper textarea ~ i {
    top: 14px;
    left: 14px;
    position: absolute;
}
.contact-form label,
#checkoutForm label {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: rgba(255,255,255,0.7);
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Misc utility */
.min-vh-75 { min-height:calc(100vh - 160px); }
.gap-3 { gap:1rem; }
.gap-4 { gap:1.5rem; }
.d-flex { display:flex; }
.flex-column { flex-direction:column; }
.align-items-center { align-items:center; }
.justify-content-center { justify-content:center; }
.justify-content-between { justify-content:space-between; }
.flex-wrap { flex-wrap:wrap; }
.mb-0 { margin-bottom:0; }
.mb-1 { margin-bottom:0.25rem; }
.mb-2 { margin-bottom:0.5rem; }
.mb-3 { margin-bottom:1rem; }
.mb-4 { margin-bottom:1.5rem; }
.mt-3 { margin-top:1rem; }
.mt-4 { margin-top:1.5rem; }
.me-2 { margin-right:0.5rem; }
.me-3 { margin-right:1rem; }
.ms-2 { margin-left:0.5rem; }
.p-0 { padding:0; }
.py-2 { padding-top:0.5rem; padding-bottom:0.5rem; }
.px-3 { padding-left:1rem; padding-right:1rem; }
.w-100 { width:100%; }
.text-center { text-align:center; }
.text-end { text-align:right; }
.fw-bold { font-weight:700; }
.fw-semibold { font-weight:600; }
.fs-sm { font-size:0.85rem; }
.rounded-circle { border-radius:50%; }
.object-fit-cover { object-fit:cover; }
.overflow-hidden { overflow:hidden; }
.position-relative { position:relative; }
.position-absolute { position:absolute; }
.fixed-top { position:fixed; top:0; width:100%; z-index:1030; }
.d-inline-block { display:inline-block; }
.d-none { display:none; }
.d-block { display:block; }
.d-inline { display:inline; }
@media (min-width:768px) { .d-md-block { display:block; } .d-md-none { display:none; } }
@media (max-width:767.98px) { .d-md-none { display:none !important; } }

/* =====================================================
   BLOG FIX - Paste at the END of style.css
   ===================================================== */

.blog-article{
    margin-bottom:40px !important;
    position:relative;
}

.blog-article-inner{
    display:flex !important;
    align-items:stretch;
    background:#1d1d1d;
    border:1px solid rgba(212,175,55,.15);
    border-radius:18px;
    overflow:hidden;
}

.blog-article-thumb{
    width:320px !important;
    min-width:320px;
    height:260px !important;
    position:relative;
    overflow:hidden;
    flex-shrink:0;
}

.blog-article-img-link{
    display:block;
    width:100%;
    height:100%;
}

.blog-img-wrap{
    width:100%;
    height:100%;
}

.blog-img-placeholder{
    width:100%;
    height:100%;
    min-height:260px;
    display:flex;
    justify-content:center;
    align-items:center;
    background:linear-gradient(135deg,#2f2606,#171717);
    position:relative;
}

.blog-img-pattern{
    position:absolute;
    inset:0;
}

.blog-article-category{
    position:absolute;
    top:15px;
    left:15px;
    z-index:10;
}

.blog-article-body{
    flex:1;
    display:flex;
    flex-direction:column;
    padding:30px;
}

.blog-article-title{
    margin:15px 0;
}

.blog-article-excerpt{
    margin-bottom:25px;
}

.blog-article-footer{
    margin-top:auto;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.blog-author{
    display:flex;
    align-items:center;
    gap:10px;
}

.blog-author-avatar{
    width:42px;
    height:42px;
    border-radius:50%;
    overflow:hidden;
    flex-shrink:0;
}

.blog-author-placeholder{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#D4AF37;
    color:#000;
    font-weight:bold;
}

.blog-read-more{
    white-space:nowrap;
}

@media(max-width:992px){

.blog-article-inner{
    flex-direction:column;
}

.blog-article-thumb{
    width:100% !important;
    min-width:100%;
    height:240px !important;
}

.blog-article-body{
    padding:25px;
}

.blog-article-footer{
    flex-direction:column;
    align-items:flex-start;
    gap:15px;
}

}

.blog-sidebar .card{
    margin-bottom:30px;
}/* =====================================================
   BLOG FIX - Paste at the END of style.css
   ===================================================== */

.blog-article{
    margin-bottom:40px !important;
    position:relative;
}

.blog-article-inner{
    display:flex !important;
    align-items:stretch;
    background:#1d1d1d;
    border:1px solid rgba(212,175,55,.15);
    border-radius:18px;
    overflow:hidden;
}

.blog-article-thumb{
    width:320px !important;
    min-width:320px;
    height:260px !important;
    position:relative;
    overflow:hidden;
    flex-shrink:0;
}

.blog-article-img-link{
    display:block;
    width:100%;
    height:100%;
}

.blog-img-wrap{
    width:100%;
    height:100%;
}

.blog-img-placeholder{
    width:100%;
    height:100%;
    min-height:260px;
    display:flex;
    justify-content:center;
    align-items:center;
    background:linear-gradient(135deg,#2f2606,#171717);
    position:relative;
}

.blog-img-pattern{
    position:absolute;
    inset:0;
}

.blog-article-category{
    position:absolute;
    top:15px;
    left:15px;
    z-index:10;
}

.blog-article-body{
    flex:1;
    display:flex;
    flex-direction:column;
    padding:30px;
}

.blog-article-title{
    margin:15px 0;
}

.blog-article-excerpt{
    margin-bottom:25px;
}

.blog-article-footer{
    margin-top:auto;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.blog-author{
    display:flex;
    align-items:center;
    gap:10px;
}

.blog-author-avatar{
    width:42px;
    height:42px;
    border-radius:50%;
    overflow:hidden;
    flex-shrink:0;
}

.blog-author-placeholder{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#D4AF37;
    color:#000;
    font-weight:bold;
}

.blog-read-more{
    white-space:nowrap;
}

@media(max-width:992px){

.blog-article-inner{
    flex-direction:column;
}

.blog-article-thumb{
    width:100% !important;
    min-width:100%;
    height:240px !important;
}

.blog-article-body{
    padding:25px;
}

.blog-article-footer{
    flex-direction:column;
    align-items:flex-start;
    gap:15px;
}

}

.blog-sidebar .card{
    margin-bottom:30px;
}
/* =============================================
   Admin Orders Page - Consolidated Layout
   ============================================= */
.admin-stats-bar {
    display:grid; grid-template-columns:repeat(4, 1fr);
    background:var(--dark-gray); border:1px solid var(--border-color);
    border-radius:var(--radius-md); overflow:hidden;
}
.admin-stat-segment {
    display:flex; align-items:center; gap:14px;
    padding:18px 24px; min-width:0;
}
.admin-stat-segment + .admin-stat-segment { border-left:1px solid var(--border-color); }
.stat-icon {
    width:46px; height:46px; min-width:46px; border-radius:12px;
    display:flex; align-items:center; justify-content:center; font-size:1.05rem;
}
.stat-icon-revenue { background:rgba(212,175,55,0.12); color:var(--gold); }
.stat-icon-orders-lg { background:rgba(59,130,246,0.12); color:#3B82F6; }
.stat-icon-pending { background:rgba(245,158,11,0.12); color:#F59E0B; }
.stat-icon-avg { background:rgba(16,185,129,0.12); color:#10B981; }
.stat-body { min-width:0; }
.stat-body h3 {
    margin:0; font-size:1.15rem; font-weight:700; color:var(--white);
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.stat-body p {
    margin:2px 0 0; font-size:0.72rem; color:var(--text-muted);
    text-transform:uppercase; letter-spacing:0.5px; font-weight:600;
}

/* Admin Orders Page - Toolbar */
.admin-table-toolbar {
    display:flex; align-items:flex-end; flex-wrap:wrap; gap:14px;
    padding:18px 24px; border-bottom:1px solid var(--border-color);
}
.admin-toolbar-group { display:flex; flex-direction:column; gap:6px; min-width:0; }
.admin-toolbar-group label {
    font-size:0.7rem; font-weight:600; text-transform:uppercase;
    letter-spacing:0.5px; color:var(--text-muted); margin:0;
}
.admin-toolbar-search { flex:1 1 240px; max-width:360px; }
.admin-toolbar-date { width:150px; }
.admin-search-wrap { position:relative; }
.admin-search-wrap i {
    position:absolute; left:12px; top:50%; transform:translateY(-50%);
    color:var(--text-muted); font-size:0.85rem; pointer-events:none;
}
.admin-search-wrap input { padding-left:34px; }
.admin-toolbar-actions { display:flex; align-items:center; gap:8px; padding-bottom:1px; }

/* Admin Orders Page - Status Filters */
.admin-status-filters { display:flex; flex-wrap:wrap; gap:8px; }

/* Admin Orders Page - Customer Cell */
.customer-cell { display:flex; align-items:center; gap:12px; min-width:0; }
.customer-avatar {
    width:38px; height:38px; min-width:38px; border-radius:50%;
    background:var(--gold); color:var(--black);
    display:flex; align-items:center; justify-content:center;
    font-weight:700; font-size:0.95rem;
}
.customer-avatar-guest {
    background:var(--medium-gray); color:var(--text-muted);
    border:1px dashed var(--border-color);
}
.customer-info { display:flex; flex-direction:column; min-width:0; }
.customer-name {
    color:var(--white); font-weight:600; font-size:0.88rem;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:200px;
}
.customer-name:hover { color:var(--gold); }
.customer-email {
    font-size:0.75rem; color:var(--text-muted);
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:200px;
}

/* Admin Orders Page - Order Number */
.orders-table .order-number a { color:var(--gold); }
.orders-table .order-number a:hover { text-decoration:underline; }
.orders-table .order-number a i { font-size:0.7rem; margin-right:4px; opacity:0.6; }

/* Admin Orders Page - Discount & Payment */
.order-discount {
    display:block; font-size:0.72rem; color:#10B981; font-weight:600; margin-top:2px;
}
.order-pay-method {
    display:block; font-size:0.72rem; color:var(--text-muted); margin-top:4px;
}
.order-pay-method i { margin-right:4px; }

/* Admin Orders Page - Date */
.order-date-rel { display:block; color:var(--text-secondary); font-weight:600; font-size:0.85rem; }
.orders-table .order-date small { display:block; margin-top:2px; font-size:0.72rem; }

/* Admin Orders Page - Color-coded Status Select */
.order-status-select[data-status="pending"] {
    background:#33290A !important; color:#F59E0B !important; border-color:rgba(245,158,11,0.4) !important;
}
.order-status-select[data-status="processing"] {
    background:rgba(59,130,246,0.15) !important; color:#7AB2FF !important; border-color:rgba(59,130,246,0.4) !important;
}
.order-status-select[data-status="completed"] {
    background:rgba(16,185,129,0.15) !important; color:#34D399 !important; border-color:rgba(16,185,129,0.4) !important;
}
.order-status-select[data-status="failed"] {
    background:rgba(239,68,68,0.15) !important; color:#F87171 !important; border-color:rgba(239,68,68,0.4) !important;
}
.order-status-select[data-status="refunded"] {
    background:rgba(168,85,247,0.15) !important; color:#C084FC !important; border-color:rgba(168,85,247,0.4) !important;
}
.order-status-select[data-status="cancelled"] {
    background:rgba(148,163,184,0.12) !important; color:#94A3B8 !important; border-color:rgba(148,163,184,0.4) !important;
}

/* Admin Orders Page - Table min width */
.orders-table .dashboard-table { min-width:920px; }

/* Admin Orders Page - Empty State */
.admin-empty-icon {
    width:64px; height:64px; margin:0 auto 16px; border-radius:50%;
    background:var(--medium-gray); border:1px solid var(--border-color);
    display:flex; align-items:center; justify-content:center;
    font-size:1.5rem; color:var(--text-muted);
}

/* Admin Orders Page - Pagination */
.admin-pagination {
    display:flex; align-items:center; justify-content:space-between;
    flex-wrap:wrap; gap:12px; padding:0 4px;
}
.admin-pagination-info { font-size:0.85rem; color:var(--text-muted); }
.admin-pagination .pagination { gap:4px; }
.admin-pagination .page-link {
    background:var(--dark-gray); border:1px solid var(--border-color);
    color:var(--text-secondary); font-size:0.85rem; min-width:36px;
    text-align:center; padding:6px 12px;
}
.admin-pagination .page-link:hover { border-color:var(--gold); color:var(--gold); background:var(--dark-gray); }
.admin-pagination .page-item.active .page-link {
    background:var(--gold); border-color:var(--gold); color:var(--black); font-weight:700;
}
.admin-pagination .page-item.disabled .page-link {
    background:transparent; border-color:var(--border-color); color:var(--text-muted);
}

/* Admin Orders Page - Toast */
.admin-toast {
    position:fixed; top:24px; right:24px; z-index:2000;
    display:flex; align-items:center; gap:12px;
    min-width:320px; max-width:420px;
    background:var(--dark-gray); border:1px solid var(--border-color);
    border-radius:12px; padding:14px 16px;
    box-shadow:0 12px 40px rgba(0,0,0,0.5);
    opacity:0; transform:translateY(-16px); pointer-events:none;
    transition:opacity 0.25s ease, transform 0.25s ease;
}
.admin-toast.show { opacity:1; transform:translateY(0); pointer-events:auto; }
.admin-toast-icon {
    width:38px; height:38px; min-width:38px; border-radius:50%;
    display:flex; align-items:center; justify-content:center; font-size:0.95rem;
}
.admin-toast.success .admin-toast-icon { background:rgba(16,185,129,0.15); color:#10B981; }
.admin-toast.error .admin-toast-icon { background:rgba(239,68,68,0.15); color:#EF4444; }
.admin-toast.success { border-color:rgba(16,185,129,0.4); }
.admin-toast.error { border-color:rgba(239,68,68,0.4); }
.admin-toast-body { display:flex; flex-direction:column; flex:1; min-width:0; }
.admin-toast-title { color:var(--white); font-size:0.9rem; }
.admin-toast-msg { color:var(--text-muted); font-size:0.8rem; }
.admin-toast-close {
    background:none; border:none; color:var(--text-muted); font-size:0.9rem;
    cursor:pointer; padding:4px; transition:var(--transition);
}
.admin-toast-close:hover { color:var(--white); }

/* Admin Orders Page - Responsive */
@media (max-width:991.98px) {
    .admin-stats-bar { grid-template-columns:repeat(2, 1fr); }
    .admin-stat-segment + .admin-stat-segment { border-left:none; }
    .admin-stat-segment:nth-child(3),
    .admin-stat-segment:nth-child(4) { border-top:1px solid var(--border-color); }
}
@media (max-width:767.98px) {
    .admin-toolbar-search { max-width:none; flex-basis:100%; }
    .admin-toolbar-date { flex:1 1 130px; width:auto; }
    .admin-toolbar-actions { flex-basis:100%; }
    .admin-pagination { justify-content:center; }
    .admin-toast { top:16px; right:16px; left:16px; min-width:0; max-width:none; }
}
@media (max-width:575.98px) {
    .admin-stat-segment { padding:14px 16px; }
    .stat-icon { width:40px; height:40px; min-width:40px; font-size:0.95rem; }
    .stat-body h3 { font-size:1rem; }
}
/* =========================================================
   NUGGETSABODE NAVBAR
   Image-inspired layout
========================================================= */

:root {
    --navbar-height: 72px;
    --logo-size: 125px;
    --gold: #c6a15b;
    --gold-light: #d9bb7a;
    --black: #080808;
    --white: #ffffff;
}


/* =========================================================
   NUGGETSABODE LOGO
   BLACK INTERIOR + OVERLAPPING NAVBAR
========================================================= */

.navbar-logo {
    position: absolute;

    left: 40px;
    top: 10px;

    width: 135px;
    height: 135px;

    /* THIS IS THE IMPORTANT PART */
    background: #000000;

    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

    z-index: 9999;

    text-decoration: none;

    /* Makes the logo appear above the navbar/body */
    isolation: isolate;

    box-shadow:
        0 4px 12px rgba(0, 0, 0, 0.25);
}


/* Logo image itself */
.navbar-logo img {
    position: relative;

    width: 100%;
    height: 100%;

    object-fit: contain;

    display: block;

    transform: rotate(990deg);

    z-index: 2;

    /* IMPORTANT:
       Do NOT use opacity */
    opacity: 1;

    /* Prevents unwanted image spacing */
    margin: 0;
    padding: 0;
}


/* =========================================================
   EXTRA BLACK BACKGROUND BEHIND TRANSPARENT PNG
========================================================= */

.navbar-logo::before {
    content: "";

    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    background: #000000;

    border-radius: 50%;

    z-index: 1;
}


/* Keep image above black background */
.navbar-logo img {
    position: relative;
    z-index: 2;
}


/* =========================================================
   DESKTOP NAVBAR
========================================================= */

.nuggets-navbar {
    position: fixed;

    top: 0;
    left: 0;
    right: 0;

    height: 72px;
    min-height: 72px;

    background: #ffffff !important;

    z-index: 1050;

    border: none;

    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);

    padding: 0;
}


/* Keep navbar content away from logo */
.navbar-container {
    height: 72px;

    padding-left: 200px;
    padding-right: 40px;

    display: flex;
    align-items: center;
}


/* =========================================================
   IMPORTANT:
   MAKE THE LOGO CROSS THE NAVBAR/BODY BOUNDARY
========================================================= */

.navbar-logo {
    top: 8px;
}


/* =========================================================
   BRAND (visible on all viewports — inline with nav on desktop, shown in mobile toggle too)
========================================================= */

.mobile-brand {
    display: flex !important;
    align-items: center;
    color: #222222 !important;
    font-family: var(--font-heading);
    font-size: 1.25rem;
    text-decoration: none;
    gap: 6px;
}

.mobile-brand b {
    color: var(--gold);
}


/* =========================================================
   NAVIGATION AREA
========================================================= */

#navbarContent {
    height: 100%;

    display: flex;
    align-items: center;

    justify-content: space-between;
}


/* =========================================================
   MAIN NAV LINKS
========================================================= */

.navbar-main-links {
    margin: 0 auto;

    display: flex;
    align-items: center;

    gap: 3px;
}


.navbar-main-links .nav-item {
    display: flex;
    align-items: center;
}


.navbar-main-links .nav-link {
    position: relative;

    padding: 8px 10px !important;

    color: #333333 !important;

    font-size: 1rem;
    font-weight: 500;

    text-transform: uppercase;
    letter-spacing: 1px;

    transition:
        color 0.25s ease,
        background 0.25s ease;
}


.navbar-main-links .nav-link:hover {
    color: var(--gold) !important;
}


/* Active underline */

.navbar-main-links .nav-link::after {
    content: "";

    position: absolute;

    left: 10px;
    right: 10px;

    bottom: 1px;

    height: 2px;

    background: var(--gold);

    transform: scaleX(0);

    transform-origin: center;

    transition: transform 0.25s ease;
}


.navbar-main-links .nav-link:hover::after,
.navbar-main-links .nav-link.active::after {
    transform: scaleX(1);
}


/* =========================================================
   RIGHT SIDE
========================================================= */

.navbar-right {
    display: flex;

    align-items: center;

    gap: 12px;

    white-space: nowrap;
}


/* =========================================================
   SEARCH BUTTON
========================================================= */

.nav-search-btn,
.nav-cart-btn {
    width: 30px;
    height: 34px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    border: none;
    background: transparent;

    color: #555555;

    text-decoration: none;

    font-size: 12px;

    cursor: pointer;

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}


.nav-search-btn:hover,
.nav-cart-btn:hover {
    color: var(--gold);

    transform: translateY(-1px);
}


/* =========================================================
   CART BADGE
========================================================= */

.cart-badge {
    position: absolute;

    top: -2px;
    right: -4px;

    min-width: 15px;
    height: 15px;

    padding: 0 4px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: var(--gold);

    color: #ffffff;

    font-size: 8px;
    font-weight: 700;
}


/* =========================================================
   LOGIN
========================================================= */

.nav-login {
    color: #333333;

    text-decoration: none;

    font-size: 12px;
    font-weight: 500;

    transition: color 0.25s ease;
}


.nav-login:hover {
    color: var(--gold);
}


/* =========================================================
   BOOK CONSULTATION BUTTON
   Similar to button in your image
========================================================= */

.nav-consultation {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-height: 32px;

    padding: 7px 15px;

    border-radius: 4px;

    background: var(--gold);

    color: #ffffff !important;

    text-decoration: none;

    font-size: 10px;
    font-weight: 600;

    letter-spacing: 0.1px;

    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.10);

    transition:
        background 0.25s ease,
        transform 0.25s ease,
        box-shadow 0.25s ease;
}


.nav-consultation:hover {
    background: #a98748;

    color: #ffffff !important;

    transform: translateY(-1px);

    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}


/* =========================================================
   USER BUTTON
========================================================= */

.user-button {
    display: flex;

    align-items: center;

    border: none;

    background: transparent;

    color: #333333;

    font-size: 12px;

    padding: 3px 5px;

    cursor: pointer;
}


.user-button::after {
    margin-left: 5px;
}


.user-name {
    color: #444444;
}


.user-avatar-sm,
.user-avatar-placeholder-sm {
    width: 30px;
    height: 30px;

    border-radius: 50%;

    object-fit: cover;

    display: inline-flex;

    align-items: center;
    justify-content: center;
}


.user-avatar-placeholder-sm {
    background: var(--gold);

    color: #ffffff;

    font-size: 12px;
    font-weight: 700;
}


/* =========================================================
   DROPDOWN
========================================================= */

.user-dropdown .dropdown-menu {
    margin-top: 12px;

    background: #ffffff;

    border: 1px solid rgba(0, 0, 0, 0.08);

    border-radius: 8px;

    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);

    padding: 8px;
}


.user-dropdown .dropdown-item {
    border-radius: 5px;

    padding: 9px 12px;

    font-size: 13px;

    color: #000000;
}


.user-dropdown .dropdown-item:hover {
    background: rgba(198, 161, 91, 0.10);

    color: var(--gold);
}


/* =========================================================
   SEARCH MODAL
========================================================= */

.search-modal {
    overflow: hidden;

    border: none;

    border-radius: 12px;

    background: #111111;

    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
}


.search-form-lg {
    background: #1b1b1b;
}


.search-form-lg .input-group {
    min-height: 65px;
}


.search-form-lg .input-group-text {
    border: none;

    background: transparent;

    color: var(--gold);

    padding-left: 22px;
}


.search-form-lg .form-control {
    border: none;

    background: transparent;

    color: #ffffff;

    box-shadow: none;

    font-size: 15px;
}


.search-form-lg .form-control::placeholder {
    color: #888888;
}


.search-submit {
    border: none;

    padding: 0 25px;

    background: var(--gold);

    color: #ffffff;

    font-weight: 600;
}


.search-submit:hover {
    background: #a98748;

    color: #ffffff;
}


.search-suggestions {
    background: #111111;
}


.search-suggestions p {
    color: #888888;
}


.search-tag {
    display: inline-block;

    padding: 7px 12px;

    border: 1px solid rgba(198, 161, 91, 0.35);

    border-radius: 20px;

    color: var(--gold);

    text-decoration: none;

    font-size: 12px;

    transition: all 0.25s ease;
}


.search-tag:hover {
    background: var(--gold);

    color: #ffffff;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 1199px) {

    .navbar-container {
        padding-left: 180px;
        padding-right: 25px;
    }

    .navbar-logo {
        left: 30px;

        width: 120px;
        height: 120px;

        top: 8px;
    }

    .navbar-main-links {
        gap: 0;
    }

    .navbar-main-links .nav-link {
        padding-left: 7px !important;
        padding-right: 7px !important;

        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .nav-consultation {
        padding: 6px 11px;
        font-size: 9px;
    }
}


/* =========================================================
   TABLET / MOBILE
========================================================= */

@media (max-width: 991.98px) {

    .nuggets-navbar {
        height: 70px;
        min-height: 70px;
    }


    .navbar-container {
        padding-left: 150px;
        padding-right: 20px;
    }


    /* Logo remains overlapping */
    .navbar-logo {
        left: 20px;

        top: 8px;

        width: 115px;
        height: 115px;
    }


    .mobile-brand {
        display: flex !important;
        align-items: center;
        color: #222222 !important;

        font-size: 18px;
        font-weight: 600;

        text-decoration: none;
    }


    .mobile-brand b {
        color: var(--gold);
    }


    .navbar-toggler {
        border: none !important;

        box-shadow: none !important;

        padding: 8px;
    }


    .navbar-toggler i {
        color: var(--gold);

        font-size: 22px;
    }


    #navbarContent {
        position: absolute;

        top: 70px;

        left: 0;
        right: 0;

        height: auto;

        padding: 15px 20px 20px;

        background: #ffffff;

        box-shadow: 0 10px 20px rgba(0, 0, 0, 0.10);

        display: block;
    }


    .navbar-main-links {
        display: block;

        margin: 0;
    }


    .navbar-main-links .nav-item {
        display: block;
    }


    .navbar-main-links .nav-link {
        display: block;

        padding: 11px 5px !important;

        font-size: 14px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }


    .navbar-main-links .nav-link::after {
        display: none;
    }


    .navbar-right {
        margin-top: 12px;

        padding-top: 15px;

        border-top: 1px solid #eeeeee;

        justify-content: flex-start;

        flex-wrap: wrap;
    }

}


/* =========================================================
   SMALL PHONES
========================================================= */

@media (max-width: 575.98px) {

    .navbar-container {
        padding-left: 120px;

        padding-right: 12px;
    }


    .navbar-logo {
        left: 12px;

        top: 10px;

        width: 95px;
        height: 95px;
    }


    .mobile-brand {
        font-size: 15px;
    }


    .navbar-toggler i {
        font-size: 19px;
    }


    #navbarContent {
        top: 70px;
    }

}
/* =========================================================
   NUGGETSABODE - ORDERS PAGE FINAL LAYOUT FIX
   ========================================================= */

/* Stop the orders page from inheriting bad widths */
.admin-content,
.admin-main,
.admin-main-content,
.dashboard-content,
.dashboard-main,
.content-wrapper,
.page-content {
    min-width: 0 !important;
}

/* Main orders area */
.orders-page,
.orders-card,
.orders-stats,
.orders-toolbar,
.orders-table-wrapper {
    box-sizing: border-box !important;
}

/* Prevent the page from pushing outside the screen */
.orders-page {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: visible !important;
}

/* =========================================================
   HEADER
   ========================================================= */

.orders-page-header {
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 20px !important;
    margin-bottom: 24px !important;
}

.orders-page-title {
    min-width: 0 !important;
}

.orders-page-title h2 {
    margin: 0 !important;
    font-size: 30px !important;
    line-height: 1.2 !important;
    color: #ffffff !important;
}

.orders-page-title p {
    margin: 7px 0 0 !important;
    color: #888 !important;
}

/* =========================================================
   STATS
   ========================================================= */

.orders-stats {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    background: #1e1e1e !important;
    border: 1px solid #353535 !important;
    border-radius: 9px !important;
    overflow: hidden !important;
    margin-bottom: 24px !important;
}

.orders-stat {
    min-width: 0 !important;
    min-height: 80px !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 16px 20px !important;
    border-right: 1px solid #363636 !important;
}

.orders-stat:last-child {
    border-right: none !important;
}

.orders-stat-icon {
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;
}

.orders-stat-content {
    min-width: 0 !important;
}

.orders-stat-content h3 {
    margin: 0 !important;
    white-space: nowrap !important;
    font-size: 18px !important;
}

.orders-stat-content p {
    margin: 3px 0 0 !important;
    white-space: nowrap !important;
}

/* =========================================================
   FILTER BUTTONS
   ========================================================= */

.orders-filters {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-bottom: 22px !important;
}

.orders-filter {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
}

/* =========================================================
   ORDERS CARD
   ========================================================= */

.orders-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    background: #1d1d1d !important;
    border: 1px solid #363636 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
}

/* =========================================================
   SEARCH BAR
   ========================================================= */

.orders-toolbar {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 150px 150px auto !important;
    gap: 12px !important;
    padding: 18px !important;
    box-sizing: border-box !important;
}

.orders-field {
    min-width: 0 !important;
}

.orders-input {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.orders-toolbar-actions {
    display: flex !important;
    align-items: end !important;
    gap: 7px !important;
}

/* =========================================================
   TABLE
   ========================================================= */

.orders-table-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;

    -webkit-overflow-scrolling: touch !important;
}

.orders-table {
    width: 100% !important;
    min-width: 1100px !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
}

/* IMPORTANT:
   These widths prevent columns from crushing each other.
*/

.orders-table th:nth-child(1),
.orders-table td:nth-child(1) {
    width: 11% !important;
}

.orders-table th:nth-child(2),
.orders-table td:nth-child(2) {
    width: 23% !important;
}

.orders-table th:nth-child(3),
.orders-table td:nth-child(3) {
    width: 10% !important;
}

.orders-table th:nth-child(4),
.orders-table td:nth-child(4) {
    width: 10% !important;
}

.orders-table th:nth-child(5),
.orders-table td:nth-child(5) {
    width: 13% !important;
}

.orders-table th:nth-child(6),
.orders-table td:nth-child(6) {
    width: 13% !important;
}

.orders-table th:nth-child(7),
.orders-table td:nth-child(7) {
    width: 11% !important;
}

.orders-table th:nth-child(8),
.orders-table td:nth-child(8) {
    width: 9% !important;
}

.orders-table th {
    height: 48px !important;
    padding: 0 14px !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
}

.orders-table td {
    padding: 17px 14px !important;
    vertical-align: middle !important;
}

/* =========================================================
   CUSTOMER
   ========================================================= */

.customer-cell {
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.customer-avatar {
    flex: 0 0 40px !important;
}

.customer-info {
    min-width: 0 !important;
    overflow: hidden !important;
}

.customer-name,
.customer-email {
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* =========================================================
   PAYMENT
   ========================================================= */

.order-pay-method {
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* =========================================================
   STATUS
   ========================================================= */

.order-status-select {
    width: 100% !important;
    min-width: 105px !important;
    max-width: 150px !important;
    box-sizing: border-box !important;
}

/* =========================================================
   DATE
   ========================================================= */

.order-date {
    white-space: normal !important;
}

.order-date-rel {
    white-space: nowrap !important;
}

/* =========================================================
   ACTION BUTTONS
   ========================================================= */

.order-actions {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    white-space: nowrap !important;
}

.order-action-btn {
    flex: 0 0 34px !important;
}

/* =========================================================
   DESKTOP ADMIN SIDEBAR FIX
   ========================================================= */

@media (min-width: 992px) {

    /*
       If your sidebar is 260px wide, the content must
       have enough room beside it.
    */

    .admin-main,
    .admin-content,
    .dashboard-content,
    .dashboard-main {
        min-width: 0 !important;
    }
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

    .orders-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .orders-stat {
        border-bottom: 1px solid #363636 !important;
    }

    .orders-stat:nth-child(2),
    .orders-stat:nth-child(4) {
        border-right: none !important;
    }

    .orders-toolbar {
        grid-template-columns: minmax(0, 1fr) 150px 150px !important;
    }

    .orders-toolbar-actions {
        grid-column: 1 / -1 !important;
    }
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .orders-page {
        padding: 12px !important;
    }

    .orders-page-header {
        align-items: flex-start !important;
        flex-direction: column !important;
    }

    .orders-refresh-btn {
        width: 100% !important;
    }

    .orders-stats {
        grid-template-columns: 1fr !important;
    }

    .orders-stat {
        border-right: none !important;
        border-bottom: 1px solid #363636 !important;
    }

    .orders-stat:last-child {
        border-bottom: none !important;
    }

    .orders-filters {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        padding-bottom: 5px !important;
    }

    .orders-toolbar {
        grid-template-columns: 1fr !important;
    }

    .orders-toolbar-actions {
        grid-column: auto !important;
        width: 100% !important;
    }

    .orders-filter-submit {
        flex: 1 !important;
    }

    .orders-table {
        min-width: 1100px !important;
    }
}