/*
body {
    background: #f4f6f9;
    font-family: 'Segoe UI', sans-serif;
}

 SIDEBAR STYLES
.sidebar {
    position: fixed;
    left: 0;
    top: 0;
    width: 260px;
    height: 100%;
    background: linear-gradient(180deg, #4e73df, #224abe);
    overflow-y: auto;
    overflow-x: hidden;
    transition: width 0.3s ease;
    z-index: 1000;
}

.sidebar.collapsed {
    width: 80px;
}

.sidebar-title {
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    text-align: center;
    padding: 20px;
    white-space: nowrap;
    transition: font-size 0.3s ease, padding 0.3s ease;
}

*/
/* Sidebar collapsed title adjustments *//*
*/
/*

.sidebar.collapsed .sidebar-title {
    font-size: 14px;
    padding: 20px 5px;
}

.sidebar .menu {
    color: #fff;
    padding: 14px 20px;
    cursor: pointer;
    transition: background 0.3s, padding 0.3s ease;
    white-space: nowrap;
    display: flex;
    align-items: center;
}

.sidebar .menu i {
    width: 24px;
    text-align: center;
    font-size: 16px;
    margin-right: 12px;
    transition: margin 0.3s ease, font-size 0.3s ease;
}

.sidebar .menu:hover {
    background: rgba(255, 255, 255, 0.15);
}

*//*

*/
/* Collapsed menu item adjustments: hides text, centers icons *//*
*/
/*

.sidebar.collapsed .menu {
    font-size: 0;
    padding: 14px 0;
    justify-content: center;
}

.sidebar.collapsed .menu i {
    margin-right: 0;
    font-size: 18px;
}

*//*

*/
/* MAIN CONTENT AREA STYLES *//*
*/
/*

.content {
    margin-left: 260px;
    transition: margin-left 0.3s ease;
}

.content.expand {
    margin-left: 80px;
}

.topbar {
    background: white;
    padding: 15px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.main-card {
    border: none;
    border-radius: 12px;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.08);
}

.result-panel {
    max-height: 75vh;
    overflow-y: auto;
}

*//*

*/
/* DASHBOARD / RESULT CARDS *//*
*/
/*

.summary-card {
    border-left: 5px solid #4e73df;
}

.mcq-card {
    border-left: 5px solid #1cc88a;
}

.qa-card {
    border-left: 5px solid #f6c23e;
}

.download-card {
    border-left: 5px solid #e74a3b;
}

*//*

*/
/* PAGE SECTION CONTROLS *//*
*/
/*

.page-section {
    display: none;
}

.page-section.active {
    display: block;
}

*//*

*/
/* UPLOAD & LOADER STYLES *//*
*/
/*

.upload-zone {
    border: 2px dashed #4e73df;
    border-radius: 12px;
    padding: 35px;
    text-align: center;
}
*//*

*/
/* TOAST NOTIFICATION STYLING *//*
*/
/*

.toast-container {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 10800;
}

*//*

*/
/* Handwritten Style Option *//*
*/
/*

.handwritten-mode {
    font-family: 'Caveat', 'Comic Sans MS', cursive, sans-serif !important;
    font-size: 1.25rem;
    line-height: 1.6;
    background-color: #fffdf9;
    border-left: 5px dashed #ffc107 !important;
}
.loader-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.85);
    width: 100%;
    height: 100%;
    z-index: 99999;
}


*//*

*/
/*chat gpt style *//*
*/
/*


*//*

*/
/* --- ChatGPT / Claude Theme Enhancements --- *//*
*/
/*


*//*

*/
/* Modern neutral dark theme for dropdown menus *//*
*/
/*

.dropdown-menu {
    background-color: #202123 !important;
    border: 1px solid #343541 !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2) !important;
}

.dropdown-menu .dropdown-item {
    color: #ececf1 !important;
    padding: 10px 16px !important;
    font-size: 0.95rem;
    transition: background-color 0.2s ease;
}

.dropdown-menu .dropdown-item:hover {
    background-color: #2a2b32 !important;
    color: #ffffff !important;
}

.dropdown-menu .dropdown-divider {
    border-color: #343541 !important;
}*//*

body {
    background: #121214;
    color: #ececf1;
    font-family: 'Segoe UI', sans-serif;
}
}/* SIDEBAR & GLOBAL STYLES */
 body {
     background: #121214;
     color: #ececf1;
     font-family: 'Segoe UI', sans-serif;
     padding-top: 65px; /* Ensures content doesn't slide under the fixed navbar */
 }

 /* SIDEBAR STYLES */
 .sidebar {
     position: fixed;
     left: 0;
     top: 0;
     width: 260px;
     height: 100%;
     background: linear-gradient(180deg, #1f2023, #111113);
     border-right: 1px solid #2a2b32;
     overflow-y: auto;
     overflow-x: hidden;
     transition: width 0.3s ease;
     z-index: 1000;
 }

 .sidebar.collapsed {
     width: 80px;
 }

 .sidebar-title {
     color: #fff;
     font-size: 24px;
     font-weight: 700;
     text-align: center;
     padding: 20px;
     white-space: nowrap;
     transition: font-size 0.3s ease, padding 0.3s ease;
 }

 .sidebar.collapsed .sidebar-title {
     font-size: 14px;
     padding: 20px 5px;
 }

 /* Sidebar Menu Links (Removed underlines & kept clean block design) */
 .sidebar .menu,
 .sidebar a.menu {
     color: #cfd3dc;
     padding: 14px 20px;
     cursor: pointer;
     transition: background 0.3s, padding 0.3s ease;
     white-space: nowrap;
     display: flex;
     align-items: center;
     text-decoration: none !important;
 }

 .sidebar .menu i,
 .sidebar a.menu i {
     width: 24px;
     text-align: center;
     font-size: 16px;
     margin-right: 12px;
     transition: margin 0.3s ease, font-size 0.3s ease;
 }

 .sidebar .menu:hover,
 .sidebar a.menu:hover {
     background: rgba(255, 255, 255, 0.08);
     color: #ffffff;
     text-decoration: none !important;
 }

 .sidebar.collapsed .menu,
 .sidebar.collapsed a.menu {
     font-size: 0;
     padding: 14px 0;
     justify-content: center;
 }

 .sidebar.collapsed .menu i,
 .sidebar.collapsed a.menu i {
     margin-right: 0;
     font-size: 18px;
 }

 /* MAIN CONTENT AREA STYLES */
 .content {
     margin-left: 260px;
     transition: margin-left 0.3s ease;
     background-color: #121214;
     min-height: 100vh;
     padding: 20px;
 }

 .content.expand {
     margin-left: 80px;
 }

 .topbar {
     background: #18191c;
     border-bottom: 1px solid #2a2b32;
     padding: 15px;
     color: #ffffff;
 }

 /* DARK CARDS & PANELS */
 .main-card, .card {
     background-color: #1e1e24 !important;
     color: #ececf1 !important;
     border: 1px solid #2a2b32 !important;
     border-radius: 12px;
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
 }

 .card-header {
     background-color: #25262b !important;
     border-bottom: 1px solid #343541 !important;
     color: #ffffff !important;
 }

 .card-body {
     background-color: #1e1e24 !important;
     color: #ececf1 !important;
 }

 .result-panel {
     max-height: 75vh;
     overflow-y: auto;
 }

 /* CARD ACCENT BORDERS */
 .summary-card { border-left: 5px solid #3b82f6 !important; }
 .mcq-card { border-left: 5px solid #10b981 !important; }
 .qa-card { border-left: 5px solid #f59e0b !important; }
 .download-card { border-left: 5px solid #ef4444 !important; }

 .page-section { display: none; }
 .page-section.active { display: block; }

 .upload-zone {
     border: 2px dashed #3b82f6;
     border-radius: 12px;
     padding: 35px;
     text-align: center;
     background: #18191c;
 }

 .toast-container {
     position: fixed;
     bottom: 20px;
     right: 20px;
     z-index: 10800;
 }

 .handwritten-mode {
     font-family: 'Caveat', 'Comic Sans MS', cursive, sans-serif !important;
     font-size: 1.25rem;
     line-height: 1.6;
     background-color: #1a1a1d !important;
     border-left: 5px dashed #fbbf24 !important;
 }

 .loader-overlay {
     display: none;
     position: fixed;
     top: 0;
     left: 0;
     background: rgba(0, 0, 0, 0.85);
     width: 100%;
     height: 100%;
     z-index: 99999;
 }

 /* ChatGPT / Claude Dark Theme Enhancements */
 .dropdown-menu {
     background-color: #202123 !important;
     border: 1px solid #343541 !important;
     border-radius: 8px !important;
     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4) !important;
 }

 .dropdown-menu .dropdown-item {
     color: #ececf1 !important;
     padding: 10px 16px !important;
     font-size: 0.95rem;
     transition: background-color 0.2s ease;
 }

 .dropdown-menu .dropdown-item:hover {
     background-color: #2a2b32 !important;
     color: #ffffff !important;
 }

 .dropdown-menu .dropdown-divider {
     border-color: #343541 !important;
 }

 .form-control, .form-select {
     background-color: #25262b !important;
     border: 1px solid #343541 !important;
     color: #ffffff !important;
 }

 .form-control:focus {
     background-color: #25262b !important;
     color: #ffffff !important;
     border-color: #3b82f6 !important;
     box-shadow: 0 0 0 0.25rem rgba(59, 130, 246, 0.25);
 }

 .bg-light {
     background-color: #161619 !important;
 }

 /* TABLES & HISTORY CONTAINER FIXES */
 .table-responsive {
     background-color: #1e1e24 !important;
 }

 .table {
     color: #ececf1 !important;
     background-color: #1e1e24 !important;
     margin-bottom: 0;
 }

 .table > :not(caption) > * > * {
     background-color: #1e1e24 !important;
     color: #ececf1 !important;
     border-bottom-color: #343541 !important;
 }

 .table-light, thead.table-light > tr > th {
     background-color: #25262b !important;
     color: #ffffff !important;
     border-color: #343541 !important;
 }

 .table-hover tbody tr:hover > * {
     background-color: #2a2b32 !important;
     color: #ffffff !important;
 }

 #uploadLeftColumn {
     transition: all 0.3s ease;
 }

 .markdown-content pre {
     background: #18191c;
     padding: 10px;
     border-radius: 5px;
     border: 1px solid #2a2b32;
     overflow-x: auto;
 }
 .markdown-content code {
     background: #18191c;
     padding: 2px 4px;
     color: #f472b6;
     border-radius: 4px;
 }
 .markdown-content p:last-child {
     margin-bottom: 0;
 }

 /* SIDEBAR COLLAPSE CONTENT SHIFT FIX */
 body.sidebar-collapsed .content {
     margin-left: 80px;
 }

 /* CHAT MESSAGES CONTAINER DARK STYLING */
 #chatMessagesContainer {
     background-color: #161619 !important;
     border: 1px solid #2a2b32;
     border-radius: 8px;
 }

 #chatMessagesContainer::-webkit-scrollbar,
 .chat-body::-webkit-scrollbar,
 .result-panel::-webkit-scrollbar {
     width: 6px;
 }

 #chatMessagesContainer::-webkit-scrollbar-thumb,
 .chat-body::-webkit-scrollbar-thumb,
 .result-panel::-webkit-scrollbar-thumb {
     background: #343541;
     border-radius: 3px;
 }

 /* CUSTOM NAV TABS OVERRIDES FOR DARK MODE */
 .nav-tabs {
     border-bottom: 1px solid #343541 !important;
 }

 .nav-tabs .nav-link {
     color: #9ca3af !important;
     background-color: transparent !important;
     border: 1px solid transparent !important;
 }

 .nav-tabs .nav-link:hover {
     color: #ffffff !important;
     border-color: #343541 #343541 #343541 !important;
 }

 .nav-tabs .nav-link.active {
     color: #ffffff !important;
     background-color: #25262b !important;
     border-color: #343541 #343541 #1e1e24 !important;
 }
/* ==================================================
   BILLING PAGE
================================================== */

.billing-container{
    max-width:1200px;
    margin:0 auto;
}

.billing-header-card{
    border-radius:16px !important;
}

.billing-amount{
    font-size:34px;
    font-weight:700;
    color:#fbbf24;
}

/* TOP STATS */

.billing-card{
    min-height:100px;
}

.billing-label{
    color:#94a3b8;
    font-size:11px;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:1px;
}

.billing-value{
    font-size:20px;
    font-weight:700;
    margin-top:8px;
}

/* STATUS COLORS */

#subscriptionStatus.text-success{
    color:#22c55e !important;
}

#subscriptionStatus.text-danger{
    color:#ef4444 !important;
}

