:root {
    --primary: #6055cd;
    --primary-light: #eef1ff;
    --primary-dark: #4a41a7;
    --secondary: #6c757d;
    --success: #2ecc71;
    --success-light: #e8f8f0;
    --info: #3498db;
    --info-light: #e9f5fc;
    --warning: #f39c12;
    --warning-light: #fef5e7;
    --danger: #e74c3c;
    --danger-light: #fdedeb;
    --dark: #343a40;
    --light: #f8f9fa;
    --border-color: #e9ecef;
    --text-muted: #6c757d;
    --border-radius: 0.5rem;
    --transition: all 0.3s ease;
    --box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    --box-shadow-lg: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    --body-bg: #f2f4ff;
    --body-text: #333333;
    --heading-text: #2d2d2d;
    --section-title-underline: #ceceff;
    --surface-bg: #ffffff;
    --surface-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    --table-bg: #ffffff;
    --table-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    --table-head-bg: #ceceff;
    --table-head-text: #000000;
    --category-header-bg: #f8f9fa;
    --disclaimer-title: #495057;
    --disclaimer-body: #6c757d;
    --disclaimer-border: #dee2e6;
    --info-bg: #f2f4ff;
    --info-shadow-a: #e7e9f3;
    --info-shadow-b: #fcfcff;
    --info-accent: #6055cd;
    --top-card-bg: #ffffff;
    --top-card-text: #000D50;
    --top-card-deactive-bg: #f2f2f2;
    --top-card-deactive-border: #f2f2f2;
    --badge-type-bg: #eef1ff;
    --badge-type-text: #6055cd;
    --badge-mainboard-bg: #5e783d;
    --badge-mainboard-text: #ffffff;
    --badge-sme-bg: #1b387a;
    --badge-sme-text: #ffffff;
    --badge-border: transparent;
}


body {
    background-color: var(--body-bg);
    font-family: 'Poppins', sans-serif;
    color: var(--body-text);
    line-height: 1.6;
}

/* Typography */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 600;
    color: var(--heading-text);
}


.section-title {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--primary);
    /* margin-bottom: 1.5rem; */
    text-align: center;
    position: relative;
    display: inline-block;
    width: 100%;
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background: var(--section-title-underline);
    border-radius: 2px;
}

/* Container Styles */
.subscription-container {
    background-color: var(--surface-bg);
    border-radius: 15px;
    padding: 1rem;
    box-shadow: var(--surface-shadow);
    margin-bottom: 0.5rem;
    border: 1px solid var(--border-color);
    position: relative;
    overflow: hidden;
    height: 100% !important;
}

.subscription-container::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
    height: 200px;
   
    background-color: rgba(96, 85, 205, 0.05);
    border-radius: 50%;
    transform: translate(50%, -50%);
    z-index: 0;
}

.subscription-container>* {
    position: relative;
    z-index: 1;
}

/* Table Styles */
table {
    width: 100%;
    border-collapse: collapse;
    background-color: var(--table-bg);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: var(--table-shadow);
    margin-top: 1rem;
    text-align: center !important;
}

table thead {
    background: var(--table-head-bg) !important;
    color: var(--table-head-text) !important;
    text-align: center !important;

    font-weight: 700;
}

table thead td {
    text-align: center !important;
    background: var(--table-head-bg) !important;
}

table thead td:hover {
    text-align: center !important;
    background: var(--table-head-bg) !important;
    color: var(--table-head-text) !important;
}

table thead th {
    padding: 1rem 0.75rem;
    font-weight: 600;
    font-size:1rem;
    letter-spacing: 0.5px;
    text-align: center !important;
    border: none;
}

table tbody tr {
    transition: var(--transition);
    border-bottom: 1px solid var(--border-color);
}

table tbody tr:hover {
    background-color: var(--primary-light);
    transform: scale(1.01);
}

table tbody tr:last-child {
    border-bottom: none;
}
table  tr td:first-child {
   text-align: start !important;
   padding-left: 1rem;
}
table  tr td:last-child {
    font-weight: bolder !important;
   padding-right: 1rem !important;
}

table tbody td {
    padding: 0.875rem 0.75rem;
    font-size: 1rem;
    color: var(--dark);
    border: none;
}

table tbody tr.total-row {
    background-color: var(--primary-light);
    font-weight: 600;
    color: var(--primary-dark);
}

table tbody tr.total-row:hover {
    background-color: var(--primary-light);
    transform: none;
}

