/* Directory and gallery refinements, October 2026. */
@layer dio-typography {
    html body.dio-site .dio-name-card h3 { font-size: 1rem !important; line-height: 1.55 !important; font-weight: 500 !important; }
    html body.dio-site .consultors-section .priest-name { font-size: 1.125rem !important; line-height: 1.5 !important; }
    html body.dio-site .dio-photo-viewer h2 { font-size: 1rem !important; line-height: 1.45 !important; color: #fff !important; }
}
body.dio-site .dio-name-card { align-items: flex-start; gap: .85rem; padding: 1.1rem; height: 100%; min-height: 100px; }
body.dio-site .dio-name-card > span { flex: 0 0 2rem; width: 2rem; height: 2rem; font-size: .8rem; }
body.dio-site .dio-name-card h3 { padding-top: .2rem; min-width: 0; }
body.dio-site .consultors-section .priest-image { height: clamp(260px, 25vw, 330px); background: #f4f1eb; }
body.dio-site .consultors-section .priest-image img.priest-photo { display: block; width: 100%; height: 100% !important; object-fit: contain; object-position: center; padding: .75rem .75rem 4px; transform: none; }
body.dio-site .consultors-section .priest-info { padding: 1.25rem 1rem; }
.dio-consultor-placeholder { display: flex; height: 100%; flex-direction: column; gap: 1rem; align-items: center; justify-content: center; background: linear-gradient(145deg, #fff9eb, #eee5d6); color: #795940; }
.dio-consultor-initials { display: grid; place-items: center; width: 5rem; height: 5rem; border: 1px solid #c8b18a; border-radius: 50%; background: #fff9; font-size: 1.6rem; font-weight: 500; }
.dio-consultor-placeholder small { font-size: .85rem; }
body.dio-site .modal-header .btn-close { filter: none; opacity: 1; flex-shrink: 0; background-color: #fff; border: 1px solid #ccc; border-radius: .5rem; background-size: 1rem; margin-left: .75rem; }
body.dio-site .modal-header .btn-close:hover { background-color: #eee; }
body.dio-site .modal-header { position: sticky; top: 0; z-index: 2; background-color: #f3f3f3; }
.dio-album-open { display: block; cursor: zoom-in; background: #f4f4f4; }
.dio-album-open:focus-visible { outline-offset: -4px !important; }
body.dio-site .dio-photo-viewer .modal-dialog { width: 100%; max-width: none; height: 100%; min-height: 100%; margin: 0; }
body.dio-site .dio-photo-viewer .modal-content { height: 100dvh; max-height: 100dvh; overflow: hidden; border: 0; border-radius: 0; background: #101316; color: #fff; }
.dio-viewer-header, .dio-viewer-footer { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex: 0 0 auto; padding: .75rem max(1rem, env(safe-area-inset-right)) .75rem max(1rem, env(safe-area-inset-left)); }
.dio-viewer-header h2 { margin: 0; max-width: 70ch; }
body.dio-site .dio-photo-viewer button { display: grid; place-items: center; min-width: 48px; min-height: 48px; width: 48px; height: 48px; flex-shrink: 0; padding: 0; border: 1px solid #ffffff70; border-radius: 50%; background: #242a30; color: #fff; box-shadow: none; font-size: 1.5rem; line-height: 1; }
body.dio-site .dio-photo-viewer button:hover { background: #454f59; }
body.dio-site .dio-photo-viewer button:focus-visible, body.dio-site .dio-photo-viewer a:focus-visible { outline-color: #ffd580; }
.dio-viewer-stage { position: relative; flex: 1 1 auto; min-height: 0; display: flex; align-items: center; justify-content: center; padding: .5rem 5rem; touch-action: pan-y; }
body.dio-site .dio-viewer-image { display: block; width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.dio-viewer-prev, .dio-viewer-next { position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; }
.dio-viewer-prev { left: max(.75rem, env(safe-area-inset-left)); }
.dio-viewer-next { right: max(.75rem, env(safe-area-inset-right)); }
.dio-viewer-footer { flex-wrap: wrap; padding-bottom: max(.75rem, env(safe-area-inset-bottom)); font-size: .9rem; }
body.dio-site .dio-viewer-original { display: inline-flex; align-items: center; min-height: 44px; color: #fff; text-decoration: underline; }
.dio-viewer-error { text-align: center; padding: 1rem; }
.dio-viewer-error[hidden] { display: none; }
@media (max-width: 575.98px) {
    body.dio-site .dio-name-card { min-height: 0; }
    .dio-viewer-stage { padding: .25rem .5rem; }
    .dio-viewer-prev, .dio-viewer-next { top: auto; bottom: .5rem; transform: none; }
    body.dio-site .dio-photo-viewer button { background: #161c24df; }
    .dio-viewer-header, .dio-viewer-footer { gap: .5rem; }
}

/* Let the contact strip scroll away while the main navigation stays visible. */
body.dio-site { padding-top: 0 !important; overflow-x: clip !important; }
body.dio-site .top-header { position: static !important; top: auto !important; z-index: auto !important; }
body.dio-site .main-navbar { position: sticky !important; top: 0 !important; z-index: 1030 !important; }

/* Footer links stay readable on phones; legal and credit lines stay compact. */
@layer dio-typography {
    html body.dio-site .warangal-footer-bottom :is(h6, p, a) {
        font-size: .75rem !important;
        line-height: 1.5 !important;
        font-weight: 400 !important;
    }
    @media (max-width: 767.98px) {
        html body.dio-site .warangal-footer .warangal-footer-heading {
            font-size: 1.125rem !important;
            line-height: 1.4 !important;
        }
        html body.dio-site .warangal-footer .warangal-footer-links a {
            font-size: 1.0625rem !important;
            line-height: 1.5 !important;
        }
    }
}
body.dio-site .warangal-footer-bottom :is(h6, p) { margin: 0; }
@media (max-width: 767.98px) {
    body.dio-site .warangal-footer .warangal-footer-links a {
        display: flex;
        align-items: center;
        min-height: 44px;
        padding-block: .375rem;
    }
}

/* Homepage video selection uses the existing three video cards on phones. */
body.dio-site .dio-home-video-carousel[hidden] { display: none !important; }
@media (max-width: 767.98px) {
    body.dio-site .dio-video-enhanced .warangal-video-gallery-row { display: none !important; }
    body.dio-site .dio-home-video-carousel { touch-action: pan-y; }
    body.dio-site .dio-home-video-carousel .warangal-video-card {
        width: 100%; height: auto !important; aspect-ratio: 16 / 9;
    }
    body.dio-site .dio-home-video-dots {
        position: static; display: flex; align-items: center; justify-content: center;
        margin: .5rem 0 0; gap: 0;
    }
    body.dio-site .dio-home-video-dots [data-bs-slide-to] {
        display: grid; place-items: center; box-sizing: border-box;
        width: 14px; height: 32px; min-width: 14px; min-height: 32px;
        padding: 0; margin: 0; border: 0; background: transparent;
        opacity: 1; text-indent: 0; box-shadow: none; border-radius: 50%;
    }
    body.dio-site .dio-home-video-dots button::before {
        content: ''; display: block; width: 6px; height: 6px;
        border-radius: 50%; background: #aab2ba;
    }
    body.dio-site .dio-home-video-dots button.active::before { background: #ba2028; }
    body.dio-site .dio-home-video-dots button:focus-visible { outline-offset: 0; }
    .dio-home-video-count { text-align: center; color: #5b5860; font-size: .875rem; line-height: 1.5; }
}


/* A gentler zoom on phone and tablet banners, synchronized to the home slides. */
@keyframes dio-mobile-banner-zoom {
    from { transform: scale(1.04); }
    to { transform: scale(1); }
}
@media (max-width: 1023.98px) and (prefers-reduced-motion: no-preference) {
    body.dio-site .banner-carousel .carousel-item { overflow: hidden; }
    body.dio-site .banner-carousel .carousel-item:is(.active, .carousel-item-next, .carousel-item-prev) > img {
        transform-origin: center;
        animation: dio-mobile-banner-zoom 4s ease-out both;
        will-change: transform;
    }
}

/* Keep dropdowns at the right edge fully inside the desktop viewport. */
body.dio-site .dio-nav-dropdown:nth-last-child(-n + 2) > .dio-dropdown-menu {
    inset-inline-start: auto;
    inset-inline-end: 0;
}
/* Institute directories retain paired label/value columns at every width. */
body.dio-site .dio-institute-directory table.holy-table {
    display: table !important;
    width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed !important;
}
body.dio-site .dio-institute-directory table.holy-table tbody {
    display: table-row-group !important;
    width: auto !important;
}
body.dio-site .dio-institute-directory table.holy-table tr {
    display: table-row !important;
    width: auto !important;
    margin: 0 !important;
}
body.dio-site .dio-institute-directory table.holy-table :is(td, th) {
    display: table-cell !important;
    width: auto !important;
    vertical-align: top;
    padding: .625rem .75rem;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal;
}
body.dio-site .dio-institute-directory table.holy-table :is(td, th):first-child {
    width: 44% !important;
}
body.dio-site .dio-institute-directory table.holy-table :is(td, th):last-child {
    width: 56% !important;
}

@layer dio-typography {
    @media (max-width: 767.98px) {
        html body.dio-site .dio-institute-directory table.holy-table :is(td, th) {
            font-size: .875rem !important;
            line-height: 1.55 !important;
        }
    }
}
@media (max-width: 767.98px) {
    body.dio-site .dio-institute-directory table.holy-table :is(td, th) { padding: .5rem; }
    body.dio-site .dio-institute-directory table.holy-table :is(td, th):first-child { width: 48% !important; }
    body.dio-site .dio-institute-directory table.holy-table :is(td, th):last-child { width: 52% !important; }
}

/* Wide tables scroll inside their own container on phones. */
body.dio-site .dio-content-shell .dio-table-scroll {
    max-width: 100%;
    min-width: 0;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}
@media (max-width: 767.98px) {
    body.dio-site .dio-institute-directory table.holy-table { min-width: 600px !important; }
    body.dio-site .dio-institute-directory table.holy-table :is(td, th):first-child { width: 32% !important; }
    body.dio-site .dio-institute-directory table.holy-table :is(td, th):last-child { width: 68% !important; }
}

/* Requested home banner, news, contact and committee layout corrections. */
body.dio-site .dio-home .banner-carousel {
    width: calc(100% + 24px);
    max-width: none;
    margin-inline: -12px;
    padding: 0;
}
body.dio-site .warangal-news-dots[hidden] { display: none; }
body.dio-site .warangal-news-dots .warangal-news-dot {
    display: inline-grid;
    place-items: center;
    width: 24px;
    height: 32px;
    min-width: 24px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}
body.dio-site .warangal-news-dots { gap: 0; }
body.dio-site .warangal-news-dot::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #bfc5cb;
}
body.dio-site .warangal-news-dot.active::before { background: #b82027; }
body.dio-site #dioNewsCarousel .carousel-inner { padding-bottom: 1px; }
body.dio-site #dioNewsCarousel .row { margin-top: 0; }
@media (max-width: 991.98px) {
    body.dio-site #dioNewsCarousel .row > :nth-child(n+3) { display: none; }
}
@media (max-width: 767.98px) {
    body.dio-site #dioNewsCarousel .row > :nth-child(n+2) { display: none; }
}
html body.dio-site .dio-connect-page a,
html body.dio-site .dio-connect-page a:hover,
html body.dio-site .dio-connect-page a:focus { text-decoration: none; }
body.dio-site .committes table {
    display: table !important;
    min-width: 32rem !important;
    table-layout: auto !important;
    margin-bottom: 0;
}
body.dio-site .committes table thead { display: table-header-group !important; }
body.dio-site .committes table tbody { display: table-row-group !important; }
body.dio-site .committes table tr {
    display: table-row !important;
    width: auto !important;
}
body.dio-site .committes table :is(th, td) {
    display: table-cell !important;
    width: auto !important;
    padding: .625rem .75rem;
    vertical-align: middle;
    white-space: normal !important;
    overflow-wrap: normal !important;
}
body.dio-site .committes table :is(th, td):first-child { width: 4rem !important; }
