/* Bharat Dental Show — self-contained chrome (topbar, navbar, footer).
   Plain CSS, no Tailwind dependency, so it renders correctly on every page
   (including the Bootstrap-based inner pages) without affecting their styles.
   All selectors are scoped under .bds- prefixes. */

:root {
    --bds-blue: #1f5fa6;
    --bds-blue-dk: #15457c;
    --bds-teal: #16857f;
    --bds-rose: #df9a86;
    --bds-rose-dk: #c8735c;
    --bds-ink: #101b2b;
    --bds-ink-3: #5d6b7a;
    --bds-ink-4: #97a3b1;
    --bds-line: #e6ebf1;
    --bds-bg: #ffffff;
    --bds-bg-2: #f5f8fb;
    --bds-shadow-blue: 0 18px 40px -18px rgba(31, 95, 166, .55);
}

/* ---- Modern preloader ---- */
/* Hide the legacy Bootstrap spinner on BDS pages; the branded preloader replaces it. */
#loader { display: none !important; }

/* Hide the app's default PWA chrome (page header bar, search, bottom nav, legacy footer)
   on BDS pages — the BDS navbar/footer replace them. */
.appHeader,
#search,
#appBottomMenu,
.appBottomMenu,
.modern-bottom-nav,
.modern-footer { display: none !important; }

