/* CamGrid - Midnight Glass skin */

body.camgrid-theme.cg-style-midnight {
  --cg-bg: #060a11;
  --cg-bg-2: #09101a;
  --cg-panel: rgba(14, 21, 33, .78);
  --cg-panel-2: rgba(20, 29, 44, .78);
  --cg-panel-3: rgba(28, 39, 57, .72);
  --cg-border: rgba(183, 206, 235, .10);
  --cg-border-soft: rgba(183, 206, 235, .065);
  --cg-text: #f3f7fc;
  --cg-muted: #95a2b5;
  --cg-dim: #6f7d91;
  --cg-shadow: 0 24px 64px rgba(0, 5, 14, .55);
  background:
    radial-gradient(circle at 84% 8%, rgba(49, 91, 144, .12), transparent 30%),
    radial-gradient(circle at 8% 70%, rgba(26, 57, 93, .11), transparent 36%),
    #060a11 !important;
  color: var(--cg-text) !important;
}

html:has(body.cg-style-midnight) {
  background: #060a11 !important;
  color-scheme: dark;
}

/* Header / top chrome */
body.cg-style-midnight .cg-header {
  background: rgba(7, 12, 20, .88) !important;
  border-bottom-color: rgba(190, 210, 235, .08) !important;
  box-shadow: 0 18px 44px rgba(0, 5, 14, .42) !important;
  backdrop-filter: blur(18px) saturate(135%);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
}
body.cg-style-midnight .cg-topbar {
  background: rgba(7, 12, 20, .80) !important;
  border-bottom-color: rgba(190, 210, 235, .065) !important;
}
body.cg-style-midnight .cg-tabs {
  background: rgba(8, 14, 23, .78) !important;
  border-bottom-style: none !important;
}
body.cg-style-midnight .cg-tab {
  color: #9ba8ba !important;
}
body.cg-style-midnight .cg-tab:hover {
  color: #eef5ff !important;
  background: rgba(157, 190, 229, .055) !important;
}
body.cg-style-midnight .cg-tab.is-active {
  color: #f6f9fd !important;
  background: rgba(157, 190, 229, .075) !important;
}
body.cg-style-midnight .cg-brand,
body.cg-style-midnight .cg-brand-text,
body.cg-style-midnight .cg-brand-text-first {
  color: #f4f8fd !important;
}
body.cg-style-midnight .cg-menu-toggle,
body.cg-style-midnight .cg-sidebar-close,
body.cg-style-midnight .cg-live-pill,
body.cg-style-midnight .cg-auth-secondary {
  background: rgba(24, 34, 50, .72) !important;
  border-color: rgba(185, 208, 237, .12) !important;
  color: #eef5fd !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
}
body.cg-style-midnight .cg-menu-toggle:hover,
body.cg-style-midnight .cg-sidebar-close:hover,
body.cg-style-midnight .cg-auth-secondary:hover {
  background: rgba(34, 47, 67, .86) !important;
  border-color: rgba(185, 208, 237, .20) !important;
}
body.cg-style-midnight .cg-live-pill {
  color: #9eacc0 !important;
}

/* Search */
body.cg-style-midnight .cg-search {
  background: rgba(15, 23, 36, .78) !important;
  border-color: rgba(185, 208, 237, .11) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
}
body.cg-style-midnight .cg-search:focus-within {
  background: rgba(18, 28, 43, .94) !important;
  border-color: rgba(185, 208, 237, .24) !important;
  box-shadow: 0 0 0 3px rgba(117, 159, 207, .07) !important;
}
body.cg-style-midnight .cg-search > i,
body.cg-style-midnight .cg-search-filter-toggle {
  color: #8190a5 !important;
}
body.cg-style-midnight .cg-search input {
  color: #f1f6fc !important;
}
body.cg-style-midnight .cg-search input::placeholder {
  color: #6f7d91 !important;
}
body.cg-style-midnight .cg-search-submit {
  background: rgba(37, 52, 73, .90) !important;
  border-color: rgba(185, 208, 237, .12) !important;
  color: #edf5ff !important;
}
body.cg-style-midnight .cg-search-submit i {
  color: #edf5ff !important;
}
body.cg-style-midnight .cg-search-submit:hover {
  background: rgba(48, 66, 91, .96) !important;
}

