/* ============================================
   HiStudy Custom Overrides — Dynamic Colors
   All colors use CSS variables from :root
   ============================================ */

/* ===== HEADER ===== */
.rbt-header-wrapper {
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    background: rgba(255,255,255,.95) !important;
    border-bottom: 1px solid rgba(0,0,0,.06) !important;
    box-shadow: none !important;
}
.rbt-header .mainmenu > li > a {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--c-text) !important;
    padding: 8px 16px !important;
    border-radius: 8px;
    transition: all .2s;
}
.rbt-header .mainmenu > li > a:hover,
.rbt-header .mainmenu > li > a.active {
    color: var(--c-primary) !important;
    background: var(--c-primary-light);
}
/* Header Buttons */
.rbt-header .rbt-btn.btn-gradient {
    background: var(--c-primary) !important;
    border-radius: 10px !important;
    padding: 8px 22px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.08);
}
.rbt-header .rbt-btn.btn-gradient:hover {
    background: var(--c-primary-hover) !important;
    box-shadow: 0 4px 14px rgba(0,0,0,.12);
}
.rbt-header .rbt-btn.btn-border-gradient {
    border: 1.5px solid var(--c-primary) !important;
    color: var(--c-primary) !important;
    border-radius: 10px !important;
    padding: 7px 22px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    background: transparent !important;
}
.rbt-header .rbt-btn.btn-border-gradient:hover {
    background: var(--c-primary) !important;
    color: #fff !important;
}
/* Cart / Round Buttons */
.rbt-header .rbt-round-btn {
    width: 42px; height: 42px;
    border-radius: 10px !important;
    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
    transition: all .2s;
    display: flex !important; align-items: center; justify-content: center;
}
.rbt-header .rbt-round-btn:hover {
    background: var(--c-primary-light) !important;
    border-color: var(--c-primary) !important;
    color: var(--c-primary) !important;
}
/* User Dropdown */
.rbt-user-menu-list-wrapper {
    border-radius: 14px !important;
    box-shadow: 0 12px 48px rgba(0,0,0,.12) !important;
    border: 1px solid #e5e7eb !important;
    overflow: hidden;
}
.rbt-user-menu-list-wrapper .user-list-wrapper li a {
    padding: 9px 18px !important;
    border-radius: 8px;
    margin: 2px 8px;
    font-size: 13px;
    transition: background .15s;
}
.rbt-user-menu-list-wrapper .user-list-wrapper li a:hover {
    background: var(--c-primary-light);
    color: var(--c-primary);
}
/* Logo */
.rbt-header .logo span {
    color: var(--c-primary) !important;
}

/* ===== GLOBAL BUTTONS ===== */
.rbt-btn { border-radius: 10px !important; font-weight: 600 !important; transition: all .2s !important; }
.rbt-btn.btn-gradient {
    background: linear-gradient(135deg, var(--c-gradient-from), var(--c-gradient-to)) !important;
    border: none !important;
}
.rbt-btn.btn-gradient:hover {
    box-shadow: 0 6px 20px rgba(79,70,229,.25) !important;
    transform: translateY(-2px);
}
.rbt-btn.btn-border-gradient {
    border: 1.5px solid var(--c-primary) !important;
    color: var(--c-primary) !important;
    background: transparent !important;
}
.rbt-btn.btn-border-gradient:hover {
    background: var(--c-primary) !important;
    color: #fff !important;
}