#subscriptionStatus.text-warning{
    color:#fbbf24 !important;
}

/* SUBSCRIPTION DETAILS */

.billing-info-card{

    padding:14px 18px;

    border-radius:12px;

    border:1px solid #343541;

    min-height:auto;

    transition:all .2s ease;
}

.billing-info-card:hover{
    transform:translateY(-2px);
}

.subscription-card{

    background:linear-gradient(
            135deg,
            rgba(59,130,246,.12),
            rgba(37,99,235,.04)
    );

    border-left:4px solid #3b82f6;
}

.payment-card{

    background:linear-gradient(
            135deg,
            rgba(16,185,129,.12),
            rgba(5,150,105,.04)
    );

    border-left:4px solid #10b981;
}

.billing-info-title{

    color:#94a3b8;

    font-size:11px;

    font-weight:600;

    text-transform:uppercase;

    letter-spacing:1px;

    margin-bottom:6px;
}

.billing-info-text{

    font-size:15px;

    font-weight:700;

    white-space:nowrap;

    overflow:hidden;

    text-overflow:ellipsis;
}

.subscription-card .billing-info-text{
    color:#60a5fa;
}

.payment-card .billing-info-text{
    color:#34d399;
}

/* ACTION CARDS */

.billing-action-card{
    min-height:140px;
}

