/* assets/css/style.css */
   :root{
		--brand-primary: #3d1063;
		--brand-primary-soft:#5735b9;
		--brand-secondary: #ffcc00;
		--brand-dark: #2a0a45;		   
   }

/* ১. বডি স্টাইল ক্লিন করা হয়েছে (ডুপ্লিকেট রিমুভড) */
body {
    /* System Font Stack for performance and readability */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    background-color: var(--bg-theme);
    color: var(--text);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin: 0;
}

/* ২. বডি ক্লাস স্টাইল (যদি নির্দিষ্ট কোনো পেজে ক্লাসের প্রয়োজন হয়) */
body.bg-theme {
    background-color: rgb(253, 250, 245);
}



/*--------NAV Menu Start----------*/

.theme-text-primary {
    color: var(--brand-primary) !important;
}

.theme-text-secondary {
    color: var(--brand-secondary) !important;
}

.bg-theme-primary{
	background-color: var(--brand-primary) !important;;
	color:#fff;
}
.bg-theme-secondary {
    background-color: var(--brand-secondary) !important;
	color: var(--brand-dark) !important;
}

.btn-outline-brand-secondary {
    --bs-btn-color: var(--brand-secondary);
    --bs-btn-border-color: var(--brand-secondary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-secondary);
    --bs-btn-hover-border-color: var(--brand-secondary);
    --bs-btn-focus-shadow-rgb: 13, 110, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-secondary);
    --bs-btn-active-border-color: var(--brand-secondary);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--brand-secondary);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--brand-secondary);
    --bs-gradient: none;
}

.btn-outline-brand-primary {
    --bs-btn-color: var(--brand-primary);
    --bs-btn-border-color: var(--brand-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--brand-primary);
    --bs-btn-hover-border-color: var(--brand-primary);
    --bs-btn-focus-shadow-rgb: 13, 110, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--brand-primary);
    --bs-btn-active-border-color: var(--brand-primary);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--brand-primary);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--brand-primary);
    --bs-gradient: none;
}



.brand-header.fixed-top {
    z-index: 1030;
}

/* Hover effect for desktop links */
.hover-primary:hover {
    color: var(--brand-primary) !important;
    transition: color 0.2s ease;
}

/* Make offcanvas look premium */
.offcanvas {
    width: 80% !important; 
    max-width: 320px;
}

.offcanvas-body a {
    transition: padding-left 0.25s;
}

.offcanvas-body a:hover {
    padding-left: 12px;
    color: var(--brand-primary) !important;
}

/* ৩. হোয়াটসঅ্যাপ ফ্লোটিং বাটন */
.whatsapp-float {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 90px;
    right: 6px;
    background-color: #25D366;
    color: #fff !important;
    border-radius: 50%;
    text-align: center;
    font-size: 35px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.25);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.3s ease;
}

.whatsapp-float:hover,
.whatsapp-float:focus {
    transform: scale(1.1);
    background-color: #20b358;
    box-shadow: 0 8px 20px rgba(0,0,0,0.3);
}

.xtext-muted{
	 color: var(--muted);
}

/*--------NAV Menu End----------*/



.breadcrumb-item {
    display: flex;
    align-items: center;
    font-size: 0.9rem;
    letter-spacing: 0.5px;
}


.breadcrumb-item a {
    color: var(--muted);
    text-decoration: none;
    font-weight: 500;
    transition: all 0.3s ease;
}

.breadcrumb-item a:hover {
    color: var(--brand-primary); 
    transform: translateY(-1px);
}


.breadcrumb-item.active {
    color: var(--brand-primary);
    font-weight: 500;
    position: relative;
}

/* সেপারেটর (Chevron Icon) */
.breadcrumb-item + .breadcrumb-item::before {
    content: "\F285"; /* bi-chevron-right */
    font-family: "bootstrap-icons";
    font-size: 10px;
    font-weight: bold;
    color: #ccc;
    padding: 0 5px;
}

/* হোভার ইফেক্ট */
.breadcrumb-item i {
    font-size: 1.1rem;
    vertical-align: middle;
}

/* Terms of Service Section Styles */
.terms-card {
    background-color: var(--card);
    border-radius: 20px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04);
    border: 1px solid rgba(0,0,0,0.05);
}

/* Terms Header Styling */
.terms-header h1 {
    color: var(--text);
    letter-spacing: -1px;
}

/* টাইটেলের বাম পাশের লাল বারটি */
.title-decorator {
    width: 6px;
    height: 40px;
    background-color: var(--brand-primary); /* আপনার রেড কালার */
    border-radius: 50px;
}