/* ===== COURSE CARDS ===== */
.rbt-card {
    border-radius: 16px !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: none !important;
    transition: all .3s cubic-bezier(.4,0,.2,1) !important;
    overflow: hidden;
}
.rbt-card:hover {
    box-shadow: 0 12px 40px rgba(0,0,0,.08) !important;
    transform: translateY(-6px);
    border-color: transparent !important;
}
.rbt-card .rbt-card-img { overflow: hidden; }
.rbt-card .rbt-card-img img { transition: transform .5s cubic-bezier(.4,0,.2,1); }
.rbt-card:hover .rbt-card-img img { transform: scale(1.08); }
.rbt-card .rbt-card-body { padding: 20px !important; }
.rbt-card .rbt-card-title { font-size: 15px !important; font-weight: 700 !important; line-height: 1.5 !important; }
.rbt-card .rbt-card-title a { color: var(--c-dark) !important; transition: color .2s; }
.rbt-card .rbt-card-title a:hover { color: var(--c-primary) !important; }
.rbt-card .rbt-price .current-price { font-weight: 800 !important; color: var(--c-primary) !important; }
.rbt-card .rbt-card-bottom { padding-top: 14px !important; border-top: 1px solid #f1f5f9 !important; margin-top: 14px !important; }

/* ===== HERO ===== */
.rbt-banner-1 .title { font-size: 2.6rem !important; font-weight: 800 !important; line-height: 1.3 !important; color: var(--c-dark) !important; }
.rbt-banner-1 .description { font-size: 15px !important; color: #64748b !important; line-height: 1.9 !important; }
.rbt-new-badge { border-radius: 24px !important; font-size: 13px !important; font-weight: 600 !important; }

/* ===== SECTION TITLES ===== */
.section-title .subtitle { font-size: 12px !important; font-weight: 700 !important; letter-spacing: 1px !important; border-radius: 8px !important; }
.section-title .title { font-size: 1.6rem !important; font-weight: 800 !important; color: var(--c-dark) !important; }

/* ===== COURSE DETAIL ===== */
.rbt-course-details-area .rbt-shadow-box,
.rbt-course-feature-box {
    border-radius: 16px !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.04) !important;
}
.rbt-accordion-style .accordion-item { border-radius: 12px !important; margin-bottom: 8px !important; border: 1px solid #e5e7eb !important; overflow: hidden; }
.rbt-accordion-style .accordion-button { font-weight: 600 !important; font-size: 14px !important; }
.rbt-accordion-style .accordion-button:not(.collapsed) { background: var(--c-primary-light) !important; color: var(--c-primary) !important; }

/* ===== BREADCRUMBS ===== */
.rbt-breadcrumb-default { padding: 50px 0 !important; }
.rbt-breadcrumb-default .title { font-size: 1.8rem !important; font-weight: 800 !important; }
.bg-gradient-1 { background: linear-gradient(135deg, var(--c-gradient-from), var(--c-gradient-to)) !important; }

/* ===== FOOTER ===== */
.rbt-footer .ft-title { font-size: 15px !important; font-weight: 700 !important; color: var(--c-dark) !important; }
.rbt-footer .ft-link li a { font-size: 13px !important; color: #64748b !important; transition: color .2s; }
.rbt-footer .ft-link li a:hover { color: var(--c-primary) !important; }
.rbt-footer .social-icon li a {
    width: 40px !important; height: 40px !important;
    border-radius: 10px !important;
    background: #f1f5f9 !important;
    display: flex !important; align-items: center; justify-content: center;
    transition: all .2s;
    font-size: 16px !important;
}
.rbt-footer .social-icon li a:hover { background: var(--c-primary) !important; color: #fff !important; }
.rbt-footer .footer-bottom { border-top: 1px solid #e2e8f0; }
.rbt-footer .footer-bottom p { font-size: 13px; color: #94a3b8; }
.rbt-newsletter input { border-radius: 10px !important; border: 1.5px solid #e5e7eb !important; }
.rbt-newsletter .rbt-btn { border-radius: 10px !important; }

/* ===== FILTERS ===== */
.rbt-modern-select select { border-radius: 10px !important; border: 1.5px solid #e5e7eb !important; padding: 8px 14px !important; font-size: 13px !important; }
.rbt-modern-select select:focus { border-color: var(--c-primary) !important; box-shadow: 0 0 0 3px rgba(79,70,229,.08) !important; }
.rbt-search-style input { border-radius: 10px !important; border: 1.5px solid #e5e7eb !important; }
.select-label { font-size: 11px !important; font-weight: 600 !important; color: #64748b !important; }

/* ===== CATEGORIES ===== */
.rbt-cat-box-1 { border-radius: 14px !important; border: 1px solid #e5e7eb !important; transition: all .3s !important; }
.rbt-cat-box-1:hover { border-color: var(--c-primary) !important; box-shadow: 0 8px 24px rgba(0,0,0,.06) !important; transform: translateY(-3px); }

/* ===== STATS ===== */
.rbt-counterup { border-radius: 14px !important; }
.rbt-counterup .counter { font-weight: 800 !important; }

/* ===== PAGINATION ===== */
.rbt-pagination li a, .rbt-pagination li span { border-radius: 8px !important; font-size: 13px !important; }

/* ===== STUDENT DASHBOARD ===== */
.rbt-dashboard-area .rbt-default-sidebar { border-radius: 14px !important; border: 1px solid #e5e7eb !important; }
.rbt-dashboard-area .rbt-default-sidebar-list li a {
    border-radius: 8px !important; padding: 9px 14px !important;
    font-size: 13px !important; transition: all .15s !important;
}
.rbt-dashboard-area .rbt-default-sidebar-list li.active a,
.rbt-dashboard-area .rbt-default-sidebar-list li a:hover {
    background: var(--c-primary-light) !important;
    color: var(--c-primary) !important;
}
.rbt-dashboard-content { border-radius: 14px !important; border: 1px solid #e5e7eb !important; box-shadow: none !important; }

/* ===== TABLES ===== */
.rbt-dashboard-content .table th {
    font-size: 11px; font-weight: 600; color: #64748b;
    text-transform: uppercase; letter-spacing: .5px; padding: 10px 16px;
    background: #fafafa; border-bottom: 1px solid #e5e7eb;
}
.rbt-dashboard-content .table td { padding: 10px 16px; font-size: 13px; border-bottom: 1px solid #f3f4f6; }
.rbt-dashboard-content .table tr:hover td { background: #fafafa; }

/* ===== FORMS ===== */
.rbt-contact-form input, .rbt-contact-form textarea, .rbt-contact-form select {
    border-radius: 10px !important; border: 1.5px solid #e5e7eb !important; transition: all .2s !important;
}
.rbt-contact-form input:focus, .rbt-contact-form textarea:focus {
    border-color: var(--c-primary) !important; box-shadow: 0 0 0 3px rgba(79,70,229,.08) !important;
}

/* ===== BADGES ===== */
.rbt-badge, .rbt-badge-2, .rbt-badge-3, .badge { border-radius: 8px !important; font-weight: 600 !important; }

/* ===== MISC ===== */
.rbt-shadow-box { border-radius: 14px !important; }
html { scroll-behavior: smooth; }
::selection { background: var(--c-primary-light); color: var(--c-dark); }
*:focus-visible { outline: 2px solid var(--c-primary) !important; outline-offset: 2px; }

/* Color utility classes using variables */
.theme-gradient, .color-primary { color: var(--c-primary) !important; }
a:hover { color: var(--c-primary); }

/* ===========================================================
   FRONTEND PAGES — Modern 2024+ Overhaul
   =========================================================== */

/* ===== GLOBAL PAGE IMPROVEMENTS ===== */
body { color: var(--c-text, #334155); }
.container { max-width: 1200px; }

/* Section spacing */
.rbt-section-gap { padding: 70px 0 !important; }
.rbt-section-gapBottom { padding-bottom: 70px !important; }
.rbt-section-gapTop { padding-top: 70px !important; }

/* ===== HERO BANNER (HOME) ===== */
.rbt-banner-area { position: relative; overflow: hidden; }
.rbt-banner-area .rbt-banner-content { position: relative; z-index: 2; }
.rbt-banner-1.variation-2 { background: linear-gradient(135deg, #f8fafc 0%, var(--c-primary-light, #eef2ff) 100%) !important; }
.rbt-banner-1 .content .inner { max-width: 600px; }
.rbt-banner-1 .title {
    font-size: clamp(1.8rem, 4vw, 2.8rem) !important;
    font-weight: 900 !important; line-height: 1.25 !important;
    color: var(--c-dark, #0f172a) !important;
    letter-spacing: -0.5px;
}
.rbt-banner-1 .description {
    font-size: 16px !important; color: #64748b !important;
    line-height: 1.9 !important; max-width: 520px;
}
.rbt-new-badge {
    border-radius: 24px !important; font-size: 13px !important;
    padding: 6px 18px !important; font-weight: 600 !important;
    background: rgba(79,70,229,.08) !important; color: var(--c-primary) !important;
    border: 1px solid rgba(79,70,229,.15) !important;
}
.rbt-counterup-wrapper { gap: 24px !important; }
.rbt-counterup.style-3 .inner {
    background: #fff !important; border: 1px solid #e5e7eb !important;
    border-radius: 14px !important; padding: 16px 20px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.04) !important;
    transition: all .25s !important;
}
.rbt-counterup.style-3 .inner:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,.06) !important;
    transform: translateY(-2px);
}
.rbt-counterup .rbt-count .odometer { font-weight: 900 !important; color: var(--c-primary) !important; }
.rbt-counterup .desc { font-size: 12px !important; color: #94a3b8 !important; font-weight: 500 !important; }

/* ===== ABOUT PAGE ===== */
.rbt-about-area img { border-radius: 16px !important; }
.rbt-feature.feature-style-1 {
    padding: 18px 0 !important; border-bottom: 1px solid #f1f5f9;
}
.rbt-feature .icon {
    width: 44px !important; height: 44px !important;
    border-radius: 12px !important; display: flex !important;
    align-items: center; justify-content: center;
}
.rbt-feature .feature-title { font-size: 15px !important; font-weight: 700 !important; color: var(--c-dark) !important; }
.rbt-feature .feature-description { font-size: 13px !important; color: #64748b !important; line-height: 1.7 !important; }

/* About Counter Section */
.rbt-counterup.rbt-hover-03 {
    border-radius: 16px !important;
    border: 1px solid #e5e7eb !important;
    padding: 28px !important;
    transition: all .3s !important;
}
.rbt-counterup.rbt-hover-03:hover {
    border-color: var(--c-primary) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.06) !important;
    transform: translateY(-4px);
}
.rbt-counterup .counter { font-weight: 900 !important; font-size: 2.2rem !important; color: var(--c-primary) !important; }

/* CTA Section */
.rbt-callto-action-area { background: #f8fafc !important; border-radius: 0 !important; }
.rbt-callto-action-area .section-title .title { font-size: 1.5rem !important; }

/* ===== CONTACT PAGE ===== */
.rbt-address { border-radius: 14px !important; border: 1px solid #e5e7eb !important; padding: 24px !important; transition: all .25s !important; }
.rbt-address:hover { box-shadow: 0 4px 16px rgba(0,0,0,.06) !important; transform: translateY(-2px); }
.rbt-address .icon {
    width: 52px !important; height: 52px !important;
    border-radius: 14px !important; margin-bottom: 16px !important;
}
.rbt-address .title { font-size: 15px !important; font-weight: 700 !important; }

/* Contact Form */
.rbt-contact-form { border-radius: 16px !important; }
.rbt-contact-form .form-group { margin-bottom: 16px !important; }
.rbt-contact-form input,
.rbt-contact-form textarea,
.rbt-contact-form select {
    border-radius: 12px !important;
    border: 1.5px solid #e5e7eb !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    transition: all .2s !important;
    background: #fff !important;
}
.rbt-contact-form input:focus,
.rbt-contact-form textarea:focus {
    border-color: var(--c-primary) !important;
    box-shadow: 0 0 0 4px rgba(79,70,229,.06) !important;
}
.rbt-contact-form label {
    font-size: 13px !important; font-weight: 600 !important;
    color: var(--c-dark) !important; margin-bottom: 6px !important;
}
.rbt-contact-form .form-submit-group { margin-top: 8px !important; }

/* ===== BLOG INDEX ===== */
.rbt-blog-area .rbt-card { border-radius: 16px !important; }
.rbt-blog-area .rbt-card .rbt-card-img img { border-radius: 16px 16px 0 0 !important; }
.rbt-blog-area .rbt-card .rbt-card-body { padding: 20px !important; }
.rbt-blog-area .rbt-card .rbt-card-title {
    font-size: 16px !important; font-weight: 700 !important;
    line-height: 1.5 !important; margin-bottom: 8px !important;
}
.rbt-blog-area .rbt-card .rbt-card-title a { color: var(--c-dark) !important; }
.rbt-blog-area .rbt-card .rbt-card-title a:hover { color: var(--c-primary) !important; }

/* ===== BLOG DETAIL ===== */
.rbt-blog-details-area { background: #fff; }
.rbt-blog-details-area .content { max-width: 760px; margin: 0 auto; }
.rbt-blog-details-area .content img { border-radius: 16px !important; margin: 20px 0 !important; }
.rbt-blog-details-area .content h1,
.rbt-blog-details-area .content h2,
.rbt-blog-details-area .content h3 {
    font-weight: 800 !important; color: var(--c-dark) !important;
    margin-top: 24px !important; margin-bottom: 12px !important;
}
.rbt-blog-details-area .content p {
    font-size: 15px !important; line-height: 1.9 !important;
    color: #475569 !important; margin-bottom: 16px !important;
}
/* Blog Comments */
.rbt-comment-area { max-width: 760px; margin: 0 auto; }

/* ===== COURSE DETAIL PAGE ===== */
.rbt-course-details-area { background: #fff; }

/* Course Info Sidebar */
.course-sidebar, .rbt-course-feature-box {
    border-radius: 16px !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.04) !important;
    overflow: hidden;
}
.rbt-course-feature-box .rbt-feature-line-left-content {
    padding: 12px 20px !important;
    border-bottom: 1px solid #f3f4f6 !important;
}
.rbt-course-feature-box .rbt-feature-line-left-content:last-child { border-bottom: none !important; }

/* Price Display */
.rbt-price-wrapper .current-price {
    font-size: 28px !important; font-weight: 900 !important;
    color: var(--c-primary) !important;
}
.rbt-price-wrapper .off-price {
    font-size: 16px !important; color: #94a3b8 !important;
    text-decoration: line-through !important;
}

/* Course Content Accordion */
.rbt-course-content-wrapper { border-radius: 16px !important; overflow: hidden; }
.rbt-accordion-style .accordion-item {
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    margin-bottom: 10px !important;
    overflow: hidden;
}
.rbt-accordion-style .accordion-button {
    padding: 14px 20px !important;
    font-size: 14px !important; font-weight: 600 !important;
    border-radius: 12px !important;
}
.rbt-accordion-style .accordion-button:not(.collapsed) {
    background: var(--c-primary-light) !important;
    color: var(--c-primary) !important;
    box-shadow: none !important;
}
.rbt-accordion-style .accordion-body { padding: 0 !important; }

/* Lesson list items */
.rbt-course-main-content .course-content-left i { font-size: 16px !important; }
.rbt-course-main-content .section-header { background: #fafafa; }

/* Instructor Card */
.rbt-instructor { border-radius: 16px !important; padding: 24px !important; }
.rbt-instructor .thumbnail img { border-radius: 14px !important; }

/* Review Section */
.rbt-review-wrapper { border-radius: 16px !important; }
.rbt-review-wrapper .rating-box {
    border-radius: 14px !important;
    background: var(--c-primary-light) !important;
    padding: 20px !important;
}
.rbt-review-wrapper .rating-box .rating-number {
    font-size: 3rem !important; font-weight: 900 !important;
    color: var(--c-primary) !important;
}

/* What You'll Learn Box */
.rbt-course-details-list-wrapper {
    background: var(--c-primary-light) !important;
    border: 1px solid rgba(79,70,229,.1) !important;
    border-radius: 16px !important;
    padding: 24px !important;
}
.rbt-course-details-list-wrapper .title { color: var(--c-primary) !important; font-weight: 800 !important; }

/* ===== CART PAGE ===== */
.rbt-cart-area table { border-radius: 14px !important; overflow: hidden; }
.rbt-cart-area table th {
    background: #fafafa !important; font-size: 12px !important;
    font-weight: 700 !important; text-transform: uppercase !important;
    letter-spacing: .5px !important; color: #64748b !important;
    padding: 14px 16px !important;
}
.rbt-cart-area table td {
    padding: 16px !important; vertical-align: middle !important;
    border-bottom: 1px solid #f3f4f6 !important;
}
.rbt-cart-area .coupon input {
    border-radius: 10px !important; border: 1.5px solid #e5e7eb !important;
    padding: 10px 16px !important;
}
.rbt-cart-area .cart-total {
    border-radius: 16px !important; border: 1px solid #e5e7eb !important;
    padding: 24px !important; background: #fafafa !important;
}

/* ===== CHECKOUT PAGE ===== */
.rbt-main-checkout-area { background: #fff; }
.rbt-main-checkout-area .form-group input,
.rbt-main-checkout-area .form-group select {
    border-radius: 10px !important; border: 1.5px solid #e5e7eb !important;
    padding: 10px 16px !important;
}

/* ===== NEWSLETTER CTA ===== */
.rbt-newsletter-area {
    background: linear-gradient(135deg, var(--c-gradient-from), var(--c-gradient-to)) !important;
    border-radius: 20px !important;
    margin: 0 16px !important;
}

/* ===== TEAM/INSTRUCTOR CARDS ===== */
.rbt-team.team-style-default .inner {
    border-radius: 16px !important;
    border: 1px solid #e5e7eb !important;
    overflow: hidden;
    transition: all .3s !important;
}
.rbt-team.team-style-default .inner:hover {
    box-shadow: 0 8px 24px rgba(0,0,0,.06) !important;
    transform: translateY(-4px);
}
.rbt-team .thumbnail img { border-radius: 50% !important; }

/* ===== ONE-PAGE NAV (Course Detail) ===== */
.rbt-default-tab .nav-tabs {
    border: none !important; background: #f8fafc !important;
    border-radius: 12px !important; padding: 4px !important;
    gap: 4px !important;
}
.rbt-default-tab .nav-tabs .nav-link {
    border: none !important; border-radius: 8px !important;
    font-size: 13px !important; font-weight: 600 !important;
    color: #64748b !important; padding: 8px 16px !important;
}
.rbt-default-tab .nav-tabs .nav-link.active {
    background: #fff !important; color: var(--c-primary) !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.06) !important;
}

/* ===== SHARE BUTTONS ===== */
.rbt-like-share .social-share li a {
    width: 36px !important; height: 36px !important;
    border-radius: 8px !important;
    display: flex !important; align-items: center; justify-content: center;
    transition: all .2s;
}

/* ===== EMPTY STATES ===== */
.rbt-section-gap .text-center i[style*="font-size"] { opacity: .2 !important; }

/* ===== RESPONSIVE FIXES ===== */
@media (max-width: 768px) {
    .rbt-banner-1 .title { font-size: 1.6rem !important; }
    .rbt-banner-1 .description { font-size: 14px !important; }
    .rbt-section-gap { padding: 40px 0 !important; }
    .section-title .title { font-size: 1.3rem !important; }
    .rbt-card .rbt-card-body { padding: 14px !important; }
    .rbt-counterup.rbt-hover-03 { padding: 18px !important; }
    .rbt-counterup .counter { font-size: 1.6rem !important; }
}

/* ===== ANIMATIONS ===== */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
.rbt-card, .rbt-cat-box-1, .rbt-address, .rbt-counterup {
    animation: fadeInUp .5s ease both;
}
.rbt-card:nth-child(2) { animation-delay: .1s; }
.rbt-card:nth-child(3) { animation-delay: .2s; }
.rbt-card:nth-child(4) { animation-delay: .3s; }

/* Fix btn-primary link color */
a.btn.btn-primary {
    color: #fff !important;
}