.billing-icon{

    width:48px;
    height:48px;

    border-radius:50%;

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

    font-size:18px;
}

.billing-icon.success{

    background:rgba(16,185,129,.15);

    color:#34d399;
}

.billing-icon.danger{

    background:rgba(239,68,68,.15);

    color:#ef4444;
}

/* TABLE */

.billing-table td,
.billing-table th{

    padding:12px !important;
    vertical-align:middle !important;
}

.table-payment-box{

    display:inline-flex;

    align-items:center;

    gap:6px;

    background:rgba(59,130,246,.15);

    border-left:3px solid #3b82f6;

    padding:4px 8px;

    border-radius:8px;

    color:#60a5fa;

    font-size:12px;

    font-weight:600;

    max-width:220px;

    white-space:nowrap;

    overflow:hidden;

    text-overflow:ellipsis;
}

.amount-badge{

    display:inline-block;

    background:rgba(245,158,11,.15);

    border-left:3px solid #fbbf24;

    padding:4px 8px;

    border-radius:8px;

    color:#fbbf24;

    font-size:12px;

    font-weight:700;
}

.billing-table tbody tr:hover{
    background:#25262b !important;
}

/* RESPONSIVE */

@media (max-width: 992px){

    .billing-info-text{
        font-size:14px;
    }

    .table-payment-box{
        max-width:180px;
    }
}

@media (max-width:768px){

    .billing-amount{
        font-size:26px;
    }

    .billing-header-card .d-flex{
        flex-direction:column;
        align-items:flex-start !important;
        gap:10px;
    }

    .billing-card{
        min-height:auto;
    }

    .billing-action-card{
        min-height:auto;
    }

    .billing-info-text{
        font-size:13px;
    }
}

 /* Mobile */

 @media(max-width:768px){

     .billing-amount{
         font-size:30px;
     }

     .billing-info-text{
         font-size:16px;
     }

     .billing-value{
         font-size:18px;
     }
 }