/* Sidebar */
body.cg-style-midnight .cg-sidebar {
  background: rgba(8, 14, 23, .92) !important;
  color: var(--cg-text) !important;
  border-right-color: rgba(185, 208, 237, .08) !important;
  box-shadow: 16px 0 42px rgba(0, 5, 14, .32) !important;
  backdrop-filter: blur(18px) saturate(125%);
  -webkit-backdrop-filter: blur(18px) saturate(125%);
}
body.cg-style-midnight .cg-sidebar-head {
  background: rgba(13, 21, 33, .84) !important;
  border-bottom-color: rgba(185, 208, 237, .07) !important;
}
body.cg-style-midnight .cg-sidebar-title strong {
  color: #edf4fd !important;
}
body.cg-style-midnight .cg-sidebar-title span,
body.cg-style-midnight .cg-filter-section h3 {
  color: #78879c !important;
}
body.cg-style-midnight .cg-sidebar-title i,
body.cg-style-midnight .cg-side-menu a i,
body.cg-style-midnight .cg-filter-name i,
body.cg-style-midnight .cg-sidebar-pages a i {
  color: #7f8fa5 !important;
}
body.cg-style-midnight .cg-side-menu a,
body.cg-style-midnight .cg-filter-row,
body.cg-style-midnight .cg-sidebar-pages a {
  color: #a1aec0 !important;
}
body.cg-style-midnight .cg-side-menu a:hover,
body.cg-style-midnight .cg-filter-row:hover,
body.cg-style-midnight .cg-sidebar-pages a:hover {
  background: rgba(143, 176, 214, .065) !important;
  color: #eef5ff !important;
}
body.cg-style-midnight .cg-side-menu a.is-active,
body.cg-style-midnight .cg-filter-row:has(input:checked),
body.cg-style-midnight .cg-filter-row.is-checked {
  background: rgba(143, 176, 214, .10) !important;
  color: #f6f9fd !important;
}
body.cg-style-midnight .cg-filter-section {
  border-bottom-color: rgba(185, 208, 237, .065) !important;
}
body.cg-style-midnight .cg-filter-count {
  color: #68778b !important;
}
body.cg-style-midnight .cg-sidebar::-webkit-scrollbar-thumb {
  background: rgba(185, 208, 237, .16) !important;
}

/* Sidebar promo */
body.cg-style-midnight #cg-sidebar .cg-sidebar-promo {
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--cg-accent) 28%, rgba(25,39,59,.96)) 0%,
      rgba(20, 31, 48, .96) 58%,
      rgba(10, 18, 29, .98) 100%
    ) !important;
  border-color: color-mix(in srgb, var(--cg-accent) 26%, rgba(185,208,237,.11)) !important;
  box-shadow:
    0 18px 38px rgba(0,5,14,.30),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
}
body.cg-style-midnight #cg-sidebar .cg-sidebar-promo strong {
  color: #f3f7fc !important;
}
body.cg-style-midnight #cg-sidebar .cg-sidebar-promo small {
  color: #98a6b8 !important;
}

