main {
    --light-bg: #F5F6FF;
    --light-bg-2: #F1F4FF;
    --text-color: #000D50;
}

/* Prevent horizontal overflow */
html {
    overflow-x: hidden;
    max-width: 100%;
}

/* .main-container {
    overflow-x: hidden;
    max-width: 100%;
} */
/* demo card styles */
/* DEPRECATED CSS: .demo_card{ */
/* DEPRECATED CSS:     color: #d3d3d3; */
/* DEPRECATED CSS:     .ipo_cover {min-height: 50px; max-width: 100%;} */
/* DEPRECATED CSS:     .badge_span {min-width: 50px;} */
/* DEPRECATED CSS:     .data_box {flex: 0 0 120px;} */
/* DEPRECATED CSS: } */
h1[role="heading"]{font-size: min(calc(1em + 1.5vw), 24px);}
h2[role="heading"]{font-size: min(calc(1em + 1.5vw), 24px); & small{color: #888888; font-size: 75%;}}
h3[role="heading"]{font-size: min(calc(1em + 1vw), 24px);}
.label{color: #888; font-weight: 400; font-size: 14px;}
.price{font-size: calc(1em + 0.5vw); color: var(--color-success); font-weight: 600;}
.data_box{padding-right: 20px; margin-bottom: 20px; & span { white-space: pre-line; overflow: hidden; display: -webkit-box; }}
.subsc_detail{& .line {border-color: #E7E7E7;} & small{font-size: 10px; color: #484848;} & tr td {min-width: 100px;}}
.subscription-card{ & .card{padding: 10px;} & .card-body {column-gap: 40px; row-gap: 0.3rem;}}
.subscription_grid {grid-template-columns: 80px auto 1fr; flex: 1 0 min(100%, 300px); margin-bottom: 5px; & .subsc_label{color: var(--color-primary);}}
.liveSubscription{margin-top: 20px;}
.readMoreBtn{font-weight: 600;}
.companyDesc:not(p), .health_sec, .issue_objectives_sec {margin-top: 40px; padding-bottom: 20px;}
p.companyDesc{
    overflow: hidden;
    max-height: 80px;
    mask-image: -webkit-linear-gradient(#fff 10%, transparent);
    mask-image: -moz-linear-gradient(#fff 10%, transparent);
    mask-image: linear-gradient(#fff 10%, transparent);
    white-space: break-spaces;
    &.showMore{max-height: 100%; mask-image: none;}
}
.card{ --bs-card-border-color: #D6D6D6; --bs-card-border-radius: 8px; --bs-card-bg: #fff; --bs-card-cap-bg: #fff; --bs-card-border-radius: 8px; --bs-card-inner-border-radius: calc(var(--bs-card-border-radius) - (var(--bs-border-width))); }
.ipo_cover{max-width: 80px; & img{max-width: 100%; display: block; margin-bottom: 10px;}}
.table-responsive{
    min-width: 100%;
}
tr th:first-child, tr td:first-child{position: sticky; left: 0; z-index: 1; backdrop-filter: opacity(0);}

/* IPO detail tables theme */
main.container-xxl .premium-card .table {
    --tbl-head-bg: #f2f4ff;
    --tbl-row-bg: #ffffff;
    --tbl-row-alt-bg: #f2f4ff;
    --tbl-border: #e6e8ff;
    --tbl-accent: #6055cd;
    margin-bottom: 0;
    border-color: var(--tbl-border);
    /* hard override Bootstrap table vars */
    --bs-table-bg: #ffffff;
    --bs-table-striped-bg: #ffffff;
    --bs-table-striped-color: #0f172a;
    --bs-table-active-bg: rgba(96, 85, 205, 0.08);
    --bs-table-hover-bg: rgba(96, 85, 205, 0.08);
    --bs-table-hover-color: #0f172a;
}
main.container-xxl .premium-card .table thead th {
    background: var(--tbl-head-bg) !important;
    color: var(--tbl-accent) !important;
    font-weight: 700;
    letter-spacing: 0.04em;
    font-size: 14px;
    border-bottom: 1px solid var(--tbl-border);
    vertical-align: middle;
}
main.container-xxl .premium-card .table tbody td {
    background: var(--tbl-row-bg);
    color: #0f172a;
    border-bottom: 1px solid rgba(230, 232, 255, 0.9);
    vertical-align: middle;
    font-size: 14px;
}
/* No zebra style (keep all rows white) */
main.container-xxl .premium-card .table-striped > tbody > tr:nth-of-type(odd) > * {
    background: var(--tbl-row-bg) !important;
}

/* Extra safety: remove zebra anywhere inside IPO detail main */
main.container-xxl .table-striped {
    --bs-table-striped-bg: #ffffff !important;
}
main.container-xxl .table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: #ffffff !important;
    background-image: none !important;
}
main.container-xxl .premium-card .table-hover > tbody > tr:hover > * {
    background: inherit !important;
}
/* Sticky first column should match row background */
main.container-xxl .premium-card .table thead th:first-child {
    background: var(--tbl-head-bg) !important;
    z-index: 3;
}
main.container-xxl .premium-card .table tbody td:first-child {
    background: inherit !important;
    z-index: 2;
    font-weight: 600;
    color: #111827;
}

/* DEPRECATED CSS: .health_card{max-width: 600px; margin-bottom: 20px;} */
/* DEPRECATED CSS: .health_card .card { */
/* DEPRECATED CSS:     --bs-card-border-radius: 8px; */
/* DEPRECATED CSS:     --bs-card-inner-border-radius: calc(var(--bs-card-border-radius) - (var(--bs-border-width))); */
/* DEPRECATED CSS:     --bs-card-cap-color: var(--color-primary); */
/* DEPRECATED CSS:     --bulletColor: #3CCC21; */
/* DEPRECATED CSS:     --bs-card-cap-padding-y: 1rem; */
/* DEPRECATED CSS:     --bs-card-cap-padding-x: 2rem; */
/* DEPRECATED CSS:     --bs-card-spacer-x: 2rem; */
/* DEPRECATED CSS:  */
/* DEPRECATED CSS:     p[data-company-health="strength"]{--bulletColor: #3CCC21;} */
/* DEPRECATED CSS:     p[data-company-health="weakness"]{--bulletColor: #FF5C63;} */
/* DEPRECATED CSS:     p[role="listitem"] {padding-left: 30px; position: relative;} */
/* DEPRECATED CSS:     p[role="listitem"]::before {width: 10px; height: 10px; border-radius: 100vw; background-color: var(--bulletColor); content: ''; position: absolute; left: 0; top: 8px; box-shadow: 0 0 3px 0px var(--bulletColor), 0 0 6px 1px var(--bulletColor);} */
/* DEPRECATED CSS: } */

.top_card .card:not(.demo_card){
    --bs-card-border-radius: 8px; --bs-card-bg: #fff; color: #000D50;
    & .card-body{border-radius: 0 0 7px 7px;}
    &.deactive{--bs-card-bg: #f2f2f2;--bs-card-border-color: #f2f2f2;}
}
.applyBtn, .submitBtn{
    --bs-btn-bg: var(--color-primary);
    --bs-btn-border-color: var(--color-primary);
    --bs-btn-color: var(--color-primary-contrast);
    --bs-btn-hover-border-color: var(--color-primary-active);
    --bs-btn-hover-bg: var(--color-primary-active);
    --bs-btn-hover-color: var(--color-primary-contrast);
    /* --bs-btn-border-radius: 0; */
    --bs-btn-font-weight: 600;
    --bs-btn-font-size: 1em;
    min-width: 100px;
}
.sideCard{margin-left: 24px; width: 400px; max-width: 100%; display: none; position: sticky; top: 100px; max-height: calc(100dvh - 150px); overflow-x: hidden;}
    .applyDiv{overflow-y: auto;
        /* Firefox */
        scrollbar-width: thin; /* makes it minimal */
        scrollbar-color: #6055cd transparent; /* thumb color + transparent track */

        /* WebKit (Chrome, Edge, Safari) */
    }
    .applyDiv::-webkit-scrollbar{width: 8px; background: transparent;}
    .applyDiv::-webkit-scrollbar-track{background: transparent;}
    .applyDiv::-webkit-scrollbar-thumb{background-color: #6055cd; border-radius: 8px; border: 2px solid transparent; background-clip: content-box;}
    .applyDiv::-webkit-scrollbar-corner{background: transparent;}

.valuation_card {
    overflow: hidden;
    .bordered{position: relative; padding-block: 10px;}
    .bordered:nth-of-type(odd)::after{ position: absolute; content: ''; height: 100%; top: 0; right: 0; left: auto; background-color: #ddd; width: 1px; }
    .bordered::before{ position: absolute; content: ''; height: 1px; top: auto; bottom: 0; background-color: #ddd; width: 100vw; left: -5%; }
    p{float: left; margin-right: 20px; width: 100px; padding-right: 10px; position: relative; &::after{content: ':'; position: absolute; right: 0;} }
}

.otherCard{
    width: 100%;
    max-width: 420px;
    & .card{
        --bs-card-border-color: #D6D6D6;
        --bs-card-border-radius: 8px;
        --bs-card-inner-border-radius: calc(var(--bs-card-border-radius) - (var(--bs-border-width)));
        --bs-card-cap-color: var(--color-primary);
        --bs-card-cap-padding-y: 1rem;
        --bs-card-cap-padding-x: 2rem;
        --bs-card-spacer-x: 2rem;
    }
    & .card-header span{font-weight: 600; font-size: calc(1em + 0.11vw);}
    & span[aria-label="lable"]{width: 85px; display: inline-block;}
    & .orgName{ font-size: calc(1em + 0.11vw);}
}

[role="tab"]{display: inline-flex; border-bottom: 2px solid transparent; padding: 5px 0; cursor: pointer; color: #888; font-weight: 600; &.active, &:hover{color: var(--color-primary); border-color: var(--color-primary);}}
.viewActions .tabBtn{
    --bs-btn-bg: var(--light-bg);
    --bs-btn-color: var(--color-primary);
    --bs-btn-border-color: var(--color-primary);
    --bs-btn-hover-border-color: var(--color-primary-active);
    --bs-btn-hover-color: var(--color-primary-contrast);
    --bs-btn-hover-bg: var(--color-primary);
    --bs-btn-focus-box-shadow: none;
    --bs-btn-active-bg: var(--color-primary);
    --bs-btn-active-color: var(--color-primary-contrast);
    --bs-btn-active-border-color: var(--color-primary-active);
}
address{text-wrap: balance;}
ol{list-style-position: inside; padding-left: 0;}
.ipo_rating{ align-self: center; margin-right: 10px; & i{color: var(--color-warning, #FFAF20);}}
.badge_span{font-size: 12px; font-weight: 600; padding: 5px 10px; border-radius: 4px; display: flex; align-items: center; justify-content: center; gap: 5px;}
span[data-role="status"]{
    --bgColor: var(--color-success-light);
    --textColor: var(--color-success);
    background-color: var(--bgColor);
    color: var(--textColor);
}
span[data-role="type"], .viewBtn {background-color: var(--color-glow-purple); border-radius: 4px; color: var(--color-tertiary);}
span[data-ipotype="Mainboard"]{background-color: #5e783d; color: #ffffff;}
span[data-ipotype="BSE SME"]{background-color: #1b387a; color: #fff;}

@media screen and (min-width: 450px) {.extra_spacer {width: 90px;}}

@media screen and (min-width: 768px) {
    .top_card .card{--bs-card-spacer-y: 2rem; --bs-card-spacer-x: 2rem;}
    .top_card .card-body{
        display: grid;
        grid-template-columns: auto 200px;
        & .ipo_cover{max-width: 100px; display: flex; align-items: center; margin-bottom: auto; margin-top: 20px; & img {max-width: 100%; object-fit: contain;}}
        & .price_sec{justify-content: flex-end !important;}
        & .ipo_cover + div {max-width: calc(100% - 115px - 1rem);}
    }
    .ipo_cover{max-width: 100px;}
    .extra_spacer {display: none;}
    .liveSubscription{margin-top: 50px;}
    .subscription-card .card-body {row-gap: 1rem;}
}
@media screen and (min-width: 1100px) {
    .basic_section{display: flex;}
    div[data-position="left"]{ flex: 0 0 calc(1320px - var(--width, 240px)); }
    .sideCard{display: flex; flex-direction: column;}
    .applyBtn:not(.allotBtn){display: none;}
}
  
.ipo-table th, .ipo-table td { padding: 8px;}
.ipo-table-container { overflow-x: auto; }
/* .chart_card{max-width: 650px;} */
.mat-stepper, .peer_sec{max-width: calc(100vw - 1.5rem); overflow-x: hidden;}
#accountForm2 label.error, label.error {
    color: red;
    font-style: italic;
}

.ad-container {
    text-align: center; /* Center the ad container */
    width: 100%; /* Ensure the container takes full width */
}

.desktop-ad, .mobile-ad {
    display: none; /* Hide both ads by default */
}

.ad-padding {
    padding-top: 8px;
    padding-bottom: 8px;
}

@media (min-width: 1024px) {
    .desktop-ad {
        display: inline-block; /* Show desktop ad on larger screens */
        /* Ensure smaller desktop ads are centered within the container */
        text-align: center;
    }

    .desktop-ad img {
        display: block; /* Ensure image is treated as a block element */
        margin: 0 auto; /* Center the image horizontally */
    }
}

@media (max-width: 1023px) {
    .mobile-ad {
        display: inline-block; /* Show mobile ad on smaller screens */
        /* Ensure smaller mobile ads are centered within the container */
        text-align: center;
    }
}
.update-info {
    /* width: 80%; */
    /* margin-left: 10%; */
    text-align: center;
    /* background: linear-gradient(135deg, rgba(96, 85, 205, 0.1) 0%, rgba(124, 58, 237, 0.1) 100%); */
    border-radius: 10px;
    padding: 0.5rem;
  
    /* border-left: 4px solid var(--primary); */
    font-size: 0.875rem;
    color: var(--text-muted);
    i{
      color: var(--primary);
      margin-right: 0.5rem;
    }
    
  }
  .offer-date {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: var(--text-secondary);
    font-weight: 500;
}

/* Subscription Summary Section Styles */
.subscription-summary-section {
    background: linear-gradient(135deg, #f8f9ff 0%, #f1f4ff 100%);
    border-radius: 12px;
    padding: 0.5rem;
    /* margin: 1rem 0; */
    border: 1px solid #e3e8ff;
    box-shadow: 0 4px 12px rgba(0, 13, 80, 0.08);
}

.subscription-summary-section h6 {
    color: var(--text-color);
    font-weight: 600;
    /* margin-bottom: 1.5rem; */
    font-size: 1.1rem;
}

.subscription-info-card {
    /* background: white; */
    border-radius: 10px;
    /* padding: 1.25rem; */
    /* border: 1px solid #e8ecff; */
    /* box-shadow: 0 2px 8px rgba(0, 13, 80, 0.06); */
    transition: all 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* .subscription-info-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 13, 80, 0.12);
    border-color: #d1d9ff;
} */

.info-label {
    color: #6b7280;
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
}

.info-label i {
    color: var(--color-primary);
    font-size: 0.85rem;
}

.info-value {
    color: var(--text-color);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .subscription-summary-section {
        padding: 0.5rem;
        margin-bottom: 0.25rem;
    }
    
    .subscription-info-card {
        padding: 0.5rem;
        margin-bottom: 0.25rem;
    }
    
    .info-value {
        font-size: 1.1rem;
    }
    
    .subscription-summary-section h6 {
        font-size: 1rem;
        margin-bottom: 1rem;
    }
}

@media (max-width: 576px) {
    .subscription-summary-section {
        padding: 0.5rem;
    }
    
    .subscription-info-card {
        padding: 0.75rem;
    }
    
    .info-label {
        font-size: 0.85rem;
    }
    
    .info-value {
        font-size: 1rem;
    }
}
.detail-list li :last-child {
    width: 70%;
}
.detail-list li :first-child {
    /* width: 30%; */
}
.detail-list dd {
    width: 70%;
}
tbody tr td:first-child {
    background-color: #FFFFFF !important;
}