/*
 * EscortWP — FULL Modern Redesign v2.0
 * Design: Dark luxury adult directory with neon-rose accents
 * ──────────────────────────────────────────────────────────
 * Palette:
 *   --bg         #080810   deep near-black
 *   --surface    #111119   card surface
 *   --surface-2  #1A1A26   elevated panel
 *   --border     #252535   subtle divider
 *   --accent     #FF2D7A   neon rose (primary CTA)
 *   --accent-2   #FF6BA8   lighter rose (hover)
 *   --accent-soft rgba(255,45,122,.12)
 *   --gold       #C9A84C   VIP gold
 *   --gold-2     #E8C87A   VIP hover
 *   --text-1     #F0F0F8   primary text
 *   --text-2     #8888A8   muted text
 *   --online     #00E5A0   online green
 *   --danger     #FF3355
 *   --verified   #3B82F6
 * ──────────────────────────────────────────────────────────
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Syne:wght@700;800&display=swap');

/* ═══════════════════════════════════════════════════════════
   1. CSS TOKENS
   ═══════════════════════════════════════════════════════════ */
:root {
  --bg:          #080810;
  --surface:     #111119;
  --surface-2:   #1A1A26;
  --border:      #252535;
  --accent:      #FF2D7A;
  --accent-2:    #FF6BA8;
  --accent-soft: rgba(255,45,122,.12);
  --accent-glow: rgba(255,45,122,.25);
  --gold:        #C9A84C;
  --gold-2:      #E8C87A;
  --gold-soft:   rgba(201,168,76,.15);
  --text-1:      #F0F0F8;
  --text-2:      #8888A8;
  --text-3:      #555570;
  --online:      #00E5A0;
  --danger:      #FF3355;
  --verified:    #3B82F6;
  --new:         #FF2D7A;
  --radius:      14px;
  --radius-sm:   8px;
  --radius-btn:  8px;
  --font:        'Inter', 'Open Sans', sans-serif;
  --font-display:'Syne', 'Inter', sans-serif;
  --trans:       0.2s ease;
}

/* ═══════════════════════════════════════════════════════════
   2. BASE RESET
   ═══════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }

html, body {
  background: var(--bg) !important;
  color: var(--text-1) !important;
  font-family: var(--font) !important;
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a        { color: var(--accent)   !important; text-decoration: none; transition: color var(--trans); }
a:hover  { color: var(--accent-2) !important; }

/* ═══════════════════════════════════════════════════════════
   3. OUTER WRAPPER
   ═══════════════════════════════════════════════════════════ */
.all, .all-body {
  background: var(--bg) !important;
  width: 100% !important;
}

/* ═══════════════════════════════════════════════════════════
   4. HEADER — sticky frosted bar
   ═══════════════════════════════════════════════════════════ */
header {
  position: sticky !important;
  top: 0;
  z-index: 1000;
  background: rgba(8,8,16,0.95) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 1px 0 rgba(255,45,122,.08);
}

.header-top-bar {
  background: transparent !important;
  padding: 0 !important;
  max-width: 1400px;
  margin: 0 auto;
  display: flex !important;
  align-items: center !important;
  height: 66px;
  gap: 0;
}

/* — Logo — */
.header-top-bar .logo,
.header-top-bar .logo.l { float: none !important; display: flex; align-items: center; padding: 0 24px; }
.all .logo h1 { margin: 0; line-height: 1; }
.all .logo h1 a {
  font-family: var(--font-display) !important;
  font-size: 1.45rem !important;
  font-weight: 800 !important;
  color: var(--text-1) !important;
  letter-spacing: -0.02em;
}
.all .logo h1 a span { color: var(--accent); }
.all .logo h1 a img { height: 38px !important; width: auto !important; }

/* — Main nav — */
.header-top-bar .header-nav,
.header-top-bar .header-nav.l {
  float: none !important;
  flex: 1;
  padding: 0 !important;
  min-height: unset !important;
  display: flex;
  align-items: center;
}
.header-top-bar .header-nav .header-menu,
.header-top-bar .header-nav ul.header-menu {
  display: flex !important;
  align-items: center;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.header-top-bar .header-nav .header-menu li { float: none !important; position: relative; }
.header-top-bar .header-nav .header-menu > li > a {
  color: var(--text-2) !important;
  font-weight: 500 !important;
  font-size: 0.88rem !important;
  padding: 6px 13px !important;
  border-radius: var(--radius-btn) !important;
  display: block !important;
  float: none !important;
  transition: all var(--trans);
  background: transparent !important;
  white-space: nowrap;
}
.header-top-bar .header-nav .header-menu > li > a:hover,
.header-top-bar .header-nav .header-menu li.current_page_item > a {
  color: var(--accent) !important;
  background: var(--accent-soft) !important;
}

/* Dropdown */
.header-top-bar .header-nav .header-menu ul {
  background: var(--surface-2) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.7) !important;
  top: calc(100% + 8px) !important;
  padding: 6px !important;
  min-width: 180px !important;
}
.header-top-bar .header-nav .header-menu ul li a {
  color: var(--text-2) !important;
  background: transparent !important;
  border-radius: 6px !important;
  padding: 8px 14px !important;
  font-size: 0.86rem !important;
  display: block !important;
  float: none !important;
  margin: 0 !important;
}
.header-top-bar .header-nav .header-menu ul li a:hover {
  background: var(--accent-soft) !important;
  color: var(--accent) !important;
}