/* Main surfaces */
body.cg-style-midnight .cg-main {
  color: var(--cg-text) !important;
}
body.cg-style-midnight .cg-section-title {
  color: #f1f6fc !important;
}
body.cg-style-midnight .cg-card {
  background: transparent !important;
}
body.cg-style-midnight .cg-thumb {
  background: #111a27 !important;
}
body.cg-style-midnight .cg-page-head,
body.cg-style-midnight .cg-empty-state,
body.cg-style-midnight .cg-video-card,
body.cg-style-midnight .cg-blog-card,
body.cg-style-midnight .cg-post-article,
body.cg-style-midnight.single-webcam .pc-header,
body.cg-style-midnight.single-webcam .pc-info-card {
  background: rgba(14, 22, 35, .74) !important;
  border-color: rgba(185, 208, 237, .10) !important;
  color: #eef5fd !important;
  box-shadow:
    0 20px 50px rgba(0,5,14,.30),
    inset 0 1px 0 rgba(255,255,255,.028) !important;
  backdrop-filter: blur(16px) saturate(120%);
  -webkit-backdrop-filter: blur(16px) saturate(120%);
}
body.cg-style-midnight .cg-page-head p,
body.cg-style-midnight .cg-empty-state,
body.cg-style-midnight .cg-video-body p,
body.cg-style-midnight .cg-blog-body p {
  color: #8f9db0 !important;
}
body.cg-style-midnight .cg-video-body h2,
body.cg-style-midnight .cg-blog-body h2,
body.cg-style-midnight .cg-video-card h2,
body.cg-style-midnight .cg-blog-card h2,
body.cg-style-midnight .cg-post-title {
  color: #f1f6fc !important;
}
body.cg-style-midnight .cg-video-card:hover,
body.cg-style-midnight .cg-blog-card:hover {
  background: rgba(20, 30, 46, .90) !important;
  border-color: rgba(185, 208, 237, .18) !important;
  box-shadow: 0 24px 58px rgba(0,5,14,.42) !important;
}
body.cg-style-midnight .cg-video-placeholder {
  color: #8290a4 !important;
  background: radial-gradient(circle at center, #182335, #0b111c) !important;
}
body.cg-style-midnight .cg-video-pagination .page-numbers,
body.cg-style-midnight .cg-video-pagination a,
body.cg-style-midnight .cg-video-pagination span {
  background: rgba(17, 26, 40, .82) !important;
  border-color: rgba(185, 208, 237, .11) !important;
  color: #9eacc0 !important;
}

/* Single webcam */
body.cg-style-midnight.single-webcam .pc-webcam-wrap {
  color: #edf4fd !important;
}
body.cg-style-midnight.single-webcam .pc-header .rounded-full,
body.cg-style-midnight.single-webcam .pc-compact-grid > div {
  background: rgba(24, 35, 52, .72) !important;
  border-color: rgba(185, 208, 237, .10) !important;
}
body.cg-style-midnight.single-webcam .pc-header a.text-lg,
body.cg-style-midnight.single-webcam .pc-info-card h3 {
  color: #f3f7fc !important;
}
body.cg-style-midnight.single-webcam .pc-header .text-sm,
body.cg-style-midnight.single-webcam .pc-header .text-gray-400,
body.cg-style-midnight.single-webcam .cg-single-country,
body.cg-style-midnight.single-webcam .cg-single-gender,
body.cg-style-midnight.single-webcam .pc-subttl,
body.cg-style-midnight.single-webcam .pc-description,
body.cg-style-midnight.single-webcam .pc-description p {
  color: #8796aa !important;
}
body.cg-style-midnight.single-webcam .pc-chip,
body.cg-style-midnight.single-webcam .pc-viewers,
body.cg-style-midnight.single-webcam .pc-more-btn {
  background: rgba(28, 41, 61, .78) !important;
  border-color: rgba(185, 208, 237, .10) !important;
  color: #c2ccda !important;
}
body.cg-style-midnight.single-webcam a.pc-chip:hover,
body.cg-style-midnight.single-webcam .pc-more-btn:hover {
  background: rgba(42, 58, 82, .88) !important;
  border-color: rgba(185, 208, 237, .18) !important;
  color: #f0f6fd !important;
}
body.cg-style-midnight.single-webcam .pc-embed,
body.cg-style-midnight.single-webcam .responsive-embed {
  border-color: rgba(185, 208, 237, .10) !important;
  box-shadow: 0 24px 60px rgba(0,5,14,.46) !important;
}
body.cg-style-midnight.single-webcam .cg-player-resize-handle span {
  background: rgba(190, 211, 237, .20) !important;
}

/* Favorites */
body.cg-style-midnight .cg-favorite-btn {
  background: rgba(13, 21, 33, .76) !important;
  border-color: rgba(185, 208, 237, .13) !important;
  color: #e8f0fa !important;
  box-shadow: 0 10px 22px rgba(0,5,14,.28) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
body.cg-style-midnight .cg-favorite-btn i {
  color: #e8f0fa !important;
}

/* Friends top bar / search filters / footer / bottom CTA */
body.cg-style-midnight .cg-friends-topbar {
  background: rgba(8, 14, 23, .88) !important;
  border-bottom-color: rgba(185, 208, 237, .07) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
body.cg-style-midnight .cg-friends-label {
  color: #6f7d91 !important;
}
body.cg-style-midnight .cg-friends-links a {
  color: #94a2b5 !important;
  background: rgba(148, 178, 214, .055) !important;
  border-color: rgba(185, 208, 237, .07) !important;
}
body.cg-style-midnight .cg-friends-links a:hover {
  color: #eef5ff !important;
  background: rgba(148, 178, 214, .10) !important;
}
body.cg-style-midnight .cg-search-filters-panel {
  background: rgba(12, 20, 32, .96) !important;
  border-color: rgba(185, 208, 237, .12) !important;
  color: #eef5fd !important;
  box-shadow: 0 24px 58px rgba(0,5,14,.58) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
body.cg-style-midnight .cg-search-filters-panel strong {
  color: #7f8da1 !important;
}
body.cg-style-midnight .cg-search-type-list label {
  color: #a8b4c5 !important;
}
body.cg-style-midnight .cg-search-type-list label:hover {
  background: rgba(148, 178, 214, .075) !important;
  color: #f2f7fd !important;
}
body.cg-style-midnight .cg-bottom-cta {
  background: rgba(9, 15, 25, .88) !important;
  border-color: rgba(185, 208, 237, .09) !important;
  box-shadow: 0 -16px 40px rgba(0,5,14,.30) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
body.cg-style-midnight .cg-bottom-cta span {
  color: #9aa8bb !important;
}
body.cg-style-midnight .cg-bottom-cta-close {
  background: rgba(30, 42, 61, .72) !important;
  border-color: rgba(185, 208, 237, .10) !important;
  color: #aebaca !important;
}
body.cg-style-midnight .cg-footer {
  background: transparent !important;
  color: #7f8da1 !important;
  border-color: rgba(185, 208, 237, .07) !important;
}
body.cg-style-midnight .cg-footer a {
  color: #8e9db0 !important;
}
body.cg-style-midnight .cg-footer a:hover {
  color: #eef5ff !important;
}

/* Age verification */
body.cg-style-midnight #age-verification-overlay {
  background:
    radial-gradient(circle at 80% 20%, rgba(51, 87, 131, .18), transparent 32%),
    rgba(4, 8, 14, .91) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}
body.cg-style-midnight #age-verification-overlay .verification-card,
body.cg-style-midnight #age-verification-overlay .verification-content {
  background: rgba(14, 22, 35, .90) !important;
  color: #f0f6fd !important;
  border-color: rgba(185, 208, 237, .12) !important;
  box-shadow:
    0 34px 90px rgba(0,5,14,.66),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}
body.cg-style-midnight #age-verification-overlay .verification-title,
body.cg-style-midnight #age-verification-overlay h2 {
  color: #f4f8fd !important;
}
body.cg-style-midnight #age-verification-overlay .verification-copy,
body.cg-style-midnight #age-verification-overlay .remember-row,
body.cg-style-midnight #age-verification-overlay p {
  color: #96a4b7 !important;
}
body.cg-style-midnight #age-verification-overlay .toggle-slider {
  background: rgba(31, 44, 65, .92) !important;
  border-color: rgba(185, 208, 237, .12) !important;
}
body.cg-style-midnight #age-verification-overlay .toggle-slider::before {
  background: #eef5fd !important;
  box-shadow: 0 3px 9px rgba(0,5,14,.42) !important;
}
body.cg-style-midnight #age-verification-overlay .toggle-checkbox:checked + .toggle-slider {
  background: var(--cg-accent) !important;
  border-color: color-mix(in srgb, var(--cg-accent) 72%, #b9d0ed 28%) !important;
}
body.cg-style-midnight #age-verification-overlay .toggle-checkbox:checked + .toggle-slider::before {
  background: var(--cg-accent-contrast) !important;
}
body.cg-style-midnight #age-verification-overlay .exit-link,
body.cg-style-midnight #age-verification-overlay .legal-text {
  color: #718096 !important;
}

/* Small-screen glass panels remain readable. */
@media (max-width: 1023px) {
  body.cg-style-midnight .cg-sidebar {
    background: rgba(8, 14, 23, .97) !important;
  }
}