table tbody tr.category-header {
    background-color: var(--category-header-bg);
    font-weight: 600;
    color: var(--primary);
}

table tbody tr.category-header:hover {
    background-color: var(--category-header-bg);
    transform: none;
}

/* Responsive Table */
.table-responsive1 {
    border-radius: 5px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
}


/* Category Explanation */
.category-explanation {
    background-color: var(--surface-bg);
    border-radius: 15px;
    padding: 2rem;
    box-shadow: var(--surface-shadow);
    border: 1px solid var(--border-color);
}

.category-explanation h2 {
    color: var(--primary);
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
    text-align: center;
}

.category-explanation h2::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: linear-gradient(135deg, var(--primary) 0%, #7c3aed 100%);
    margin: 0.5rem auto;
    border-radius: 2px;
}


.category-item {
    background-color: var(--category-header-bg);
    border-radius: 10px;
    padding: 1.5rem;
    margin-bottom: 1rem;
    border-left: 4px solid var(--primary);
    transition: var(--transition);
}

.category-item:hover {
    transform: translateX(10px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.category-item:last-child {
    margin-bottom: 0;
}

.category-item strong {
    color: var(--primary);
    font-size: 1.125rem;
    display: block;
    margin-bottom: 0.5rem;
}

.category-item p {
    margin-bottom: 0;
    color: var(--text-muted);
    line-height: 1.6;
}

/* Number Formatting */

.positive-number {
    color: var(--success);
}

.zero-number {
    color: var(--text-muted);
    text-align: right;
}

/* Watermark and Copy Protection Styles */
.table-container {
    position: relative;
    overflow: hidden;
}

.table-container table {
    position: relative;
    z-index: 2;
}

/* Copy Protection */
.no-copy {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: transparent;
}

.no-copy::selection {
    background: transparent;
}

.no-copy::-moz-selection {
    background: transparent;
}

/* Single watermark for tables */
.subscription-container table {
    position: relative;
}

.subscription-container table::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(0deg);
    width: 200px;
    height: 200px;
    background-image: url('/public/assets/logos/ipoji.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.08;
    pointer-events: none;
    z-index: 1;
}
.subscription-container table.small-table::before {
    width: 150px;
    height: 150px;     
}

.subscription-container table * {
    position: relative;
    z-index: 2;
}

/* Responsive Design */
@media (max-width: 768px) {
    .subscription-container {
        padding: 0.5rem;
    }

    table thead th,
    table tbody td {
        padding: 0.5rem 0.375rem;
        font-size: 1rem;
    }

    .section-title {
        font-size: 1.2rem;
    }

    .category-item {
        padding: 1rem;
    }
}

@media (max-width: 576px) {
    table {
        font-size: 0.8rem;
    }
    .subscription-container {
        padding: 0.4rem;
    }
    table thead th,
    table tbody td {
        padding: 0.375rem 0.25rem;
    }
}

.container-fluid{
padding: 0 !important;
}

       /* Simple Disclaimer Styles */


.disclaimer-title {
color: var(--disclaimer-title);
font-size: 1.25rem;
font-weight: 600;
margin-bottom: 1.5rem;
padding-bottom: 0.75rem;
border-bottom: 2px solid var(--disclaimer-border);
}

.disclaimer-body {
color: var(--disclaimer-body);
line-height: 1.8;
}

.disclaimer-body p {
margin-bottom: 1.25rem;
padding: 0;
text-align: justify;
}

.disclaimer-body p:last-child {
margin-bottom: 0;
}

.disclaimer-body strong {
color: var(--disclaimer-title);
font-weight: 600;
}

/* Responsive adjustments */
@media (max-width: 768px) {

.disclaimer-title {
  font-size: 1.1rem;
  margin-bottom: 1.25rem;
}

.disclaimer-body p {
  margin-bottom: 1rem;
  font-size: 0.95rem;
}
}

@media (max-width: 576px) {

.disclaimer-title {
  font-size: 1rem;
  margin-bottom: 1rem;
}

.disclaimer-body p {
  margin-bottom: 0.875rem;
  font-size: 0.9rem;
}
}

.info-section {
    /* background: var(--light-blue); */
    
    padding: 0.5rem 1rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin: 0 1rem 1rem;
    border-radius: 10px;
    background: var(--info-bg);
    box-shadow: inset 4px 4px 9px var(--info-shadow-a),
                inset -4px -4px 9px var(--info-shadow-b);
  }
  
  .info-icon {
    color: var(--info-accent);
    font-size: 0.9rem;
    margin-top: 0.1rem;
  }
  
  .info-text {
    font-size: 0.85rem;
    color: var(--info-accent);
    margin: 0;
    line-height: 1.4;
  }

/* ============================================================
   Rules migrated from ipoDetail.css — used by ipo-subscription
   ============================================================ */

/* IPO name heading */
h1[role="heading"] { font-size: min(calc(1em + 1.5vw), 24px); }

/* Price display */
.price {
    font-size: calc(1em + 0.5vw);
    color: var(--success);
    font-weight: 600;
}

/* Top card wrapper */
.top_card .card:not(.demo_card) {
    --bs-card-border-radius: 8px;
    --bs-card-bg: var(--top-card-bg);
    color: var(--top-card-text);
}
.top_card .card:not(.demo_card) .card-body {
    border-radius: 0 0 7px 7px;
}
.top_card .card:not(.demo_card).deactive {
    --bs-card-bg: var(--top-card-deactive-bg);
    --bs-card-border-color: var(--top-card-deactive-border);
}

/* Star rating badge */
.ipo_rating {
    align-self: center;
    margin-right: 10px;
}
.ipo_rating i { color: var(--warning, #FFAF20); }

/* Badge chips */
.badge_span {
    font-size: 12px;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: 9999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

/* Status badge (colour set via inline style from server) */
span[data-role="status"] {
    --bgColor: #e8f8f0;
    --textColor: #2ecc71;
    background-color: var(--bgColor);
    color: var(--textColor);
}

/* Type badge (board label) */
span[data-role="type"] {
    background-color: var(--badge-type-bg);
    border-radius: 9999px;
    color: var(--badge-type-text);
}

/* Board-specific badge colours */
span[data-ipotype="Mainboard"] { background-color: var(--badge-mainboard-bg); color: var(--badge-mainboard-text); border: 1px solid var(--badge-border); }
span[data-ipotype="BSE SME"]   { background-color: var(--badge-sme-bg); color: var(--badge-sme-text); border: 1px solid var(--badge-border); }
span[data-ipotype="NSE SME"]   { background-color: var(--badge-sme-bg); color: var(--badge-sme-text); border: 1px solid var(--badge-border); }

/* Badge overrides for dark mode */
body.ipoji-dark-mode .badge_span {
    border: 1px solid var(--dark-input-border);
}

body.ipoji-dark-mode span[data-role="status"] {
    --bgColor: color-mix(in srgb, var(--dark-color-success) 18%, var(--dark-color-card));
    --textColor: var(--dark-color-success);
}

body.ipoji-dark-mode span[data-role="type"] {
    background-color: var(--badge-type-bg);
    color: var(--badge-type-text);
    border: 1px solid var(--badge-border);
}

body.ipoji-dark-mode span[data-ipotype="Mainboard"] {
    background-color: var(--badge-mainboard-bg);
    color: var(--badge-mainboard-text);
    border-color: var(--badge-border);
}

body.ipoji-dark-mode span[data-ipotype="BSE SME"],
body.ipoji-dark-mode span[data-ipotype="NSE SME"] {
    background-color: var(--badge-sme-bg);
    color: var(--badge-sme-text);
    border-color: var(--badge-border);
}

/* Last-updated info bar */
.update-info {
    text-align: center;
    border-radius: 10px;
    padding: 0.5rem;
    font-size: 0.875rem;
    color: var(--text-muted);
}
.update-info i {
    color: var(--primary);
    margin-right: 0.5rem;
}

/* Offer date pill */
.offer-date {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: var(--secondary);
    font-weight: 500;
}

@media screen and (min-width: 768px) {
    .top_card .card-body {
        display: grid;
        grid-template-columns: auto 200px;
    }
}
/*  dark mode styles */
body.ipoji-dark-mode {
    color-scheme: dark;

    --dark-color-primary: #B7AEFF;
    --dark-color-on-primary: #231A74;
    --dark-color-secondary: #FFCF66;
    --dark-color-on-secondary: #2B1E00;
    --dark-color-background: #0D0E11;
    --dark-color-surface: #121316;
    --dark-color-card: #181A1F;
    --dark-color-chip-bg: #23262D;
    --dark-text-primary: #E7E1E8;
    --dark-text-secondary: #BFC2CC;
    --dark-color-success: #7DDC81;
    --dark-color-warning: #FFCF66;
    --dark-color-info: #82B1FF;
    --dark-color-error: #FFB4AB;
    --dark-color-on-error: #690005;
    --dark-color-divider: rgba(255, 255, 255, 0.2);
    --dark-color-overlay-scrim: rgba(0, 0, 0, 0.25);
    --dark-tab-active: #B7AEFF;
    --dark-tab-inactive: #BFC2CC;
    --dark-tab-indicator: #FFCF66;
    --dark-input-bg: #181A1F;
    --dark-input-border: rgba(255, 255, 255, 0.12);
    --dark-input-focus-border: #B7AEFF;
    --dark-icon-primary: #E7E1E8;

    --primary: var(--dark-color-primary);
    --primary-light: color-mix(in srgb, var(--dark-color-primary) 16%, var(--dark-color-card));
    --primary-dark: var(--dark-color-primary);
    --secondary: var(--dark-text-secondary);
    --success: var(--dark-color-success);
    --success-light: color-mix(in srgb, var(--dark-color-success) 14%, var(--dark-color-card));
    --info: var(--dark-color-info);
    --info-light: color-mix(in srgb, var(--dark-color-info) 14%, var(--dark-color-card));
    --warning: var(--dark-color-warning);
    --warning-light: color-mix(in srgb, var(--dark-color-warning) 12%, var(--dark-color-card));
    --danger: var(--dark-color-error);
    --danger-light: color-mix(in srgb, var(--dark-color-error) 14%, var(--dark-color-card));
    --dark: var(--dark-text-primary);
    --light: var(--dark-color-surface);
    --border-color: var(--dark-input-border);
    --text-muted: var(--dark-text-secondary);
    --box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.4);
    --box-shadow-lg: 0 0.5rem 1rem rgba(0, 0, 0, 0.5);
    --body-bg: var(--dark-color-background);
    --body-text: var(--dark-text-primary);
    --heading-text: var(--dark-text-primary);
    --section-title-underline: color-mix(in srgb, var(--dark-color-primary) 28%, var(--dark-color-card));
    --surface-bg: var(--dark-color-card);
    --surface-shadow: 0 10px 30px rgba(0, 0, 0, 0.45);
    --table-bg: var(--dark-color-card);
    --table-shadow: 0 5px 15px rgba(0, 0, 0, 0.45);
    --table-head-bg: var(--dark-color-chip-bg);
    --table-head-text: var(--dark-color-primary);
    --category-header-bg: var(--dark-color-surface);
    --disclaimer-title: var(--dark-text-secondary);
    --disclaimer-body: var(--dark-text-secondary);
    --disclaimer-border: var(--dark-input-border);
    --info-bg: color-mix(in srgb, var(--dark-color-primary) 10%, var(--dark-color-card));
    --info-shadow-a: color-mix(in srgb, var(--dark-color-card) 92%, black);
    --info-shadow-b: color-mix(in srgb, var(--dark-color-primary) 8%, var(--dark-color-card));
    --info-accent: var(--dark-color-primary);
    --top-card-bg: var(--dark-color-card);
    --top-card-text: var(--dark-text-primary);
    --top-card-deactive-bg: var(--dark-color-surface);
    --top-card-deactive-border: var(--dark-input-border);
    --badge-type-bg: color-mix(in srgb, var(--dark-color-primary) 14%, var(--dark-color-card));
    --badge-type-text: var(--dark-color-primary);
    --badge-mainboard-bg: color-mix(in srgb, var(--dark-color-success) 16%, var(--dark-color-card));
    --badge-mainboard-text: var(--dark-color-success);
    --badge-sme-bg: color-mix(in srgb, var(--dark-color-info) 16%, var(--dark-color-card));
    --badge-sme-text: var(--dark-color-info);
    --badge-border: var(--dark-input-border);

    background-color: var(--dark-color-background) !important;
    color: var(--dark-text-primary);
}

body.ipoji-dark-mode .navbar {
    --fg: var(--dark-text-primary);
    --muted-fg: var(--dark-text-secondary);
    --card: var(--dark-color-card);
    --border-color: var(--dark-input-border);
    background: color-mix(in srgb, var(--dark-color-surface) 92%, transparent);
    border-bottom-color: var(--dark-input-border);
}
body.ipoji-dark-mode .navbar .nav-link:hover { color: var(--dark-text-primary); }

body.ipoji-dark-mode h1,
body.ipoji-dark-mode h2,
body.ipoji-dark-mode h3,
body.ipoji-dark-mode h4,
body.ipoji-dark-mode h5,
body.ipoji-dark-mode h6 { color: var(--dark-text-primary); }

body.ipoji-dark-mode .subscription-container {
    background-color: var(--dark-color-card);
    border-color: var(--dark-input-border);
    box-shadow: var(--surface-shadow);
}
body.ipoji-dark-mode .subscription-container::before {
    background-color: color-mix(in srgb, var(--dark-color-primary) 6%, transparent);
}

/* Tables */
body.ipoji-dark-mode table {
    background-color: var(--dark-color-card);
    box-shadow: var(--table-shadow);
}
body.ipoji-dark-mode table thead {
    background: var(--dark-color-chip-bg) !important;
    color: var(--dark-color-primary) !important;
}
body.ipoji-dark-mode table thead td,
body.ipoji-dark-mode table thead td:hover {
    background: var(--dark-color-chip-bg) !important;
    color: var(--dark-color-primary) !important;
}
body.ipoji-dark-mode table thead th { color: var(--dark-color-primary); }
body.ipoji-dark-mode table tbody tr {
    border-bottom-color: var(--dark-input-border);
}
body.ipoji-dark-mode table tbody td { color: var(--dark-text-primary); }
body.ipoji-dark-mode table tbody tr:hover {
    background-color: var(--primary-light);
}
body.ipoji-dark-mode table tbody tr.total-row {
    background-color: var(--primary-light) !important;
    color: var(--dark-color-primary) !important;
}
body.ipoji-dark-mode table tbody tr.total-row:hover {
    background-color: var(--primary-light) !important;
}
body.ipoji-dark-mode table tbody tr.category-header {
    background-color: var(--dark-color-surface);
    color: var(--dark-color-primary);
}
body.ipoji-dark-mode table tbody tr.category-header:hover {
    background-color: var(--dark-color-surface);
}

/* "Total Applications" text inside total-row */
body.ipoji-dark-mode .text-black { color: var(--dark-text-primary) !important; }
body.ipoji-dark-mode .text-muted { color: var(--dark-text-secondary) !important; }
body.ipoji-dark-mode .text-secondary { color: var(--dark-text-secondary) !important; }

/* Info / summary banner */
body.ipoji-dark-mode .info-section {
    background: var(--info-bg);
    box-shadow: inset 4px 4px 9px var(--info-shadow-a),
                inset -4px -4px 9px var(--info-shadow-b);
}
body.ipoji-dark-mode .info-icon { color: var(--dark-color-primary); }
body.ipoji-dark-mode .info-text { color: var(--dark-color-primary); }

/* Update info bar */
body.ipoji-dark-mode .update-info { color: var(--dark-text-secondary); }
body.ipoji-dark-mode .update-info i { color: var(--dark-color-primary); }

/* Section title underline */
body.ipoji-dark-mode .section-title::after { background: var(--section-title-underline); }

/* Category explanation */
body.ipoji-dark-mode .category-explanation {
    background-color: var(--dark-color-card);
    border-color: var(--dark-input-border);
}
body.ipoji-dark-mode .category-item {
    background-color: var(--dark-color-surface);
    border-left-color: var(--dark-color-primary);
}
body.ipoji-dark-mode .category-item strong { color: var(--dark-color-primary); }
body.ipoji-dark-mode .category-item p { color: var(--dark-text-secondary); }

/* Disclaimer */
body.ipoji-dark-mode .disclaimer-title {
    color: var(--dark-text-secondary);
    border-bottom-color: var(--dark-input-border);
}
body.ipoji-dark-mode .disclaimer-body { color: var(--dark-text-secondary); }
body.ipoji-dark-mode .disclaimer-body strong { color: var(--dark-text-primary); }

/* Price / offer date text */
body.ipoji-dark-mode .price { color: var(--dark-text-primary) !important; }
body.ipoji-dark-mode .offer-date { color: var(--dark-text-secondary); }

/* Footer */
body.ipoji-dark-mode footer.footer {
    --footer-bg: var(--dark-color-background);
    --footer-surface: var(--dark-color-card);
    --footer-foreground: var(--dark-text-primary);
    --footer-muted: var(--dark-text-secondary);
    --footer-accent: var(--dark-color-primary);
    --footer-accent-secondary: var(--dark-tab-indicator);
    --footer-border: var(--dark-input-border);
    --footer-hover: var(--dark-color-chip-bg);
}
.ipoji-dark-mode .ads-container {
    background-color: var(--dark-color-background, #0D0E11) !important;
}