.terms-header .text-primary {
    color: var(--brand-primary) !important;
}

.terms-header span {
    font-size: 0.95rem;
    letter-spacing: 0.5px;
}

/* মোবাইলের জন্য রেসপন্সিভ এডজাস্টমেন্ট */
@media (max-width: 576px) {
    .title-decorator {
        height: 30px;
    }

}


.terms-content h4 {
    color: var(--text);
    margin-top: 1.5rem;
    font-size: 1.25rem;
}

.terms-content p {
    color: var(--muted);
    line-height: 1.8;
    font-size: 1.05rem;
}

.terms-section .text-primary {
    color: var(--brand-primary) !important; /* আপনার ডিফাইন করা লাল কালার */
}

/* Scroll smoothness */
.terms-content {
    letter-spacing: 0.2px;
}

/* মোবাইলের জন্য অপ্টিমাইজেশন */
@media (max-width: 768px) {
    .terms-card {
        padding: 25px !important;
    }
    .display-5 {
        font-size: 1.8rem;
    }
}

@media (min-width: 1200px) {
    .display-5 {
        font-size: 2rem;
    }
}

/* Login Form */
    .login-container {
        min-height: 80vh;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .auth-card {
        border: none;
        border-radius: 24px;
        overflow: hidden;
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
        background: #ffffff;
    }

    .auth-info-side {
        background: linear-gradient(135deg, var(--primary) 0%, var(--primary-soft) 100%);
        color: white;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 40px;
    }

    .form-control {
        padding: 12px 16px;
        border-radius: 12px;
        border: 1px solid #eee;
        background-color: #f8f9fa;
    }

    .form-control:focus {
        box-shadow: 0 0 0 4px rgba(247, 46, 66, 0.1);
        border-color: var(--brand-primary);
        background-color: #fff;
    }

    .btn-login {
        background-color: var(--brand-primary);
        color: white;
        border: none;
        padding: 12px;
        border-radius: 12px;
        font-weight: 600;
        transition: all 0.3s;
    }

    .btn-login:hover {
        background-color: #d62839;
        transform: translateY(-2px);
        color: white;
    }

    .input-group-text {
        border-radius: 12px 0 0 12px;
        border: 1px solid #eee;
        background: #f8f9fa;
    }

    .social-login-btn {
        border: 1px solid #eee;
        border-radius: 12px;
        padding: 10px;
        transition: all 0.2s;
        text-decoration: none;
        color: var(--text);
        display: inline-block;
        width: 100%;
        text-align: center;
    }

    .social-login-btn:hover {
        background: #f1f1f1;
    }

 /*-----Registration-----*/   
 .auth-card { 
    border: none; 
    border-radius: 24px; 
    overflow: hidden; 
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08); 
    background: var(--card); /* Settings base card color */
}

.auth-info-side { 
    /* Gradient using dynamic primary and primary-soft colors */
    background: linear-gradient(135deg, var(--brand-primary) 0%, var(--brand-primary-soft) 100%); 
    color: white; 
    display: flex; 
    flex-direction: column; 
    justify-content: center; 
    padding: 40px; 
}

.form-control { 
    padding: 10px 16px; 
    border-radius: 12px; 
    border: 1px solid #eee; 
    background-color: #f8f9fa; 
    color: var(--text); /* Dynamic text color */
}

.form-control:focus {
    border-color: var(--brand-primary);
    box-shadow: 0 0 0 0.25rem rgba(var(--primary-rgb), 0.25); /* Optional: Focus glow */
}

.btn-register { 
    background-color: var(--brand-primary); /* Dynamic primary color */
    color: white; 
    border: none; 
    padding: 12px; 
    border-radius: 12px; 
    font-weight: 600; 
    transition: all 0.3s; 
}

.btn-register:hover { 
    /* Hover effect maintains logic but uses dynamic base */
    filter: brightness(90%); 
    transform: translateY(-2px); 
    color: white; 
    background-color: var(--brand-primary); 
}

/* Optimized Section Header - Manual Alignment Version */

.section-header h2 {
    /* Responsive font sizing: scales between 1.8rem and 2.5rem */
    font-size: clamp(1.8rem, 5vw, 2.5rem);
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 1px;
    letter-spacing: -1px;
    font-family: 'Plus Jakarta Sans', sans-serif; 
}

.section-header h2 span {
    color: #dc0c0c; /* Updated to Red */
}

.section-header .title-bar {
    width: 60px;
    height: 5px;
    background-color: var(--brand-secondary);
    border-radius: 10px;
    display: inline-block; /* Allows the bar to respect parent text-alignment */
    vertical-align: middle;
}