/* HiAnime-inspired interface refinements, using this app's own data and branding. */
:root {
    --ui-bg: #201f31;
    --ui-panel: #2b2a3c;
    --ui-panel-raised: #353449;
    --ui-pink: #ffbade;
    --ui-text: #f5f3f8;
    --ui-muted: #aaa8bb;
    --ui-line: rgba(255,255,255,.075);
}

body { background:var(--ui-bg); color:var(--ui-text); }
#header.header-home { position:fixed; top:0; left:0; right:0; z-index:102; height:70px; background:#1c1b2b!important; border-bottom:1px solid var(--ui-line); box-shadow:0 5px 24px rgba(0,0,0,.13); }
#header.header-home > .container { display:flex; align-items:center; gap:24px; height:70px; min-height:70px; max-width:1360px; padding:0 24px; }
#header.header-home #mobile_menu { position:static; flex:0 0 40px; margin:0; }
#header #logo { display:block; flex:0 0 170px; width:170px; height:42px; margin:0; float:none; }
#header #logo .clearfix { display:none; }
#header #logo img { visibility:visible; opacity:1; }
#header #logo img { display:block; max-width:100%; max-height:42px; object-fit:contain; }
#header #search { display:block; flex:1 1 480px; max-width:560px; margin:0 auto; }
#header #search .search-content form { display:flex; align-items:center; position:relative; }
#header #search .search-content form .filter-icon { position:static; top:auto; right:auto; }
#header #search .search-content form .search-icon { position:static; top:auto; right:auto; }
#header #search .filter-icon { display:flex; align-items:center; justify-content:center; order:2; width:45px; height:44px; border-radius:0 8px 8px 0; background:#39384d; color:#d9d6e1; font-size:0; }
#header #search .filter-icon:before { content:"\f0b0"; font-family:"Font Awesome 5 Free"; font-size:15px; font-weight:900; }
#header #search .search-input { order:1; height:44px; min-width:0; padding:0 16px; border:0; border-radius:8px 0 0 8px; background:#f5f4f7; color:#252432; font-size:13px; }
#header #search .search-icon { order:3; flex:0 0 44px; width:44px; height:44px; margin-left:8px; border:0; border-radius:8px; background:var(--ui-pink); color:#262333; }
#header .header-setting { display:block; flex:0 0 auto; margin:0; }
#header .header-setting .hs-toggles { display:flex; align-items:center; gap:8px; }
#header .header-setting .hst-item { min-width:52px; padding:5px 4px; color:#d6d3df; }
#header .header-setting .hst-icon { font-size:16px; }
#header .header-setting .hst-item .name { font-size:10px; }
#header #pick_menu { display:none; }
#header #header_right { display:block; flex:0 0 auto; margin-left:0; }
#header .header-auth-links { display:flex; align-items:center; gap:8px; }
#header .header-auth-links .header_right-user { margin:0; }
#header .header-auth-links .header_right-user .dropdown { position:relative; }
#header .header-auth-links .header_right-user .dropdown-menu { position:absolute; top:calc(100% + 10px); right:0; z-index:50; min-width:230px; padding:8px; border:1px solid var(--ui-line); border-radius:9px; background:#29283a; box-shadow:0 16px 36px rgba(0,0,0,.35); }
#header .header-auth-links .header_right-user .dropdown-menu .dropdown-item { color:#eeeaf3; }
#header .header-auth-links .header_right-user .dropdown-menu .dropdown-item:hover { background:#3a3951; }
#header .header-auth-link { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:0 16px; border:1px solid rgba(255,255,255,.16); border-radius:7px; color:#f5f3f8; font-size:12px; font-weight:600; }
#header .header-auth-link:not(.header-auth-primary) { background:transparent; }
#header .header-auth-primary { border-color:var(--ui-pink); background:var(--ui-pink); color:#201f31; }
#header .header-auth-primary:hover { background:#ffc9e4; color:#201f31; }
#header .header-auth-link:not(.header-auth-primary):hover { border-color:var(--ui-pink); color:var(--ui-pink); }
#header .header_right-user .btn-user-avatar { cursor:pointer; }
#header .header_right-user .profile-avatar { width:40px; height:40px; }
#mobile_search { display:none; }

