/* ===== RESELLER THEME CSS ===== */
/* A clean hosting-shop front page in shades of green: a light hero, solid
   colours, thin borders, and nothing that floats or glows except the hero
   animation. Colours come from theme.json through the --theme-* variables,
   so the Appearance colour settings still apply. */

/* Buttons: solid, no lift */
.btn-primary, .btn-accent, .btn-outline, .hero__btn--ghost,
.plan-card__btn, .domain-search__btn, .hosting-plans__promo-btn, .vps-card__btn {
    border-radius: 8px !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
}
.btn-accent { background: var(--theme-welcome-accent, #16a34a) !important; }
.btn-accent:hover { background: var(--theme-welcome-accent-dark, #128a3e) !important; }
.btn-primary:hover, .plan-card__btn--primary:hover { background: var(--theme-primary-dark, #0a5c38) !important; }

/* Navigation: one solid dark-green bar */
.main-nav { border-bottom: 0 !important; }
.main-nav.scrolled { box-shadow: 0 2px 10px rgba(0,0,0,0.15) !important; }
.main-nav__brand-dot, .footer__brand-dot { display: none !important; }
.main-nav__dropdown, .main-nav__mega { border-radius: 8px !important; box-shadow: 0 10px 28px rgba(13,33,25,0.15) !important; }
.main-nav__mega-promo { background: var(--theme-primary, #0f7a4b) !important; border-radius: 8px !important; }
.main-nav__login { border-radius: 8px !important; }
.main-nav__login:hover { background: var(--theme-welcome-accent, #16a34a) !important; border-color: var(--theme-welcome-accent, #16a34a) !important; }
.top-bar { background: #072b1f !important; border-bottom: 0 !important; }

/* Hero: light mint, dark text */
.hero {
    background:
        radial-gradient(900px 420px at 85% 10%, rgba(22,163,74,0.10), transparent 70%),
        linear-gradient(180deg, #eef8f2 0%, #f8fbf9 100%) !important;
    border-bottom: 1px solid var(--theme-border-color, #dfe7e2);
}
.hero__badge { background: var(--theme-primary-light, #e9f7ef) !important; color: var(--theme-primary, #0f7a4b) !important; border: 1px solid rgba(15,122,75,0.15); }
.hero__title { color: var(--theme-heading-color, #0d2119) !important; }
.hero__title span { color: var(--theme-welcome-accent, #16a34a) !important; }
.hero__title-sub { color: var(--theme-text-color, #1c2b24) !important; }
.hero__desc { color: var(--theme-muted-color, #5d6f66) !important; }
.hero__points li { color: var(--theme-text-color, #1c2b24) !important; }
.hero__btn--ghost { color: var(--theme-heading-color, #0d2119) !important; border-color: var(--theme-border-color, #dfe7e2) !important; background: #fff !important; }
.hero__btn--ghost:hover { border-color: var(--theme-primary, #0f7a4b) !important; color: var(--theme-primary, #0f7a4b) !important; }
.hv { box-shadow: 0 24px 60px rgba(13,33,25,0.12) !important; }

/* Sections alternate white and light grey-green */
.domain-search, .infra, .testimonials { background: var(--theme-card-bg, #fff) !important; }
.hosting-plans, .vps, .faq { background: var(--theme-body-bg, #f5f8f6) !important; }
.section-title { font-size: 32px !important; font-weight: 800 !important; color: var(--theme-heading-color, #0d2119) !important; }

/* Domain search and extension prices */
.domain-search__bar { border-radius: 8px !important; box-shadow: none !important; border-width: 1px !important; }
.domain-search__btn { border-radius: 0 !important; background: var(--theme-welcome-accent, #16a34a) !important; }
.domain-search__extensions { flex-wrap: wrap; justify-content: center; overflow: visible !important; }
.domain-search__ext { border-radius: 8px !important; }
.domain-search__ext:hover { transform: none !important; box-shadow: none !important; border-color: var(--theme-welcome-accent, #16a34a) !important; }
.domain-search__ext-price { color: var(--theme-text-color, #1c2b24) !important; }
.domain-search__ext-link { color: var(--theme-primary, #0f7a4b) !important; }

/* Cards: white, thin border, no lift */
.plan-card, .infra-card, .testimonial-card, .vps-card, .faq__item {
    border-radius: 10px !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: var(--theme-card-bg, #fff) !important;
}
.plan-card:hover, .infra-card:hover, .testimonial-card:hover, .vps-card:hover, .faq__item:hover {
    transform: none !important;
    box-shadow: 0 6px 18px var(--theme-card-shadow, rgba(13,33,25,0.06)) !important;
}
.plan-card--popular { border: 2px solid var(--theme-welcome-accent, #16a34a) !important; }
.plan-card__badge { background: var(--theme-welcome-accent, #16a34a) !important; }
.plan-card__icon { display: none !important; }
.plan-card__feature i { color: var(--theme-welcome-accent, #16a34a) !important; }
.plan-card__btn--primary { background: var(--theme-welcome-accent, #16a34a) !important; }
.plan-card__btn--primary:hover { background: var(--theme-welcome-accent-dark, #128a3e) !important; }
.hosting-plans__promo { background: var(--theme-primary, #0f7a4b) !important; border-radius: 10px !important; }

/* Feature cards: one icon colour */
.infra-card__icon { border-radius: 8px !important; background: var(--theme-primary-light, #e9f7ef) !important; color: var(--theme-primary, #0f7a4b) !important; }

/* Offers and figures */
.promo-card { border-radius: 10px !important; background: var(--theme-primary, #0f7a4b) !important; }
.promo-card:nth-child(even) { background: var(--theme-nav-bg, #0b3d2c) !important; }
.promo-card::after { display: none !important; }
.promo-card:hover { transform: none !important; }
.stats, .cta-banner { background: var(--theme-nav-bg, #0b3d2c) !important; }
.stats::before, .cta-banner::before { display: none !important; }
.stats__number span { color: #4ade80 !important; }
.testimonial-card__text { font-style: normal !important; }

/* Footer */
.footer { background: var(--theme-footer-bg, #08261b) !important; }
.footer__contact-item i { color: #4ade80 !important; }

/* Dark mode: the hero goes dark with the rest */
:root[data-theme="dark"] .hero { background: var(--theme-body-bg, #0c1612) !important; border-bottom-color: var(--theme-border-color) !important; }
:root[data-theme="dark"] .hero__badge { background: rgba(22,163,74,0.15) !important; color: #4ade80 !important; }
:root[data-theme="dark"] .hero__btn--ghost { background: transparent !important; }
:root[data-theme="dark"] .domain-search,
:root[data-theme="dark"] .infra,
:root[data-theme="dark"] .testimonials { background: var(--theme-card-bg) !important; }