.bds-preloader {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: grid;
    place-items: center;
    background: var(--bds-bg, #fff);
    transition: opacity .5s ease, visibility .5s ease;
}
.bds-preloader.is-done { opacity: 0; visibility: hidden; }

.bds-preloader__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
}
.bds-preloader__logo {
    width: 160px;
    max-width: 60vw;
    height: auto;
    object-fit: contain;
    animation: bds-pre-float 2s ease-in-out infinite;
}
@keyframes bds-pre-float {
    0%, 100% { transform: translateY(0); opacity: 1; }
    50% { transform: translateY(-5px); opacity: .82; }
}
.bds-preloader__track {
    position: relative;
    width: 190px;
    max-width: 60vw;
    height: 4px;
    border-radius: 9999px;
    background: var(--bds-line, #e6ebf1);
    overflow: hidden;
}
.bds-preloader__fill {
    position: absolute;
    top: 0;
    left: -42%;
    height: 100%;
    width: 42%;
    border-radius: 9999px;
    background: linear-gradient(90deg, var(--bds-blue, #1f5fa6), var(--bds-teal, #16857f), var(--bds-rose, #df9a86));
    animation: bds-pre-slide 1.15s cubic-bezier(.45, 0, .55, 1) infinite;
}
@keyframes bds-pre-slide {
    0% { left: -42%; }
    100% { left: 100%; }
}
@media (prefers-reduced-motion: reduce) {
    .bds-preloader__logo { animation: none; }
    .bds-preloader__fill { left: 0; width: 100%; animation: none; }
}

/* ---- Announcement marquee ---- */
.bds-topbar {
    background: var(--bds-ink);
    color: #fff;
    overflow: hidden;
    font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
}
.bds-marquee {
    display: flex;
    gap: 2.5rem;
    padding-block: .5rem;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .04em;
    white-space: nowrap;
    animation: bds-marq 36s linear infinite;
}
.bds-marquee > div {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-shrink: 0;
}
.bds-marquee .sep { color: var(--bds-rose); }
@keyframes bds-marq {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
    .bds-marquee { animation: none; }
}

/* ---- Layout container ---- */
.bds-container {
    max-width: 1240px;
    margin-inline: auto;
    padding-inline: 1.25rem;
}
@media (min-width: 768px) {
    .bds-container { padding-inline: 2rem; }
}

/* ---- Header / navbar ---- */
.bds-header {
    position: sticky;
    top: 0;
    z-index: 40;
    background: rgba(255, 255, 255, .82);
    backdrop-filter: blur(14px) saturate(150%);
    -webkit-backdrop-filter: blur(14px) saturate(150%);
    border-bottom: 1px solid var(--bds-line);
    font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
}
.bds-header-inner {
    display: flex;
    align-items: center;
    gap: 1rem;
    height: 70px;
}
.bds-logo { display: inline-flex; align-items: center; margin-right: auto; }
.bds-logo img { height: 44px; width: auto; object-fit: contain; display: block; }

.bds-nav { display: none; align-items: center; gap: .25rem; margin-left: 2rem; margin-right: auto; }
.bds-nav a {
    padding: .5rem .875rem;
    border-radius: 9999px;
    font-size: .875rem;
    font-weight: 600;
    color: var(--bds-ink);
    text-decoration: none;
    transition: background .15s ease;
}
.bds-nav a:hover { background: var(--bds-bg-2); }

/* ---- Nav dropdowns / mega menu ---- */
.bds-nav__group { position: relative; display: inline-flex; }
.bds-nav__toggle {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .5rem .875rem;
    border-radius: 9999px;
    border: 0;
    background: transparent;
    color: var(--bds-ink);
    font: inherit;
    font-size: .875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s ease;
}
.bds-nav__toggle:hover { background: var(--bds-bg-2); }
.bds-nav__caret { width: 12px; height: 12px; opacity: .7; transition: transform .15s ease; }
.bds-nav__group:hover .bds-nav__caret,
.bds-nav__group:focus-within .bds-nav__caret { transform: rotate(180deg); }

.bds-menu {
    position: absolute;
    top: calc(100% + .4rem);
    left: 0;
    min-width: 240px;
    background: #fff;
    border: 1px solid var(--bds-line);
    border-radius: 14px;
    box-shadow: 0 24px 50px -24px rgba(16, 27, 43, .35);
    padding: .5rem;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
.bds-menu--right { left: auto; right: 0; }
.bds-nav__group:hover > .bds-menu,
.bds-nav__group:focus-within > .bds-menu,
.bds-menu.open { opacity: 1; visibility: visible; transform: none; }
.bds-menu a, .bds-menu button {
    display: flex;
    align-items: center;
    gap: .6rem;
    width: 100%;
    padding: .6rem .75rem;
    border: 0;
    border-radius: 9px;
    background: transparent;
    font: inherit;
    font-size: .875rem;
    color: var(--bds-ink);
    text-decoration: none;
    text-align: left;
    cursor: pointer;
}
.bds-menu a:hover, .bds-menu button:hover { background: var(--bds-bg-2); color: var(--bds-blue); }
.bds-menu .bds-menu__head { padding: .5rem .75rem .25rem; }
.bds-menu .bds-menu__name { font-size: .875rem; font-weight: 600; }
.bds-menu .bds-menu__email { font-size: .75rem; color: var(--bds-ink-3); word-break: break-all; }
.bds-menu__divider { height: 1px; background: var(--bds-line); margin: .4rem 0; }
.bds-menu__danger:hover { color: var(--bds-rose-dk) !important; }

/* ---- Account trigger ---- */
.bds-account {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .35rem .75rem .35rem .4rem;
    border-radius: 9999px;
    border: 1px solid var(--bds-line);
    background: var(--bds-bg);
    color: var(--bds-ink);
    font: inherit;
    font-size: .875rem;
    font-weight: 600;
    cursor: pointer;
}
.bds-account:hover { background: var(--bds-bg-2); }
.bds-account__avatar {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 9999px;
    background: var(--bds-blue);
    color: #fff;
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
}
.bds-signin {
    color: var(--bds-ink);
    text-decoration: none;
    font-size: .875rem;
    font-weight: 600;
    padding: .5rem .5rem;
}
.bds-signin:hover { color: var(--bds-blue); }

/* ---- Mobile menu groups ---- */
.bds-mobile-menu__head {
    margin-top: .5rem;
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--bds-ink-4);
    padding-block: .35rem;
}
.bds-mobile-menu__sub { padding-left: .75rem; font-weight: 500 !important; }
.bds-mobile-menu__divider { height: 1px; background: var(--bds-line); margin: .5rem 0; }
.bds-mobile-menu form { margin: 0; }

.bds-actions { margin-left: auto; display: flex; align-items: center; gap: .5rem; }

.bds-btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    background: var(--bds-blue);
    color: #fff;
    text-decoration: none;
    padding: .9rem 1.5rem;
    border-radius: 9999px;
    font-weight: 600;
    font-size: .95rem;
    border: 0;
    cursor: pointer;
    box-shadow: var(--bds-shadow-blue);
    transition: transform .15s ease, background .2s ease;
}
.bds-btn-primary:hover { transform: translateY(-2px); background: var(--bds-blue-dk); color: #fff; }
.bds-btn-primary.bds-btn-sm { padding: .625rem 1.25rem; font-size: .875rem; }
.bds-cta-desktop { display: none; }

.bds-menu-toggle {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 9999px;
    border: 1px solid var(--bds-line);
    background: var(--bds-bg);
    color: var(--bds-ink);
    cursor: pointer;
}

.bds-mobile-menu {
    display: none;
    border-top: 1px solid var(--bds-line);
    background: var(--bds-bg);
}
.bds-mobile-menu.open { display: block; }
.bds-mobile-menu .bds-container { display: flex; flex-direction: column; padding-block: .75rem; }
.bds-mobile-menu a {
    padding-block: .625rem;
    font-size: .875rem;
    font-weight: 600;
    color: var(--bds-ink);
    text-decoration: none;
}
.bds-mobile-menu .bds-btn-primary { margin-top: .75rem; }

@media (min-width: 640px) {
    .bds-cta-desktop { display: inline-flex; }
}
@media (min-width: 768px) {
    .bds-nav { display: flex; }
    .bds-menu-toggle { display: none; }
    .bds-mobile-menu { display: none !important; }
}

/* ---- Footer ---- */
.bds-footer {
    border-top: 1px solid var(--bds-line);
    background: var(--bds-bg-2);
    font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
    color: var(--bds-ink);
}
.bds-footer-grid {
    display: grid;
    gap: 2.5rem;
    padding-block: 3.5rem;
    grid-template-columns: 1fr;
}
@media (min-width: 768px) {
    .bds-footer-grid { grid-template-columns: 1.6fr 1fr 1fr 1fr; }
}
.bds-footer img.bds-footer-logo { height: 64px; width: auto; object-fit: contain; display: block; }
.bds-footer p { margin: 0; }
.bds-footer-tagline { margin-top: 1.25rem; max-width: 24rem; font-size: .875rem; color: var(--bds-ink-3); }

.bds-subscribe { margin-top: 1.25rem; display: flex; gap: .5rem; max-width: 24rem; }
.bds-subscribe input {
    flex: 1;
    border-radius: 9999px;
    padding: .625rem 1rem;
    font-size: .875rem;
    background: var(--bds-bg);
    border: 1px solid var(--bds-line);
    color: var(--bds-ink);
}

.bds-social { margin-top: 1.25rem; display: flex; align-items: center; gap: .5rem; }
.bds-social a {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 9999px;
    border: 1px solid var(--bds-line);
    color: var(--bds-ink);
}
.bds-footer-col h4 {
    margin: 0 0 1rem;
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--bds-ink-3);
}
.bds-footer-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .625rem; }
.bds-footer-col a { font-size: .875rem; color: var(--bds-ink); text-decoration: none; }
.bds-ulink:hover { text-decoration: underline; text-underline-offset: 3px; }

.bds-footer-bottom { border-top: 1px solid var(--bds-line); }
.bds-footer-bottom .bds-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding-block: 1.25rem;
    font-size: .75rem;
    color: var(--bds-ink-3);
}
@media (min-width: 640px) {
    .bds-footer-bottom .bds-container { flex-direction: row; }
}