.block_area { border:1px solid rgba(255,255,255,.035); border-radius:12px; background:var(--ui-panel); box-shadow:0 10px 28px rgba(0,0,0,.09); }
.block_area-header { padding-bottom:15px; }
.block_area-header .cat-heading { font-size:19px; font-weight:600; }
.block_area-header .cat-heading:before { border-radius:4px; background:var(--ui-pink); }
.block_area-content { color:#dedce6; }
.film_list-wrap .flw-item { border-radius:9px; }
.film_list-wrap .flw-item:hover { transform:translateY(-3px); }
.film-detail .film-name a { color:#f4f1f7; }
.film-detail .fd-infor { color:var(--ui-muted); }
.film-poster { border-radius:8px; overflow:hidden; background:var(--ui-panel-raised); }
.film-poster-img { border-radius:8px; }
.tick-item { border-radius:4px; }

body[data-page="page_home"] { padding-top:70px!important; }
body[data-page="page_home"] #header.header-home > .container { min-height:70px; }
body[data-page="page_home"] .deslide-wrap { height:500px; padding-top:0!important; margin-top:0!important; overflow:visible; }
body[data-page="page_home"] .deslide-wrap > .container { padding-top:0!important; }
body[data-page="page_home"] .deslide-wrap > .container { max-width:1360px; height:100%; }
body[data-page="page_home"] #slider { position:relative; top:0; max-width:none; width:100%; height:500px; min-height:0; margin:0 auto 20px; padding:0!important; box-sizing:border-box; }
body[data-page="page_home"] #slider > .swiper-wrapper { position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; }
body[data-page="page_home"] #slider > .swiper-wrapper > .swiper-slide { flex:0 0 100%; width:100%; height:100%; }
body[data-page="page_home"] .swiper-container-horizontal > .swiper-wrapper { position:absolute; }
body[data-page="page_home"] .deslide-item { height:100%; min-height:0; overflow:hidden; border-radius:14px; background:#29283a; }
body[data-page="page_home"] .deslide-cover-img img { position:absolute; inset:0; }
body[data-page="page_home"] .deslide-cover,
body[data-page="page_home"] .deslide-cover-img { left:0; right:0; border-radius:14px; overflow:hidden; -webkit-mask-image:none; mask-image:none; }
body[data-page="page_home"] .deslide-cover-img img { object-fit:cover; object-position:center 35%; }
body[data-page="page_home"] .deslide-item-content { left:4%; bottom:42px; max-width:600px; padding:20px 26px; }
body[data-page="page_home"] #slider .swiper-navigation { position:absolute; z-index:15; top:50%; right:26px; left:26px; display:flex; justify-content:space-between; transform:translateY(-50%); pointer-events:none; }
body[data-page="page_home"] #slider .swiper-navigation .swiper-button { position:static; display:grid; place-items:center; width:42px; height:56px; border-radius:8px; background:rgba(32,31,49,.78); color:#fff; pointer-events:auto; cursor:pointer; }
body[data-page="page_home"] .desi-sub-text { color:var(--ui-pink); font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
body[data-page="page_home"] .desi-head-title { max-width:620px; color:#fff; font-size:clamp(28px,3.3vw,46px); font-weight:700; line-height:1.15; }
body[data-page="page_home"] .desi-description { max-width:600px; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; color:#dedce6; font-size:13px; line-height:1.7; }
body[data-page="page_home"] #anime-trending { padding-top:8px; }
body[data-page="page_home"] #anime-trending > .container,
body[data-page="page_home"] .lazy-component[data-component="apfc"] > .container { max-width:1360px; padding:0 24px; }
body[data-page="page_home"] .lazy-component[data-component="apfc"] { margin-top:18px!important; }
body[data-page="page_home"] .anif-blocks > .row { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; margin:0; }
body[data-page="page_home"] .anif-blocks > .row > [class*="col-"] { width:auto; max-width:none; flex:none; padding:0; }
body[data-page="page_home"] .anif-block { padding:16px; }
body[data-page="page_home"] .anif-block-header { margin-bottom:0; padding:0 0 10px; }
body[data-page="page_home"] #anime-trending .block_area_trending { background:transparent; box-shadow:none; border:0; }
body[data-page="page_home"] #anime-trending .block_area-header { margin-bottom:4px; }
body[data-page="page_home"] #anime-featured #main-wrapper { padding-top:26px; }
body[data-page="page_home"] #anime-featured .container { max-width:1360px; padding:0 24px; }
body[data-page="page_home"] #anime-featured #main-content { min-width:0; }
body[data-page="page_home"] .anif-block { height:100%; overflow:hidden; border:1px solid var(--ui-line); border-radius:11px; background:var(--ui-panel); }
body[data-page="page_home"] .anif-block-header { padding:17px 18px; color:#f3f0f6; font-size:15px; font-weight:600; }
body[data-page="page_home"] .anif-block-ul ul li { border-color:var(--ui-line); }
.spotlight-unavailable,.trending-empty { padding:32px; border:1px solid var(--ui-line); border-radius:12px; background:var(--ui-panel); color:var(--ui-muted); text-align:center; }
.catalog-status { padding:10px 18px; background:#533d28; color:#ffe8cd; text-align:center; font-size:13px; }

@media (max-width:1100px) {
    #header.header-home > .container { gap:14px; padding:0 18px; }
    #header #logo { flex-basis:135px; width:135px; }
    #header .header-setting .hst-item { min-width:38px; }
    #header .header-setting .hst-item .name { display:none; }
}
@media (max-width:820px) {
    #header.header-home, #header.header-home > .container { height:68px; min-height:68px; }
    #header.header-home > .container { gap:12px; }
    #mobile_menu { display:inline-flex; align-items:center; justify-content:center; flex:0 0 38px; width:38px; height:38px; border-radius:8px; background:#343348; color:#fff; }
    #header #logo { flex:0 0 122px; width:122px; }
    #header #search { display:block; flex:1 1 auto; }
    #header .header-setting { display:none; }
    #header #header_right { display:block; }
    #header .header-auth-link { min-height:35px; padding:0 11px; }
    body[data-page="page_home"] .deslide-wrap,
    body[data-page="page_home"] #slider { height:430px; }
    body[data-page="page_home"] .deslide-item-content { left:2%; bottom:28px; padding:18px 20px; }
    body[data-page="page_home"] .anif-blocks > .row { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:560px) {
    #header.header-home, #header.header-home > .container { height:62px; min-height:62px; }
    #header.header-home > .container { gap:8px; padding:0 12px; }
    #mobile_menu { flex-basis:32px; width:32px; height:36px; }
    #header #logo { flex:0 0 88px; width:88px; height:34px; }
    #header #logo img { height:31px; max-height:31px; }
    #header #search { display:block; flex:1 1 auto; }
    #header #search .search-input { height:38px; padding:0 9px; font-size:12px; }
    #header #search .filter-icon { width:34px; height:38px; }
    #header #search .search-icon { flex-basis:36px; width:36px; height:38px; margin-left:5px; }
    #header .header-auth-links { gap:5px; }
    #header .header-auth-link { min-height:32px; padding:0 8px; font-size:10px; }
    body[data-page="page_home"] .deslide-wrap,
    body[data-page="page_home"] #slider { height:360px; }
    body[data-page="page_home"] .deslide-item-content { left:0; bottom:20px; padding:16px; }
    body[data-page="page_home"] .anif-blocks > .row { gap:12px; }
    body[data-page="page_home"] .anif-block { padding:12px; }
    body[data-page="page_home"] .desi-description { -webkit-line-clamp:2; }
}