/* — Sub-nav (login/register) — */
.header-top-bar .subnav-menu-wrapper,
.header-top-bar .subnav-menu-wrapper.r {
  float: none !important;
  margin-left: auto;
  min-height: unset !important;
  padding: 0 24px;
}
.header-top-bar .subnav-menu { display: flex !important; align-items: center; gap: 8px; padding: 0; margin: 0; }
.header-top-bar .subnav-menu li {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 !important;
  list-style: none;
  line-height: 1;
}
.header-top-bar .subnav-menu li.subnav-menu-btn a {
  background: var(--accent) !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 0.83rem !important;
  padding: 7px 16px !important;
  border-radius: var(--radius-btn) !important;
  transition: all var(--trans);
  border: none !important;
}
.header-top-bar .subnav-menu li.subnav-menu-btn a:hover {
  background: var(--accent-2) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 16px var(--accent-glow);
}
.header-top-bar .subnav-menu li.login-btn a,
.header-top-bar .subnav-menu li.logout-btn a {
  background: transparent !important;
  color: var(--text-2) !important;
  border: 1px solid var(--border) !important;
  padding: 6px 14px !important;
  border-radius: var(--radius-btn) !important;
}
.header-top-bar .subnav-menu li.login-btn a:hover,
.header-top-bar .subnav-menu li.logout-btn a:hover {
  border-color: var(--accent) !important;
  color: var(--accent) !important;
}
.header-top-bar .subnav-menu li.subnav-menu-icon a {
  background: transparent !important;
  color: var(--text-2) !important;
  border-radius: var(--radius-btn) !important;
  width: 36px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem !important;
  transition: all var(--trans);
}
.header-top-bar .subnav-menu li.subnav-menu-icon a:hover {
  background: var(--accent-soft) !important;
  color: var(--accent) !important;
}
header .hamburger-menu {
  background: var(--surface-2) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-1) !important;
  border-radius: var(--radius-btn) !important;
  padding: 6px 12px !important;
  margin-right: 16px;
}
/* hide the clear div in header */
.header-top-bar > .clear { display: none; }

/* ═══════════════════════════════════════════════════════════
   5. FEATURED SLIDER — full-width cinematic strip
   ═══════════════════════════════════════════════════════════ */
/* Constrain the slider to sit in the same column as .body, between both sidebars */
.slider-constrain {
  margin: 0 260px;
  padding: 16px 16px 0;
  background: var(--bg) !important;
}
.all.all-header-slider { background: var(--bg) !important; }
.sliderall {
  background: var(--bg) !important;
  filter: none !important;
  padding: 0 !important;
  position: relative;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--border);
}
/* Owl Carousel injects .owl-stage-outer > .owl-stage > .owl-item; these MUST be
   constrained or un-rendered slides stack vertically and blow out page height */
.sliderall .owl-stage-outer { overflow: hidden; }
.sliderall .owl-stage { display: flex; }
.sliderall .owl-item { float: none !important; flex: 0 0 100%; }
/* Hard cap on height regardless of JS init state — prevents "half the page" bug
   when Owl hasn't finished initializing or JS fails to load */
