/*
 * RoyayeFilm enhancements
 * Safe layer loaded after legacy style.css.
 * Existing banner styles intentionally remain untouched in header.php.
 */

:root {
    --ry-bg: #070d1a;
    --ry-panel: #0d1f3c;
    --ry-panel-2: #111827;
    --ry-blue: #38bdf8;
    --ry-blue-strong: #1a90ff;
    --ry-text: #e2e8f0;
    --ry-muted: #94a3b8;
    --ry-border: rgba(96, 165, 250, 0.16);
}

/* Header logo: exact rules moved out of inline PHP to keep presentation centralized. */
@keyframes logoGlowPulse {
    0%, 100% { filter: drop-shadow(0 0 8px rgba(56,189,248,0.5)) drop-shadow(0 0 16px rgba(56,189,248,0.25)); }
    50% { filter: drop-shadow(0 0 14px rgba(56,189,248,0.8)) drop-shadow(0 0 28px rgba(56,189,248,0.4)); }
}
.navbar-brand img {
    border-radius: 0 !important;
    border: none !important;
    width: 140px !important;
    height: auto !important;
    animation: logoGlowPulse 3s ease-in-out infinite;
}

/* Shared pagination: replaces identical copies from multiple page templates. */
.archive-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin: 30px 0;
    direction: rtl;
    flex-wrap: wrap;
}
.archive-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: #0d1f3c;
    border: 1px solid rgba(96,165,250,0.15);
    color: #94a3b8;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    transition: all 0.2s;
}
.archive-pagination .page-numbers:hover {
    background: #1e3a8a;
    border-color: #3b82f6;
    color: #fff;
}
.archive-pagination .page-numbers.current {
    background: linear-gradient(135deg, #0e7490, #1e3a8a);
    border-color: #38bdf8;
    color: #fff;
    box-shadow: 0 0 12px rgba(14,116,144,0.4);
}
.archive-pagination .page-numbers.dots {
    background: transparent;
    border: none;
    color: #475569;
}

/* Live search */
.royaye-live-search-wrap { position: relative; }
.desktop-search form { display: flex; align-items: center; position: relative; }
.royaye-live-results {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    left: 0;
    z-index: 10020;
    max-height: 390px;
    overflow-y: auto;
    background: rgba(9, 18, 35, 0.98);
    border: 1px solid rgba(96,165,250,0.2);
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(0,0,0,0.48);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}
.royaye-live-results.is-open { display: block; }
.royaye-live-item {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 9px 11px;
    text-decoration: none;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    transition: background .18s ease;
}
.royaye-live-item:last-child { border-bottom: 0; }
.royaye-live-item:hover { background: rgba(56,189,248,0.08); }
.royaye-live-item img {
    width: 42px;
    height: 58px;
    object-fit: cover;
    border-radius: 7px;
    flex: 0 0 42px;
    background: #111827;
}
.royaye-live-meta { min-width: 0; flex: 1; text-align: right; }
.royaye-live-meta p {
    color: #f8fafc;
    font-size: 13px;
    font-weight: 700;
    margin: 0 0 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.royaye-live-sub { display: flex; align-items: center; gap: 7px; }
.royaye-live-type {
    background: rgba(56,189,248,0.14);
    border: 1px solid rgba(56,189,248,0.25);
    color: #7dd3fc;
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 999px;
}
.royaye-live-year { color: #64748b; font-size: 11px; }
.royaye-live-empty,
.royaye-live-loading { color: #94a3b8; padding: 16px; text-align: center; font-size: 12px; margin: 0; }

/* Existing home mobile search, converted from inline CSS without visual redesign. */
.royaye-mobile-inline-search { display: none; position: relative; max-width: 320px; margin: 0 auto; }
.royaye-mobile-inline-search form { position: relative; }
.royaye-mobile-inline-search-box {
    display: flex;
    background: #1e293b;
    border-radius: 25px;
    overflow: hidden;
    border: 1px solid #334155;
    max-width: 320px;
    margin: 0 auto;
}
.royaye-mobile-inline-search-box input {
    flex: 1;
    min-width: 0;
    background: none;
    border: none;
    padding: 8px 12px;
    color: #fff;
    font-size: 12px;
    outline: none;
    font-family: inherit;
    direction: rtl;
}
.royaye-mobile-inline-search-box button {
    background: #1a90ff;
    border: none;
    padding: 0 12px;
    cursor: pointer;
    color: #fff;
    font-size: 12px;
    font-family: inherit;
}
.royaye-mobile-inline-search .royaye-live-results { top: calc(100% + 6px); }

/* Genre shortcuts: simple links to real genre archive pages; no homepage filtering or extra AJAX. */
.royaye-genre-shortcuts {
    margin: 8px 0 26px;
    padding: 0 2px;
    direction: rtl;
}
.royaye-genre-scroll {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    padding: 5px 2px 8px;
}
.royaye-genre-scroll::-webkit-scrollbar { display: none; }
.royaye-genre-chip {
    min-width: 118px;
    height: 52px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 15px;
    color: #cbd5e1;
    text-decoration: none;
    font-size: 12.5px;
    font-weight: 700;
    background: linear-gradient(145deg, rgba(15,23,42,.92), rgba(8,17,34,.94));
    border: 1px solid rgba(96,165,250,.14);
    border-radius: 14px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
    transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.royaye-genre-chip ion-icon { font-size: 20px; color: #38bdf8; }
.royaye-genre-chip:hover {
    transform: translateY(-2px);
    border-color: rgba(56,189,248,.42);
    background: linear-gradient(145deg, rgba(14,116,144,.13), rgba(30,58,138,.12));
}
.royaye-genre-all { border-color: rgba(56,189,248,.33); color: #fff; }

/* Related films / series */
.royaye-related-section {
    margin: 34px 0 26px;
    direction: rtl;
}
.royaye-related-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
    padding: 0 2px;
}
.royaye-related-header h2 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: #f1f5f9;
    font-size: 18px;
    font-weight: 800;
}
.royaye-related-header h2 ion-icon { color: #38bdf8; font-size: 20px; }
.royaye-related-scroll {
    display: flex;
    gap: 13px;
    overflow-x: auto;
    padding: 3px 2px 10px;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
}
.royaye-related-scroll::-webkit-scrollbar { display: none; }
.royaye-related-card {
    width: 142px;
    flex: 0 0 142px;
    color: #fff;
    text-decoration: none;
}
.royaye-related-poster {
    position: relative;
    width: 100%;
    aspect-ratio: 2 / 3;
    border-radius: 12px;
    overflow: hidden;
    background: #111827;
    border: 1px solid rgba(96,165,250,.12);
}
.royaye-related-poster img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .25s ease; }
.royaye-related-card:hover .royaye-related-poster img { transform: scale(1.035); }
.royaye-related-rating {
    position: absolute;
    top: 7px;
    left: 7px;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 3px 6px;
    border-radius: 7px;
    background: rgba(2,6,23,.78);
    color: #fbbf24;
    font: 700 10px/1 Roboto, sans-serif;
}
.royaye-related-rating ion-icon { font-size: 10px; }
.royaye-related-card h3 {
    color: #e2e8f0;
    font-size: 12px;
    line-height: 1.55;
    margin: 8px 1px 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.royaye-related-year { color: #64748b; font-size: 10.5px; margin-right: 1px; }

/* Mobile bottom navigation */
.royaye-mobile-bottom-nav,
.royaye-mobile-search-sheet { display: none; }

@media (max-width: 768px) {
    .royaye-mobile-inline-search { display: block; }

    body { padding-bottom: 76px; }

    .royaye-genre-shortcuts { margin: 2px 0 20px; }
    .royaye-genre-chip { min-width: 103px; height: 47px; font-size: 11.5px; border-radius: 13px; padding: 0 12px; }
    .royaye-genre-chip ion-icon { font-size: 18px; }

    .royaye-related-section { margin: 28px 0 20px; }
    .royaye-related-header h2 { font-size: 16px; }
    .royaye-related-card { width: 122px; flex-basis: 122px; }

    .royaye-mobile-bottom-nav {
        position: fixed;
        right: 10px;
        left: 10px;
        bottom: max(8px, env(safe-area-inset-bottom));
        z-index: 10010;
        height: 62px;
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        align-items: center;
        padding: 4px 6px;
        background: rgba(8, 17, 34, .94);
        border: 1px solid rgba(96,165,250,.16);
        border-radius: 20px;
        box-shadow: 0 15px 45px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.025);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
    }
    .royaye-mobile-bottom-nav a,
    .royaye-mobile-bottom-nav button {
        height: 52px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        border: 0;
        background: transparent;
        color: #64748b;
        text-decoration: none;
        font-family: inherit;
        cursor: pointer;
        font-size: 9.5px;
        padding: 0;
    }
    .royaye-mobile-bottom-nav ion-icon { font-size: 20px; }
    .royaye-mobile-bottom-nav .is-active { color: #38bdf8; }
    .royaye-bottom-search-icon {
        width: 38px;
        height: 38px;
        margin-top: -19px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(135deg, #0e7490, #1d4ed8);
        color: white;
        border: 1px solid rgba(125,211,252,.45);
        box-shadow: 0 7px 22px rgba(29,78,216,.32);
    }
    .royaye-bottom-search-icon ion-icon { font-size: 20px; }
    .royaye-bottom-search > span:last-child { margin-top: -2px; }

    .royaye-mobile-search-sheet { position: fixed; inset: 0; z-index: 10030; }
    .royaye-mobile-search-sheet.is-open { display: block; }
    .royaye-search-sheet-backdrop {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        border: 0;
        background: rgba(2,6,23,.72);
        backdrop-filter: blur(5px);
        -webkit-backdrop-filter: blur(5px);
    }
    .royaye-search-sheet-panel {
        position: absolute;
        right: 12px;
        left: 12px;
        bottom: calc(78px + env(safe-area-inset-bottom));
        padding: 14px;
        background: #0b1426;
        border: 1px solid rgba(96,165,250,.18);
        border-radius: 18px;
        box-shadow: 0 20px 60px rgba(0,0,0,.6);
    }
    .royaye-search-sheet-head { display: flex; align-items: center; justify-content: space-between; color: #e2e8f0; margin-bottom: 11px; }
    .royaye-search-sheet-head strong { font-size: 13px; }
    .royaye-search-sheet-head button { border: 0; background: transparent; color: #94a3b8; font-size: 22px; padding: 0; display: flex; }
    .royaye-search-sheet-field {
        display: flex;
        align-items: center;
        gap: 8px;
        height: 45px;
        padding: 0 12px;
        border: 1px solid rgba(96,165,250,.17);
        background: #111c30;
        border-radius: 12px;
        color: #64748b;
    }
    .royaye-search-sheet-field input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: #fff; font-family: inherit; font-size: 12px; direction: rtl; }
    .royaye-search-sheet-field ion-icon { font-size: 18px; }
    .royaye-search-sheet-panel .royaye-live-results { position: static; margin-top: 8px; max-height: 320px; }
}

@media (min-width: 769px) {
    .royaye-mobile-bottom-nav,
    .royaye-mobile-search-sheet { display: none !important; }
}

/* =========================================================
   Priority mobile UI + scroll performance layer
   ========================================================= */
.royaye-live-en {
    display:block; margin:-2px 0 5px; color:#64748b; font:500 10px/1.35 Roboto,sans-serif;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; direction:ltr; text-align:right;
}

@media (max-width: 768px) {
    body { padding-bottom:74px; }
    body.royaye-sheet-open { overflow:hidden; }

    /* Four real actions: Home / Categories / Live Search / Profile */
    .royaye-mobile-bottom-nav {
        right:10px; left:10px; bottom:max(8px,env(safe-area-inset-bottom)); height:60px;
        grid-template-columns:repeat(4,1fr); padding:4px 7px;
        background:#091326; border:1px solid rgba(96,165,250,.16); border-radius:18px;
        box-shadow:0 10px 28px rgba(0,0,0,.42); backdrop-filter:none; -webkit-backdrop-filter:none;
        contain:layout paint;
    }
    .royaye-mobile-bottom-nav a,
    .royaye-mobile-bottom-nav button {
        height:50px; gap:3px; color:#708099; font-size:9.5px;
    }
    .royaye-mobile-bottom-nav ion-icon { font-size:21px; }
    .royaye-mobile-bottom-nav .is-active { color:#38bdf8; }
    .royaye-mobile-bottom-nav button:active,
    .royaye-mobile-bottom-nav a:active { color:#7dd3fc; }
    .royaye-bottom-search-icon { all:unset; }
    .royaye-bottom-search > span:last-child { margin-top:0; }

    .royaye-mobile-search-sheet,
    .royaye-mobile-category-sheet { display:none; position:fixed; inset:0; z-index:10030; }
    .royaye-mobile-search-sheet.is-open,
    .royaye-mobile-category-sheet.is-open { display:block; }

    .royaye-search-sheet-backdrop,
    .royaye-category-sheet-backdrop {
        position:absolute; inset:0; width:100%; height:100%; border:0;
        background:rgba(2,6,23,.72); backdrop-filter:none; -webkit-backdrop-filter:none;
    }
    .royaye-search-sheet-panel,
    .royaye-category-sheet-panel {
        position:absolute; right:10px; left:10px; bottom:calc(76px + env(safe-area-inset-bottom));
        max-height:min(72vh,560px); overflow:auto; padding:14px;
        background:#0a1529; border:1px solid rgba(96,165,250,.18); border-radius:18px;
        box-shadow:0 18px 44px rgba(0,0,0,.55); direction:rtl;
    }
    .royaye-search-sheet-head,
    .royaye-category-sheet-head {
        display:flex; align-items:center; justify-content:space-between; color:#f1f5f9; margin-bottom:12px;
    }
    .royaye-search-sheet-head strong,
    .royaye-category-sheet-head strong { font-size:13px; font-weight:800; }
    .royaye-search-sheet-head button,
    .royaye-category-sheet-head button {
        width:34px; height:34px; display:flex; align-items:center; justify-content:center;
        border:1px solid rgba(96,165,250,.12); border-radius:10px; background:#0e1d35; color:#94a3b8; font-size:19px;
    }
    .royaye-search-sheet-field {
        height:44px; background:#0e1d35; border:1px solid rgba(96,165,250,.18); border-radius:12px;
    }
    .royaye-search-sheet-panel .royaye-live-results {
        position:static; margin-top:8px; max-height:330px; background:#0b172c;
        backdrop-filter:none; -webkit-backdrop-filter:none; box-shadow:none;
    }

    .royaye-category-sections {
        display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:14px;
    }
    .royaye-category-sections a {
        min-height:52px; display:flex; align-items:center; gap:8px; padding:0 11px;
        color:#dbeafe; text-decoration:none; font-size:11.5px; font-weight:750;
        background:#0e1d35; border:1px solid rgba(96,165,250,.13); border-radius:12px;
    }
    .royaye-category-sections a ion-icon { color:#38bdf8; font-size:19px; }
    .royaye-category-list-title {
        display:flex; align-items:center; gap:7px; margin:4px 1px 9px; color:#94a3b8; font-size:11px; font-weight:700;
    }
    .royaye-category-list-title ion-icon { color:#38bdf8; font-size:15px; }
    .royaye-category-list { display:flex; flex-wrap:wrap; gap:7px; }
    .royaye-category-list a {
        padding:7px 11px; border-radius:999px; color:#aebcd0; text-decoration:none; font-size:10.5px;
        background:#0d1b32; border:1px solid rgba(96,165,250,.11);
    }

    /* Lighter repaint path while scrolling movie grids. */
    .movies-grid .movie-card,
    .royaye-top250-card { content-visibility:auto; contain-intrinsic-size:220px 360px; }
    .card-overlay .rating,
    .royaye-live-results { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
}

@media (max-width:768px) {
    /* Stop continuous paint-heavy effects on phones while keeping the same static look. */
    .navbar-brand img,
    .updates-title-icon,
    .update-badge { animation:none !important; }
    #mobile-only-search form div { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
}

/* ===== RoyayeFilm mobile polish 2026-08 ===== */
@media (max-width:768px) {
  .royaye-mobile-bottom-nav{display:grid !important;visibility:visible !important;opacity:1 !important;z-index:2147483000 !important;position:fixed !important;right:10px !important;left:10px !important;bottom:max(8px,env(safe-area-inset-bottom)) !important;grid-template-columns:repeat(4,1fr) !important;background:#091326 !important;border:1px solid rgba(56,189,248,.24) !important;box-shadow:0 10px 30px rgba(0,0,0,.52) !important}
  .royaye-mobile-bottom-nav a,.royaye-mobile-bottom-nav button{color:#8ea0ba !important}
  .royaye-mobile-bottom-nav .is-active,.royaye-mobile-bottom-nav a:active,.royaye-mobile-bottom-nav button:active{color:#38bdf8 !important}
  .royaye-mobile-bottom-nav ion-icon{filter:drop-shadow(0 0 7px rgba(56,189,248,.12))}
  /* Bottom nav replaces the old mobile header actions/search. */
  header .navbar-menu-btn,header .navbar-actions,#mobile-only-search{display:none !important}
  header .navbar{min-height:58px !important;height:58px !important;padding:5px 12px !important;justify-content:center !important}
  header .navbar-brand{position:static !important;transform:none !important;margin:auto !important}
  header .navbar-brand img{max-height:40px !important;width:auto !important}
  .container{padding-top:0 !important}
}

/* Stronger live search surface. */
.royaye-live-results{background:#08152b !important;border-color:rgba(56,189,248,.34) !important;box-shadow:0 18px 45px rgba(0,0,0,.62),0 0 0 1px rgba(56,189,248,.05) !important;opacity:1 !important}
.royaye-live-item{background:#0b1930 !important;color:#f8fafc !important}
.royaye-live-item:hover{background:#102443 !important}
.royaye-live-meta p{color:#f8fafc !important;font-weight:800 !important}
.royaye-live-en,.royaye-live-sub{color:#91a4bf !important}

/* Never truncate ordinary card titles too aggressively. */
.card-title,.scroll-card-title,.royaye-related-card h3{white-space:normal !important;text-overflow:clip !important;overflow:visible !important;-webkit-line-clamp:unset !important;display:block !important;height:auto !important;max-height:none !important}
@media(max-width:768px){
 footer{margin-top:30px !important}
 footer>div:nth-child(2){padding:20px 16px 82px !important}
 footer>div:nth-child(2)>div:first-child{margin-bottom:14px !important}
 footer>div:nth-child(2)>div:first-child img{width:48px !important;height:48px !important;margin-bottom:6px !important}
 footer>div:nth-child(2)>div:first-child p:nth-of-type(2){margin-bottom:9px !important}
 footer>div:nth-child(2)>div:nth-child(2){gap:12px !important;margin-bottom:12px !important;padding-top:12px !important}
 footer>div:nth-child(2)>div:nth-child(2) h4{margin-bottom:8px !important}
 footer>div:nth-child(2)>div:nth-child(2) ul{gap:6px !important}
 footer>div:nth-child(2)>div:last-child{padding-top:10px !important;justify-content:center !important}
 footer>div:nth-child(2)>div:last-child>div{padding-top:0 !important;border-top:0 !important}
}
/* Shared compact grid for listing templates (newest/popular/etc.). */
.royaye-card-meta{position:absolute;z-index:3;right:7px;left:7px;bottom:7px;display:flex;align-items:center;justify-content:space-between;gap:4px;color:#f8fafc;font:700 10px/1.2 Roboto,Arial,sans-serif;text-shadow:0 1px 4px #000}.royaye-card-meta span{display:inline-flex;align-items:center;gap:3px}.royaye-card-meta ion-icon{font-size:10px}.royaye-card-imdb b{font:900 8px/1 Arial,sans-serif;background:#f5c518;color:#111827;border-radius:3px;padding:2px 3px}.card-head{position:relative}.card-head:after{content:"";position:absolute;z-index:2;right:0;left:0;bottom:0;height:30%;background:linear-gradient(to top,rgba(2,6,23,.88),transparent);pointer-events:none}
@media(max-width:768px){.movies-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:18px 9px !important}.movies-grid .movie-card{width:auto !important;min-width:0 !important}.movies-grid .movie-card .card-body{padding:7px 2px 0 !important}.movies-grid .movie-card .card-title{font-size:11px !important;line-height:1.55 !important;text-align:center !important;margin:0 0 5px !important;overflow-wrap:anywhere !important}.movies-grid .movie-card .card-info{font-size:9px !important;line-height:1.45 !important;justify-content:center !important;gap:4px !important;text-align:center !important;flex-wrap:wrap !important}.movies-grid .royaye-card-meta{right:5px;left:5px;bottom:5px;font-size:8.5px}.movies-grid .royaye-card-imdb b{font-size:7px}}
.royaye-search-wrap{width:min(1180px,calc(100% - 28px));margin:28px auto 45px;direction:rtl}.royaye-search-heading{display:flex;align-items:center;gap:12px;padding:15px 16px;margin-bottom:22px;border:1px solid rgba(56,189,248,.13);border-radius:16px;background:#09172c}.royaye-search-heading-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#0e7490,#1d4ed8);color:#fff;font-size:21px}.royaye-search-heading h1{margin:0;color:#f8fafc;font-size:18px}.royaye-search-heading h1 strong{color:#38bdf8}.royaye-search-heading p{margin:4px 0 0;color:#71839d;font-size:10px}.royaye-search-type{position:absolute;z-index:4;top:7px;right:7px;display:inline-flex;align-items:center;gap:4px;padding:4px 7px;border-radius:8px;background:rgba(8,20,40,.92);border:1px solid rgba(56,189,248,.22);color:#dbeafe;font-size:9px;font-weight:800}.royaye-search-type ion-icon{color:#38bdf8}.royaye-search-empty{grid-column:1/-1;min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#71839d}.royaye-search-empty>ion-icon{font-size:38px;color:#294b70}.royaye-search-empty h2{color:#e2e8f0;margin:8px 0 4px}.royaye-search-empty p{margin:0}.royaye-search-empty a{margin-top:16px;display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:10px;background:#102440;color:#7dd3fc;text-decoration:none}
@media(max-width:768px){.royaye-search-wrap{width:calc(100% - 20px);margin-top:18px}.royaye-search-heading{padding:11px 12px;margin-bottom:16px}.royaye-search-heading-icon{width:36px;height:36px;font-size:18px}.royaye-search-heading h1{font-size:14px}.royaye-search-heading p{font-size:9px}.royaye-search-type{top:5px;right:5px;padding:3px 5px;font-size:7.5px}}
\n\n/* ===== Bottom navigation containment hotfix 2026-08-14 =====\n   A legacy responsive rule targeted every <nav> and turned the bottom bar into a 100vh drawer.\n   These declarations intentionally pin only the RoyayeFilm bottom bar. */\n@media (max-width: 768px) {\n  nav.royaye-mobile-bottom-nav {\n    position: fixed !important;\n    top: auto !important;\n    right: 10px !important;\n    left: 10px !important;\n    bottom: max(8px, env(safe-area-inset-bottom)) !important;\n    width: auto !important;\n    height: 64px !important;\n    min-height: 64px !important;\n    max-height: 64px !important;\n    padding: 5px 6px !important;\n    margin: 0 !important;\n    display: grid !important;\n    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;\n    align-items: center !important;\n    overflow: hidden !important;\n    transform: none !important;\n    background: #091326 !important;\n    border: 1px solid rgba(56,189,248,.24) !important;\n    border-radius: 18px !important;\n    box-shadow: 0 10px 30px rgba(0,0,0,.52) !important;\n    z-index: 2147483000 !important;\n  }\n  nav.royaye-mobile-bottom-nav > a,\n  nav.royaye-mobile-bottom-nav > button {\n    width: 100% !important;\n    height: 54px !important;\n    min-height: 0 !important;\n    margin: 0 !important;\n    padding: 0 !important;\n    display: flex !important;\n    flex-direction: column !important;\n    align-items: center !important;\n    justify-content: center !important;\n    gap: 3px !important;\n    background: transparent !important;\n    border: 0 !important;\n  }\n  body { padding-bottom: calc(82px + env(safe-area-inset-bottom)) !important; }\n}\n

/* ===== RoyayeFilm V4: robust mobile listing grid + readable compact cards ===== */
@media (max-width: 768px) {
  /* Legacy style.css sets .movies-grid to flex!important; force the final component back to a real grid. */
  main .movies-grid,
  .home-section .movies-grid,
  .royaye-search-wrap .movies-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: start !important;
    justify-content: initial !important;
    gap: 18px 9px !important;
    padding: 0 10px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  main .movies-grid > .movie-card,
  .home-section .movies-grid > .movie-card,
  .royaye-search-wrap .movies-grid > .movie-card {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    border-radius: 11px !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  .movies-grid .movie-card .card-head {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 2 / 3 !important;
    overflow: hidden !important;
    border-radius: 11px !important;
    background: #091326 !important;
    border: 1px solid rgba(96,165,250,.14) !important;
  }
  .movies-grid .movie-card .card-head img { width:100% !important; height:100% !important; object-fit:cover !important; }
  .movies-grid .movie-card .card-body { padding: 7px 1px 0 !important; background:transparent !important; }
  .movies-grid .movie-card .card-title {
    color:#eef5ff !important; font-size:11px !important; line-height:1.55 !important; font-weight:800 !important;
    text-align:center !important; margin:0 0 5px !important; white-space:normal !important; overflow:visible !important;
    text-overflow:clip !important; display:block !important; height:auto !important; min-height:0 !important; overflow-wrap:anywhere !important;
  }
  .movies-grid .movie-card .card-info {
    display:block !important; text-align:center !important; color:#8394ad !important; font-size:9px !important;
    line-height:1.5 !important; white-space:normal !important; overflow:visible !important;
  }
  .movies-grid .royaye-card-meta {
    right:5px !important; left:5px !important; bottom:5px !important; min-height:21px !important;
    padding:3px 5px !important; border-radius:7px !important; background:rgba(3,10,22,.78) !important;
    font-size:10px !important; line-height:1 !important; text-shadow:none !important;
  }
  .movies-grid .royaye-card-meta ion-icon { font-size:11px !important; }
  .movies-grid .royaye-card-imdb b { font-size:8px !important; padding:2px 3px !important; }
}

/* Category bottom sheet stays intentionally simple: only the four main destinations. */
.royaye-category-sheet-panel .royaye-category-sections { margin-bottom:0 !important; }


/* ===== RoyayeFilm V5 — compact mobile footer + compact card metadata ===== */
@media(max-width:768px){
 footer{margin-top:22px !important;}
 footer>div:nth-child(2){padding:15px 14px 92px !important;}
 footer>div:nth-child(2)>div:first-child{margin-bottom:10px !important;}
 footer>div:nth-child(2)>div:first-child img{width:42px !important;height:42px !important;margin-bottom:4px !important;}
 footer>div:nth-child(2)>div:first-child p:first-of-type{font-size:12px !important;margin-bottom:2px !important;}
 footer>div:nth-child(2)>div:first-child p:nth-of-type(2){font-size:10px !important;margin-bottom:7px !important;}
 footer>div:nth-child(2)>div:first-child>div{gap:6px !important;}
 footer>div:nth-child(2)>div:first-child>div a{width:30px !important;height:30px !important;border-radius:8px !important;font-size:14px !important;}
 footer>div:nth-child(2)>div:nth-child(2){gap:8px !important;margin-bottom:8px !important;padding-top:9px !important;}
 footer>div:nth-child(2)>div:nth-child(2) h4{font-size:10.5px !important;margin-bottom:5px !important;}
 footer>div:nth-child(2)>div:nth-child(2) ul{gap:4px !important;}
 footer>div:nth-child(2)>div:nth-child(2) li a{font-size:10.5px !important;}
 footer>div:nth-child(2)>div:last-child{padding-top:7px !important;}
 footer>div:nth-child(2)>div:last-child p{font-size:9.5px !important;}
}


/* ===== RoyayeFilm V6 fixes: sheets, search, footer, compact metadata ===== */
@media(max-width:768px){
  footer{height:auto !important;min-height:0 !important;padding:0 0 8px !important;margin-top:18px !important;}
  footer>div:nth-child(2){padding:12px 14px 12px !important;min-height:0 !important;height:auto !important;}
  body{padding-bottom:calc(78px + env(safe-area-inset-bottom)) !important;}
  .royaye-mobile-category-sheet,.royaye-mobile-search-sheet{will-change:auto !important;}
}
.royaye-live-item{display:grid !important;grid-template-columns:48px minmax(0,1fr) !important;align-items:center !important;gap:10px !important;padding:8px 10px !important;direction:rtl !important;}
.royaye-live-item img{width:48px !important;height:68px !important;grid-column:1 !important;grid-row:1 !important;border-radius:8px !important;}
.royaye-live-meta{grid-column:2 !important;grid-row:1 !important;min-width:0 !important;text-align:right !important;}
.royaye-live-meta p{white-space:normal !important;display:-webkit-box !important;-webkit-box-orient:vertical !important;-webkit-line-clamp:2 !important;overflow:hidden !important;font-size:12px !important;line-height:1.5 !important;margin:0 0 2px !important;}
.royaye-live-en{display:block !important;color:#71849f !important;font-size:9.5px !important;white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important;margin-bottom:5px !important;direction:ltr !important;text-align:right !important;}
.royaye-live-sub{display:flex !important;align-items:center !important;gap:6px !important;flex-wrap:nowrap !important;}
.royaye-live-type{font-size:9px !important;padding:2px 6px !important;}
.royaye-live-year{font:700 10px/1.2 Arial,sans-serif !important;color:#9aa9bd !important;direction:ltr !important;}