/*
  Hanfan Modern UI (share 风格统一版)
  - 白底大留白
  - 卡片柔和阴影
  - 蓝色主色按钮
  - 兼容 Vodi/Bootstrap 常见结构
*/

:root{
  --hf-bg:#f5f7fb;
  --hf-card:#ffffff;
  --hf-text:#0f172a;
  --hf-muted:#64748b;
  --hf-border:rgba(15,23,42,.10);
  --hf-shadow:0 12px 34px rgba(15,23,42,.10);
  --hf-shadow-sm:0 6px 16px rgba(15,23,42,.10);
  --hf-radius:16px;
  --hf-radius-sm:12px;
  --hf-primary:#0b78d1;
}

body{
  background:radial-gradient(1200px 520px at 70% 0%, rgba(11,120,209,.11), transparent 55%),
             radial-gradient(900px 420px at 0% 25%, rgba(99,102,241,.10), transparent 55%),
             var(--hf-bg) !important;
  color:var(--hf-text);
}

/* Typography */
body, input, textarea, select, button{font-family:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif}

h1,h2,h3,h4,h5{color:var(--hf-text)}

a{color:inherit;transition:color .15s ease, background-color .15s ease, border-color .15s ease}
a:hover{color:var(--hf-primary)}

/* Container width */
@media (min-width:1200px){
  .container, .container-lg, .container-md, .container-sm, .container-xl{max-width:1400px}
}

/* Buttons */
.btn, button, input[type="submit"], .button{border-radius:12px}
.btn-primary, .btn.btn-primary,
button.btn-primary, input[type="submit"].btn-primary{
  background:var(--hf-primary) !important;
  border-color:var(--hf-primary) !important;
}

/* Inputs */
input[type="text"], input[type="search"], input[type="email"], input[type="url"], input[type="password"], textarea, select{
  border-radius:12px;
  border-color:rgba(15,23,42,.12);
}

/* Card-ish blocks */
.card, .widget, .sidebar .widget,
.hanfan-block, .hanfan-side,
.vodi-block, .vodi-widget,
.vod-item, .movie-item{
  background:var(--hf-card);
  border:1px solid var(--hf-border);
  border-radius:var(--hf-radius);
  box-shadow:var(--hf-shadow-sm);
}

/* Navbar / header (best effort) */
.navbar, .site-header, header.site-header{
  background:rgba(255,255,255,.82) !important;
  backdrop-filter:saturate(1.1) blur(10px);
  border-bottom:1px solid rgba(15,23,42,.08);
}

/* Poster hover */
img{max-width:100%;height:auto}
.hanfan-poster, .poster, .vod-thumb, .movie-thumb{border-radius:var(--hf-radius-sm);overflow:hidden}
.hanfan-poster img, .poster img{transition:transform .25s ease, filter .25s ease}
.hanfan-poster:hover img, .poster:hover img{transform:scale(1.03);filter:saturate(1.05) contrast(1.02)}

/* Side ranking list */
.hanfan-side-list a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Responsive spacing */
@media (max-width:768px){
  .hanfan-wrap{padding:14px 0}
  .card, .widget, .hanfan-block, .hanfan-side{border-radius:14px}
}


/* =====================
   Search page (hf33-like)
   ===================== */
.hf33-search-wrap{max-width:1400px;margin:0 auto;padding:16px 16px 28px}
.hf33-search-head{background:rgba(255,255,255,.92);border:1px solid rgba(15,23,42,.08);border-radius:16px;box-shadow:0 10px 30px rgba(15,23,42,.08);padding:16px 18px;margin-bottom:14px}
.hf33-search-title{font-size:18px;font-weight:900;color:#111827}
.hf33-search-sub{font-size:12px;color:#6b7280;margin-top:6px}

.hf33-search-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
.hf33-search-main{min-width:0}
.hf33-search-side{position:sticky;top:88px;align-self:start}

.hf33-search-item{display:flex;gap:14px;padding:14px;border-radius:16px;background:rgba(255,255,255,.92);border:1px solid rgba(15,23,42,.08);box-shadow:0 8px 20px rgba(15,23,42,.06);margin-bottom:12px}
.hf33-search-thumb{flex:0 0 120px;width:120px;height:160px;border-radius:12px;overflow:hidden;background:#f3f4f6}
.hf33-search-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.hf33-search-body{min-width:0}
.hf33-search-name{display:block;font-size:16px;font-weight:900;color:#111827;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hf33-search-name:hover{color:#0b78d1}
.hf33-search-meta{margin-top:6px;font-size:12px;color:#94a3b8;display:flex;gap:8px;align-items:center}
.hf33-search-meta .dot{opacity:.6}
.hf33-search-excerpt{margin-top:8px;font-size:13px;line-height:1.7;color:#475569;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

.hf33-search-empty{padding:18px;border-radius:16px;background:#fff;border:1px solid rgba(15,23,42,.08);box-shadow:0 8px 20px rgba(15,23,42,.06)}

.hf33-search-pager .page-numbers{border-radius:12px !important}

@media (max-width: 980px){
  .hf33-search-grid{grid-template-columns:1fr}
  .hf33-search-side{position:static;top:auto}
  .hf33-search-thumb{flex-basis:96px;width:96px;height:128px}
  .hf33-search-name{font-size:15px}
}


/* Sidebar cards + rank list (search page) */
.hf33-side-card{background:rgba(255,255,255,.92);border:1px solid rgba(15,23,42,.08);border-radius:16px;box-shadow:0 10px 30px rgba(15,23,42,.08);padding:14px 14px 12px}
.hf33-side-title{font-size:14px;font-weight:900;color:#111827;margin:0 0 10px}

.hf33-side-card .hf33-rank{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.hf33-side-card .hf33-rank li{display:grid;grid-template-columns:22px 1fr auto;gap:10px;align-items:center}
.hf33-side-card .hf33-rank .idx{width:22px;height:22px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:900;background:rgba(15,23,42,.08);color:#475569}
.hf33-side-card .hf33-rank li:nth-child(1) .idx{background:#ff5a5f;color:#fff}
.hf33-side-card .hf33-rank li:nth-child(2) .idx{background:#ff8f00;color:#fff}
.hf33-side-card .hf33-rank li:nth-child(3) .idx{background:#ffc107;color:#fff}
.hf33-side-card .hf33-rank a{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;color:#111827;font-size:13px;font-weight:700}
.hf33-side-card .hf33-rank a:hover{color:#0b78d1}
.hf33-side-card .hf33-rank .status{font-size:12px;color:#94a3b8;white-space:nowrap}

/* Search page layout guard: avoid weird theme flex constraints */
body.search #primary, body.search .content-area{width:100% !important;max-width:none !important}
body.search #secondary, body.search .widget-area{display:none !important}