.slider { overflow: hidden !important; max-height: 320px; }
.slider .slide { float: left; width: 100%; max-height: 320px; }
.slider .slide .girlimg {
  display: block;
  position: relative;
  overflow: hidden;
  height: 320px;
  max-height: 320px;
}
.slider .slide .girlimg img {
  width: 100%;
  height: 320px;
  max-height: 320px;
  object-fit: cover;
  display: block;
  transition: transform 6s ease;
}
.owl-item.active .girlimg img { transform: scale(1.05); }
.slider .slide .girlimg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(8,8,16,.85) 0%, rgba(8,8,16,.35) 55%, transparent 100%);
}
/* Model info overlay — left aligned, bold */
.slider .slide .girlinfo {
  position: absolute;
  left: 28px;
  bottom: 28px;
  z-index: 5;
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-width: 60%;
}
.slider .slide .girlinfo .modelinfo { display: flex; flex-direction: column; gap: 2px; }
.slider .slide .girlinfo .modelname {
  font-family: var(--font-display);
  font-size: 1.85rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.1;
  text-shadow: 0 2px 20px rgba(0,0,0,0.5);
}
.slider .slide .girlinfo .modelinfo-location {
  font-size: 0.84rem;
  color: rgba(255,255,255,.7);
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
/* slider premium badge */
.slider .slide .girlimg .premiumlabel {
  position: absolute;
  top: 16px; right: 16px;
  z-index: 6;
}
.slider .slide .girlimg .premiumlabel span {
  background: linear-gradient(135deg, var(--gold), var(--gold-2));
  color: #000;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 11px;
  border-radius: 4px;
  transform: none !important;
  position: static !important;
  width: auto !important;
  top: auto !important;
  right: auto !important;
  display: inline-block;
  box-shadow: 0 4px 16px rgba(201,168,76,.35);
}
.slider .slide .girlimg .labels {
  position: absolute;
  top: 16px; left: 16px;
  z-index: 6;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.slider .slide .girlimg .labels .label {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  padding: 3px 9px;
  border-radius: 4px;
  display: inline-block;
  width: max-content;
}
.slider .slide .girlimg .labels .label-new { background: var(--accent); color: #fff; }
.slider .slide .girlimg .labels .label-verified { background: var(--verified); color: #fff; }
.slider .slide .girlimg .labels .online-label {
  background: rgba(0,229,160,.15);
  border: 1px solid var(--online);
  color: var(--online);
}
.slider .slide .label-video {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%) !important;
  z-index: 6;
}
.slider .slide .label-video img { max-width: 56px; opacity: 0.9; }
.owl-dots {
  position: absolute;
  bottom: 14px; right: 16px;
  z-index: 10;
  display: flex !important;
  gap: 5px;
}
.owl-dots .owl-dot { display: block; }
.owl-dot span { background: rgba(255,255,255,.35) !important; width: 6px !important; height: 6px !important; border-radius: 50% !important; display: block !important; margin: 0 !important; }
.owl-dot.active span { background: var(--accent) !important; }
.owl-nav { display: none; }

/* OWL nav dots */
.owl-dots { position: absolute; bottom: 24px; right: 32px; z-index: 10; }
.owl-dot span { background: rgba(255,255,255,.3) !important; width: 8px !important; height: 8px !important; }
.owl-dot.active span { background: var(--accent) !important; }

/* ═══════════════════════════════════════════════════════════
   6. LAYOUT: 3-column wrapper
   ═══════════════════════════════════════════════════════════ */
.contentwrapper { float: left !important; width: 100% !important; background: var(--bg) !important; }
.body {
  margin: 0 260px !important;
  border-left: 1px solid var(--border) !important;
  border-right: 1px solid var(--border) !important;
  background: var(--bg) !important;
  min-height: 80vh;
}

/* ═══════════════════════════════════════════════════════════
   7. SECTION BOXES (bodybox)
   ═══════════════════════════════════════════════════════════ */
.bodybox {
  background: var(--bg) !important;
  border-bottom: 1px solid var(--border) !important;
  padding: 28px 20px !important;
  overflow: visible !important;
}
/* Section title with neon left bar */
.bodybox h3,
.bodybox-homepage h3 {
  font-family: var(--font-display) !important;
  font-size: 1.25rem !important;
  font-weight: 800 !important;
  color: var(--text-1) !important;
  padding: 0 0 20px 14px !important;
  position: relative !important;
  letter-spacing: -0.01em;
  text-align: left !important;
}
.bodybox h3::before,
.bodybox-homepage h3::before {
  content: '';
  position: absolute;
  left: 0; top: 2px; bottom: 6px;
  width: 3px;
  background: linear-gradient(to bottom, var(--accent), var(--accent-2));
  border-radius: 2px;
}
.bodybox h4 { color: var(--text-2) !important; font-size: 0.95rem !important; font-weight: 500 !important; }
.bodybox-homepage .see-all-top {
  padding: 6px 16px !important;
  font-size: 0.82rem !important;
  background: transparent !important;
  border: 1px solid var(--accent) !important;
  color: var(--accent) !important;
  border-radius: var(--radius-btn) !important;
  font-weight: 600 !important;
  transition: all var(--trans);
  filter: none !important;
}
.bodybox-homepage .see-all-top:hover {
  background: var(--accent) !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 16px var(--accent-glow);
}
.bodybox-homepage .see-more-button,
.bodybox-homepage .see-all-bottom {
  background: var(--surface-2) !important;
  color: var(--text-2) !important;
  border: 1px solid var(--border) !important;
  filter: none !important;
  padding: 8px 24px !important;
  border-radius: var(--radius-btn) !important;
  margin: 16px auto !important;
}

/* ═══════════════════════════════════════════════════════════
   8. GLOBAL BUTTONS
   ═══════════════════════════════════════════════════════════ */
.pinkbutton, .pinkdegrade {
  background: var(--accent) !important;
  background-image: none !important;
  filter: none !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.01em !important;
  border-radius: var(--radius-btn) !important;
  border: none !important;
  transition: all var(--trans) !important;
  padding: 7px 16px !important;
  display: inline-block;
}
.pinkbutton:hover {
  background: var(--accent-2) !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 16px var(--accent-glow) !important;
}
.whitebutton, .whitedegrade {
  background: var(--surface-2) !important;
  color: var(--text-1) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-btn) !important;
  filter: none !important;
}
.whitebutton:hover { border-color: var(--accent) !important; color: var(--accent) !important; background: var(--accent-soft) !important; }
.bluebutton, .bluedegrade {
  background: var(--verified) !important;
  filter: none !important;
  color: #fff !important;
  border-radius: var(--radius-btn) !important;
}
.orangebutton, .orangedegrade {
  background: linear-gradient(135deg, var(--gold), var(--gold-2)) !important;
  filter: none !important;
  color: #000 !important;
  font-weight: 700 !important;
  border-radius: var(--radius-btn) !important;
}
.orangebutton:hover { opacity: 0.85; color: #000 !important; }
.redbutton, .reddegrade {
  background: var(--danger) !important;
  filter: none !important;
  color: #fff !important;
  border-radius: var(--radius-btn) !important;
}
.blueishbutton {
  background: var(--surface-2) !important;
  border-color: var(--border) !important;
  color: var(--text-2) !important;
  border-radius: var(--radius-btn) !important;
}
.blueishbutton:hover { background: var(--accent-soft) !important; border-color: var(--accent) !important; color: var(--accent) !important; }
input.pinkbutton, input[type="submit"] {
  cursor: pointer;
  font-family: var(--font) !important;
}
/* Category filter pills (all-profiles page) */
.pagetitle-menu { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 0; }
.pagetitle-menu li { float: none !important; padding: 0 !important; }
.pagetitle-menu li a {
  background: var(--surface-2) !important;
  color: var(--text-2) !important;
  border: 1px solid var(--border) !important;
  border-radius: 20px !important;
  padding: 5px 14px !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  display: block;
  transition: all var(--trans);
  filter: none !important;
}
.pagetitle-menu li a:hover,
.pagetitle-menu li a.active {
  background: var(--accent) !important;
  color: #fff !important;
  border-color: var(--accent) !important;
}

/* ═══════════════════════════════════════════════════════════
   9. PROFILE GRID CARDS
   ═══════════════════════════════════════════════════════════ */
.girl {
  float: left !important;
  width: 20% !important;
  padding: 6px !important;
  padding-bottom: 0 !important;
  overflow: visible !important;
  position: relative !important;
}
/* The card wrapper */
.girl .thumb {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  transition: border-color var(--trans), transform var(--trans), box-shadow var(--trans);
  position: relative !important;
}
.girl .thumb:hover {
  border-color: var(--accent) !important;
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(255,45,122,.18) !important;
}
.girl .thumb .thumbwrapper {
  position: relative !important;
  overflow: hidden;
  display: block;
}
/* Image */
.girl .thumb .thumbwrapper a { display: block !important; line-height: 0 !important; }
.girl .thumb .thumbwrapper a img {
  width: 100% !important;
  height: 220px !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.5s ease !important;
}
.girl .thumb:hover .thumbwrapper a img { transform: scale(1.07); }

/* Info panel below image */
.girl .model-info {
  position: relative !important;
  bottom: auto !important;
  left: auto !important;
  width: 100% !important;
  background: var(--surface) !important;
  padding: 10px 12px 12px !important;
  border-top: 1px solid var(--border) !important;
  line-height: 1 !important;
}
.girl .desc { background: transparent !important; padding: 0 !important; text-align: left !important; }
.girl a .desc .girl-name {
  color: var(--text-1) !important;
  font-size: 0.92rem !important;
  font-weight: 600 !important;
  text-shadow: none !important;
  display: block !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  margin-bottom: 4px !important;
}
.girl a .desc .girl-name a { color: var(--text-1) !important; }
.girl a:hover .desc { background: transparent !important; }
.girl .desc .girl-desc-location {
  color: var(--text-2) !important;
  font-size: 0.78rem !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 3px;
}

/* Label chips (Verified / New / Online) */
.girl .thumb .thumbwrapper .labels {
  position: absolute !important;
  top: 8px !important;
  left: 8px !important;
  width: auto !important;
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 0 !important;
  z-index: 2;
}
.girl .thumb .thumbwrapper .label {
  font-size: 0.65rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 3px 8px !important;
  border-radius: 4px !important;
  float: none !important;
  margin: 0 !important;
  display: inline-block !important;
  width: max-content !important;
}
.girl .thumb .thumbwrapper .label-new      { background: var(--accent) !important; color: #fff !important; }
.girl .thumb .thumbwrapper .label-verified { background: var(--verified) !important; color: #fff !important; }
.girl .thumb .thumbwrapper .label-private  { background: var(--danger) !important; color: #fff !important; }
.girl .thumb .thumbwrapper .online-label   {
  background: rgba(0,229,160,.15) !important;
  border: 1px solid var(--online) !important;
  color: var(--online) !important;
}

/* VIP+ premium card */
.girl .girlpremium { background: transparent !important; }
.girl .thumb.girlpremium {
  border-color: var(--gold) !important;
  box-shadow: 0 0 0 1px var(--gold-soft) !important;
}
.girl .girlpremium .premiumlabel {
  position: absolute !important;
  top: 8px !important; right: 8px !important;
  left: auto !important;
  z-index: 2 !important;
}
.girl .girlpremium .premiumlabel span {
  display: inline-block !important;
  background: linear-gradient(135deg, var(--gold), var(--gold-2)) !important;
  color: #000 !important;
  font-size: 0.62rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  padding: 4px 9px !important;
  border-radius: 4px !important;
  transform: none !important;
  -webkit-transform: none !important;
  width: auto !important;
  line-height: 1.4 !important;
  position: static !important;
  top: auto !important; right: auto !important;
  box-shadow: 0 2px 12px rgba(201,168,76,.3) !important;
}
.girl .girlpremium .premiumlabel span::before,
.girl .girlpremium .premiumlabel span::after { display: none !important; }

/* Video badge */
.girl .thumb .thumbwrapper .label-video {
  position: absolute !important;
  top: 50% !important; left: 50% !important;
  transform: translate(-50%,-50%) !important;
  width: auto !important;
  z-index: 3;
}
.girl .thumb .thumbwrapper .label-video img { max-width: 48px !important; opacity: 0.9; }

/* ═══════════════════════════════════════════════════════════
   10. REVIEWS SECTION
   ═══════════════════════════════════════════════════════════ */
.onereviewtext.onereviewtext-homepage {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 16px !important;
  margin-bottom: 10px !important;
  transition: border-color var(--trans);
}
.onereviewtext.onereviewtext-homepage:hover { border-color: var(--accent) !important; }
.onereviewtext .author { color: var(--text-2) !important; font-size: 0.82rem !important; }
.onereviewtext .reviewtext { color: var(--text-1) !important; font-size: 0.9rem !important; line-height: 1.6 !important; }
.starrating { display: inline-flex; }

/* ═══════════════════════════════════════════════════════════
   11. SIDEBAR LEFT
   ═══════════════════════════════════════════════════════════ */
.sidebar-left, .sidebar-right { width: 260px !important; }
.sidebar-left,
.sidebar-left.l {
  float: left !important;
  margin-left: -100% !important;
  background: var(--bg) !important;
  border-right: 1px solid var(--border) !important;
}
.sidebar-left .countries {
  background: transparent !important;
  border-bottom: 1px solid var(--border) !important;
  padding: 20px 16px !important;
}
.sidebar-left .countries h4 {
  color: var(--text-2) !important;
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  padding-bottom: 12px !important;
}
.sidebar-left .country-list { padding: 0; }
.sidebar-left .country-list li { list-style: none !important; line-height: 2em !important; }
.sidebar-left .country-list a {
  color: var(--text-2) !important;
  font-size: 0.88rem !important;
  display: inline-block !important;
  vertical-align: middle !important;
  transition: color var(--trans);
}
.sidebar-left .country-list a:hover { color: var(--accent) !important; }
.sidebar-left .country-list .iconlocation {
  color: var(--text-3) !important;
  display: inline-block !important;
  vertical-align: middle !important;
  cursor: pointer;
  transition: all var(--trans);
}
.sidebar-left .country-list .iconlocation:hover {
  color: var(--accent) !important;
  background: var(--accent-soft) !important;
  border-radius: 50%;
}
.sidebar-left .country-list ul { padding-left: 16px !important; }

/* ═══════════════════════════════════════════════════════════
   12. SIDEBAR RIGHT
   ═══════════════════════════════════════════════════════════ */
.sidebar-right {
  float: left !important;
  margin-left: -260px !important;
  background: var(--bg) !important;
  border-left: 1px solid var(--border) !important;
}
.sidebar-right .sidebar-expire-notice {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  margin: 12px !important;
  padding: 12px !important;
  color: var(--text-2) !important;
}

/* ═══════════════════════════════════════════════════════════
   13. WIDGET BOX
   ═══════════════════════════════════════════════════════════ */
.widgetbox-wrapper {
  background: transparent !important;
  border-bottom: 1px solid var(--border) !important;
  padding: 16px !important;
  margin: 0 !important;
}
.widgetbox h4 {
  color: var(--text-2) !important;
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  padding-bottom: 10px !important;
}
.widgetbox li { color: var(--text-2) !important; line-height: 2em !important; }
.widgetbox li a { color: var(--text-2) !important; }
.widgetbox li a:hover { color: var(--accent) !important; }

/* ═══════════════════════════════════════════════════════════
   14. FOOTER
   Real footer content comes from ONE WordPress widget area ('Footer'),
   each widget wrapped in <div class="widgetbox rad3 widget {name} l">.
   The original theme gives these zero width/gap — they just float raw.
   We turn .footer into a flex row so however many widgets the site owner
   adds, they line up as even modern columns instead of an unstyled dump.
   ═══════════════════════════════════════════════════════════ */
.footer {
  background: var(--surface) !important;
  border-top: 1px solid var(--border) !important;
  padding: 36px 32px 28px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 32px !important;
}
.footer .widgetbox {
  float: none !important;
  color: var(--text-2) !important;
  padding: 0 !important;
  flex: 1 1 200px !important;
  min-width: 180px !important;
}
.footer .widgetbox h4,
.footer .widgettitle {
  color: var(--text-1) !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  padding-bottom: 14px !important;
  border: none !important;
}
.footer .widgetbox li { color: var(--text-2) !important; line-height: 2em !important; }
.footer .widgetbox a { color: var(--text-2) !important; font-size: 0.88rem !important; }
.footer .widgetbox a:hover { color: var(--accent) !important; }
.footer .placeholder-widgettext { color: var(--text-3) !important; text-align: left !important; }
.underfooter {
  background: var(--bg) !important;
  border-top: 1px solid var(--border) !important;
  padding: 14px 32px !important;
  color: var(--text-2) !important;
  font-size: 0.8rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap;
  gap: 8px;
}
.underfooter a { color: var(--text-2) !important; }
.underfooter a:hover { color: var(--accent) !important; }

/* ═══════════════════════════════════════════════════════════
   15. FORMS & INPUTS
   ═══════════════════════════════════════════════════════════ */
input[type="text"], input[type="email"], input[type="password"],
input[type="number"], input[type="search"], input[type="tel"],
input[type="url"], textarea, select {
  background: var(--surface-2) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-btn) !important;
  color: var(--text-1) !important;
  font-family: var(--font) !important;
  transition: border-color var(--trans), box-shadow var(--trans);
}
input::placeholder, textarea::placeholder { color: var(--text-3) !important; }
input:focus, textarea:focus, select:focus {
  border-color: var(--accent) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px var(--accent-soft) !important;
}
select option { background: var(--surface-2) !important; color: var(--text-1) !important; }

/* ═══════════════════════════════════════════════════════════
   16. STATUS MESSAGES
   ═══════════════════════════════════════════════════════════ */
.err {
  background: rgba(255,51,85,.15) !important;
  border: 1px solid var(--danger) !important;
  color: var(--danger) !important;
  border-radius: var(--radius-btn) !important;
}
.ok {
  background: rgba(0,229,160,.1) !important;
  border: 1px solid var(--online) !important;
  color: var(--online) !important;
  border-radius: var(--radius-btn) !important;
}

/* ═══════════════════════════════════════════════════════════
   17. PAGINATION
   ═══════════════════════════════════════════════════════════ */
.pagination, .wp-pagenavi { display: flex; gap: 6px; justify-content: center; padding: 20px 0; flex-wrap: wrap; }
.pagination a, .wp-pagenavi a, .wp-pagenavi span {
  background: var(--surface-2) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-2) !important;
  border-radius: var(--radius-btn) !important;
  padding: 6px 12px !important;
  font-size: 0.85rem;
  transition: all var(--trans);
  text-decoration: none;
}
.pagination a:hover, .wp-pagenavi a:hover {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
}
.wp-pagenavi span.current {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
}

/* ═══════════════════════════════════════════════════════════
   18. SINGLE PROFILE PAGE — full coverage
   Original theme renders this page on white tiles (.profile-header-name-info,
   .girlinfo-section, .aboutme, .review-wrapper, .escortcontact all had
   background:#fff). Every one of those needs an explicit dark surface here,
   not just the parent .girlsingle text color, or text goes white-on-white.
   ═══════════════════════════════════════════════════════════ */
.girlsingle { color: var(--text-1) !important; }
.girlsingle a { color: var(--accent) !important; }
.girlsingle a:hover { color: var(--accent-2) !important; }

/* Name + title row */
.girlsingle .profile-title {
  color: var(--text-1) !important;
  font-family: var(--font-display) !important;
  font-weight: 800 !important;
}
.girlsingle.agency-profile .profile-header .profile-title { color: var(--text-1) !important; }
.girlsingle .girlsinglelabels span { border-radius: var(--radius-btn) !important; }

/* Stat strip: height / weight / age pills + phone/whatsapp box
   — was a flat white background, now a surface card */
.girlsingle .profile-header .profile-header-name-info {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 14px 16px !important;
}
.girlsingle .profile-header-mobile1 .profile-header-name-info,
.girlsingle .profile-header-mobile2 .profile-header-name-info {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
}
.girlsingle .profile-header .profile-header-name-info .section-box .valuecolumn {
  color: var(--accent) !important;
}
.girlsingle .profile-header .profile-header-name-info .section-box b {
  color: var(--text-2) !important;
}
.girlsingle .profile-header .phone-box .label,
.girlsingle .profile-header .available-on .label {
  color: var(--text-2) !important;
}
.girlsingle .profile-header .phone-box a,
.girlsingle .profile-header .available-on a {
  color: var(--accent) !important;
}
.girlsingle .profile-header .phone-box a:hover { color: var(--accent-2) !important; }
.girlsingle .profile-header .phone-box .icon-phone { color: var(--text-3) !important; }

/* Big photo + thumbnail strip */
.girlsingle .bigimage img { border-radius: var(--radius) !important; }
.girlsingle .thumbs img { border-radius: var(--radius-sm) !important; border: 1px solid var(--border) !important; }

/* Locked / paywall section — keep accent-filled, just match new accent color */
.girlsingle .lockedsection {
  background-color: var(--surface-2) !important;
  border: 1px solid var(--accent) !important;
  color: var(--text-1) !important;
  border-radius: var(--radius) !important;
}
.girlsingle .lockedsection a { color: var(--accent) !important; }
.girlsingle .lockedsection span.nr { background: var(--accent) !important; color: #fff !important; border-radius: 4px !important; }

/* Info cards: bio / stats / services / contact
   — these were .girlinfo-section { background:#fff }, the single biggest miss */
.girlsingle .girlinfo .girlinfo-section {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
}
.girlsingle .girlinfo .b .b-label { color: var(--text-1) !important; }
.girlsingle .valuecolumn, .girlsingle b { color: var(--text-1) !important; }
.girlinfo .section-box b { color: var(--accent) !important; }
.girlsingle .girlinfo .services .icon-ok { color: var(--online) !important; }
.girlsingle .girlinfo .services .icon-cancel { color: var(--danger) !important; }

/* About-me block — was .aboutme { background:#fff } */
.girlsingle .aboutme {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  color: var(--text-1) !important;
}
.girlsingle .aboutme a,
.girlsingle .contact .currently-on-tour-in a { color: var(--accent) !important; }
.girlsingle .aboutme a:hover,
.girlsingle .contact .currently-on-tour-in a:hover { color: var(--accent-2) !important; }
.girlsingle .aboutme .currently-on-tour-in,
.girlsingle .contact .currently-on-tour-in {
  color: var(--accent) !important;
  border: 1px solid var(--accent) !important;
  background: var(--accent-soft) !important;
  border-radius: var(--radius-btn) !important;
}

/* Section headers (ABOUT ME / SERVICES / RATES) — gold-rule treatment matches homepage */
.girlsingle h4, .girlsingle .aboutme h4, .clientreviewtext h4 {
  color: var(--text-1) !important;
  border-left: 3px solid var(--accent) !important;
  background: transparent !important;
}

/* Visitor counter chip */
.girlsingle .visitor-counter { color: var(--accent) !important; }
.girlsingle .visitor-counter .count {
  color: #fff !important;
  background: var(--accent) !important;
  text-shadow: none !important;
  border-radius: 4px !important;
}

/* Contact / escort-contact panel — was .escortcontact { background:#fff8fe } */
.girlsingle .escortcontact {
  background-color: var(--surface-2) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
}
.girlsingle .contact span a { color: var(--accent) !important; }

/* Reviews on the profile page — was .review-wrapper { background:#fff } */
.girlsingle .review-wrapper {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  color: var(--text-1) !important;
}
.review .addedby {
  background-color: var(--surface-2) !important;
  color: var(--text-2) !important;
  border-radius: 4px !important;
}
.review .addedby b, .review .addedby a { color: var(--text-1) !important; }

/* Rates table */
.girlsingle .rates-table th.hide-incall,
.girlsingle .rates-table th.hide-outcall {
  background: var(--accent) !important;
  color: #fff !important;
}

/* No-media upload placeholders (escort's own dashboard view) */
.girlsingle .profile-page-no-media {
  border: 2px dashed var(--border) !important;
  color: var(--text-2) !important;
  background: var(--surface) !important;
  border-radius: var(--radius) !important;
}
.girlsingle .profile-page-no-media:hover { border-color: var(--accent) !important; }
.girlsingle .profile-page-no-media p u { color: var(--accent) !important; }
.girlsingle .profile-page-no-media .icon { color: var(--accent) !important; }
.girlsingle .max-photos b, .girlsingle .max-videos b { background: var(--accent) !important; border-radius: 3px !important; }

/* Agency profile variant */
.girlsingle.agency-profile .agencydetails { color: var(--text-1) !important; }

/* Generic send-message / contact wrapper used elsewhere on this page */
.girlsingle .send-message, .girlsingle .contact-wrapper {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 16px !important;
}

/* ═══════════════════════════════════════════════════════════
   19. AGE TOS OVERLAY
   ═══════════════════════════════════════════════════════════ */
.tosdisclaimer-overlay { background: rgba(0,0,0,.9) !important; backdrop-filter: blur(12px); }
.tosdisclaimer-wrapper {
  background: var(--surface-2) !important;
  border: 1px solid var(--border) !important;
  border-radius: 16px !important;
  color: var(--text-1) !important;
}

/* ═══════════════════════════════════════════════════════════
   20. ONLINE DOT
   ═══════════════════════════════════════════════════════════ */
.girl .thumbwrapper .model-info .labels .online-status .notification-circle:after {
  background: var(--online) !important;
}
.notification-circle { background: var(--online) !important; }

/* ═══════════════════════════════════════════════════════════
   21. SEPARATORS
   ═══════════════════════════════════════════════════════════ */
.show-separator { display: none !important; }
.clear { clear: both; }

/* ═══════════════════════════════════════════════════════════
   22. TAXONOMY/SEARCH PAGE chrome
   ═══════════════════════════════════════════════════════════ */
.bodybox .taxonomy-description-box {
  color: var(--text-2) !important;
  border-top: 1px solid var(--border) !important;
  padding: 14px 0 0 !important;
  margin-top: 14px !important;
  font-size: 0.9rem !important;
}
.bodybox .settingspagetitle { color: var(--accent) !important; font-family: var(--font-display) !important; }
.bodybox .pagetitle-menu .pagetitle.l {
  float: none !important;
  color: var(--text-1) !important;
}

/* ═══════════════════════════════════════════════════════════
   22.5 REMAINING PUBLIC-FACING WHITE TILES
   Full-stylesheet audit found 48 separate #fff background declarations.
   Sections 1-22 cover the homepage, grid, and single-profile page.
   This section covers every OTHER user-facing page that still had a
   raw white tile in the original stylesheet — agencies list, login,
   register, report-abuse form, agency reviews, and shared chrome
   (header dropdown background, sidebar location-pin hover, ad boxes).
   ═══════════════════════════════════════════════════════════ */

/* Header dropdown + active-page submenu — was background:#fff */
.header-top-bar .header-nav .header-menu .current_page_item ul li a {
  background: transparent !important;
}

/* Slider pagination dots (legacy, non-Owl fallback) */
.slider-pagination a {
  background: var(--surface-2) !important;
  border: 1px solid var(--border) !important;
}

/* Sidebar left location pin hover circle */
.sidebar-left .country-list .iconlocation:hover { background: var(--accent-soft) !important; }

/* Sidebar-left/right widget wrapper band — was #fff0f4 (pale pink) */
.widgetbox-wrapper {
  background-color: transparent !important;
  border-bottom: 1px solid var(--border) !important;
}

/* Sidebar right misc UI: fake button, dropdown links */
.sidebar-right .sidebar-expire-notice .fake-button {
  background: var(--surface-2) !important;
  color: var(--text-1) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-btn) !important;
}
.sidebar-right .upgradeescortbox .input {
  background-color: var(--surface-2) !important;
  color: var(--text-1) !important;
}
.sidebar-right .dropdownlinks ul {
  background-color: var(--surface-2) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
}

/* Report-profile form popout */
.report-profile-wrapper .report-profile-reason-wrapper {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  color: var(--text-1) !important;
}

/* List Agencies table */
.listagencies .trhead th {
  background-color: var(--accent) !important;
  border-bottom: 1px solid var(--border) !important;
}
.listagencies .agencytr { border-bottom: 1px solid var(--border) !important; }
.listagencies .agencytr td a { color: var(--accent) !important; }
.listagencies .agencytr td a:hover { color: var(--accent-2) !important; }
.listagencies .whiterow { background-color: var(--surface) !important; }
.agencytrgray { background-color: var(--surface-2) !important; }

/* Single agency profile details */
.agencydetails { color: var(--text-1) !important; }
.agencydetails a { color: var(--accent) !important; }

/* Agency reviews block — was .review-wrapper { background:#fff } */
.agency-reviews-bodybox h4 {
  color: var(--text-1) !important;
  border-left: 3px solid var(--accent) !important;
}
.agency-reviews-bodybox .review-wrapper {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  color: var(--text-1) !important;
}

/* Login page */
.login #login { background: transparent !important; }
.login form {
  background-color: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
}
.login form.form-styling .form-input .input:focus {
  border: 1px solid var(--accent) !important;
  box-shadow: 0 0 0 3px var(--accent-soft) !important;
}
.login .message { color: var(--text-2) !important; }

/* Register page — user type selection cards */
.registerpage .usertype {
  background-color: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  color: var(--text-2) !important;
}
.registerpage .usertype .usertype-title { background: var(--surface-2) !important; }
.registerpage .usertype .userlist { color: var(--text-2) !important; }
.registerpage .usertype .userlist .icon { color: var(--verified) !important; }
.registerpage .usertype .usertype-bottom { border-top: 1px solid var(--border) !important; }

/* Generic form fieldset legend background (used across edit-profile forms) */
.form-styling .fieldset legend {
  background-color: var(--bg) !important;
  color: var(--text-2) !important;
}

/* ═══════════════════════════════════════════════════════════
   23. MOBILE RESPONSIVE
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 1200px) {
  .body { margin: 0 220px !important; }
  .sidebar-left, .sidebar-right { width: 220px !important; }
  .sidebar-right { margin-left: -220px !important; }
  .girl { width: 25% !important; }
  .slider-constrain { margin: 0 220px !important; }
}
@media (max-width: 900px) {
  .header-top-bar { padding: 0 16px !important; height: 60px !important; }
  .header-top-bar .header-nav { display: none !important; }
  .header-top-bar .subnav-menu-wrapper { display: none !important; }
  header .hamburger-menu { display: flex !important; }
  .body { margin: 0 !important; border: none !important; }
  .sidebar-left, .sidebar-right { display: none !important; }
  .girl { width: 50% !important; }
  .slider-constrain { margin: 0 !important; padding: 0 !important; }
  .sliderall { border-radius: 0 !important; border-left: none !important; border-right: none !important; }
  .slider .slide .girlimg,
  .slider .slide .girlimg img,
  .slider, .slider .slide { height: 240px !important; max-height: 240px !important; }
  .slider .slide .girlinfo .modelname { font-size: 1.4rem !important; }
  .slider .slide .girlinfo { left: 18px !important; bottom: 18px !important; max-width: 75% !important; }
}
@media (max-width: 560px) {
  .girl { width: 50% !important; padding: 4px !important; }
  .girl .thumb .thumbwrapper a img { height: 180px !important; }
}