/*
 * Terminal / Catppuccin Theme
 * Dark terminal aesthetic using Catppuccin Mocha color palette
 * Completely self-contained - does not depend on main application styles
 */

/* ===== CSS Base (scoped) ===== */
.themed-page {
  box-sizing: border-box;
}

.themed-page *,
.themed-page *::before,
.themed-page *::after {
  box-sizing: inherit;
}

/* ===== CSS Variables (Catppuccin Mocha) ===== */
:root {
  /* Base colors */
  --cat-base: #1e1e2e;
  --cat-mantle: #181825;
  --cat-crust: #11111b;

  /* Surface colors */
  --cat-surface0: #313244;
  --cat-surface1: #45475a;
  --cat-surface2: #585b70;

  /* Overlay colors */
  --cat-overlay0: #6c7086;
  --cat-overlay1: #7f849c;
  --cat-overlay2: #9399b2;

  /* Text colors */
  --cat-subtext0: #a6adc8;
  --cat-subtext1: #bac2de;
  --cat-text: #cdd6f4;

  /* Accent colors */
  --cat-lavender: #b4befe;
  --cat-blue: #89b4fa;
  --cat-sapphire: #74c7ec;
  --cat-sky: #89dceb;
  --cat-teal: #94e2d5;
  --cat-green: #a6e3a1;
  --cat-yellow: #f9e2af;
  --cat-peach: #fab387;
  --cat-maroon: #eba0ac;
  --cat-red: #f38ba8;
  --cat-mauve: #cba6f7;
  --cat-pink: #f5c2e7;
  --cat-flamingo: #f2cdcd;
  --cat-rosewater: #f5e0dc;

  /* Terminal dots */
  --dot-close: #f38ba8;
  --dot-minimize: #f9e2af;
  --dot-maximize: #a6e3a1;

  /* Typography */
  --font-mono: 'JetBrains Mono', 'Fira Code', 'SF Mono', Consolas, 'Liberation Mono', monospace;
  --font-size-base: 15px;
  --line-height: 1.8;
}

/* ===== Page Base ===== */
.themed-page {
  font-family: var(--font-mono);
  font-size: var(--font-size-base);
  line-height: var(--line-height);
  background-color: var(--cat-base);
  color: var(--cat-text);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ===== Global Layout Overrides (Themed Full Page) ===== */
.themed-page .tw-site-header {
  background-color: var(--cat-mantle) !important;
  border-color: var(--cat-surface1) !important;
}

.themed-page .tw-site-header,
.themed-page .tw-site-header a,
.themed-page .tw-site-header .tw-site-logo-text {
  color: var(--cat-text) !important;
}

.themed-page .tw-site-header .tw-site-logo img {
  max-height: 2.1rem !important;
  width: 46vw;
  max-width: 220px !important;
}

.themed-page .tw-site-header .tw-tab-link,
.themed-page .tw-site-header .tw-tab-link-active,
.themed-page .tw-site-header .tw-tab-link:visited,
.themed-page .tw-site-header .tw-tab-link:hover,
.themed-page .tw-site-header .tw-tab-link:focus {
  color: var(--cat-text) !important;
}

.themed-page .tw-site-header .tw-button,
.themed-page .tw-site-header .tw-button-low-profile-white,
.themed-page .tw-site-header .tw-button-outline {
  color: var(--cat-text) !important;
}

.themed-page .tw-site-header .tw-button,
.themed-page .tw-site-header .tw-button-low-profile-white {
  background-color: var(--cat-crust) !important;
  border-color: var(--cat-subtext1) !important;
  box-shadow: none !important;
}

.themed-page .tw-site-header .tw-button-outline {
  background-color: var(--cat-crust) !important;
  border-color: var(--cat-subtext1) !important;
}

.themed-page .tw-site-header summary a,
.themed-page .tw-site-header summary a:visited,
.themed-page .tw-site-header summary a:hover,
.themed-page .tw-site-header summary a:focus {
  background-color: var(--cat-crust) !important;
  border-color: var(--cat-subtext1) !important;
  color: var(--cat-text) !important;
}

.themed-page .tw-site-header summary a span {
  color: var(--cat-subtext1) !important;
}

.themed-page .tw-site-header a.tw-nav-mobile,
.themed-page .tw-site-header a.tw-nav-mobile:visited,
.themed-page .tw-site-header a.tw-nav-mobile:hover,
.themed-page .tw-site-header a.tw-nav-mobile:focus {
  background-color: var(--cat-crust) !important;
  border-color: var(--cat-subtext1) !important;
  color: var(--cat-text) !important;
  box-shadow: none !important;
}

.themed-page .tw-site-header .tw-header-signin,
.themed-page .tw-site-header .tw-header-signin:visited,
.themed-page .tw-site-header .tw-header-signin:hover,
.themed-page .tw-site-header .tw-header-signin:focus {
  background-color: var(--cat-crust) !important;
  border-color: var(--cat-subtext1) !important;
  color: var(--cat-text) !important;
}

.themed-page [aria-label="Breadcrumb"] a,
.themed-page [aria-label="Breadcrumb"] span {
  color: var(--cat-subtext1) !important;
}

.themed-page footer {
  background-color: var(--cat-mantle) !important;
  border-color: var(--cat-surface1) !important;
  color: var(--cat-subtext1) !important;
}

.themed-page footer a {
  color: var(--cat-blue) !important;
}

.themed-page footer.bg-white {
  background-color: var(--cat-mantle) !important;
}

.themed-page footer .text-slate-500,
.themed-page footer .text-slate-600,
.themed-page footer .text-slate-400,
.themed-page footer .text-muted {
  color: var(--cat-subtext1) !important;
}

.themed-page footer.border-slate-200 {
  border-color: var(--cat-surface1) !important;
}

.themed-page footer.border-t.border-slate-200.bg-white {
  background-color: var(--cat-mantle) !important;
}

/* ===== Contact + Subscribe Cards ===== */
.themed-page .contact-us-message,
.themed-page .subscribe-form {
  background-color: var(--cat-crust) !important;
  border-color: var(--cat-surface1) !important;
  box-shadow: none !important;
}

.themed-page .contact-us-message .contact-us-heading,
.themed-page .subscribe-form h3,
.themed-page .subscribe-form h4,
.themed-page .subscribe-form label {
  color: var(--cat-text) !important;
}

.themed-page .contact-us-message .contact-us-subheading,
.themed-page .subscribe-form p,
.themed-page .subscribe-form .text-slate-500 {
  color: var(--cat-subtext1) !important;
}

.themed-page .contact-us-message .bg-slate-50,
.themed-page .subscribe-form .bg-white {
  background-color: var(--cat-base) !important;
}

.themed-page .contact-us-message .rounded-full.bg-indigo-50 {
  background-color: var(--cat-surface0) !important;
  border: 1px solid var(--cat-surface1) !important;
  color: var(--cat-text) !important;
}

.themed-page .contact-us-message .rounded-full.bg-indigo-50 .fa {
  color: var(--cat-text) !important;
}

.themed-page .rsvp-event-icon,
.themed-page .rsvp-panel .rounded-full.bg-\[\#eef2ff\],
.themed-page .rsvp-panel .rounded-full.bg-slate-100,
.themed-page .rsvp-panel .rounded-full.bg-slate-50 {
  background-color: var(--cat-surface0) !important;
  border: 1px solid var(--cat-surface1) !important;
  color: var(--cat-text) !important;
}

.themed-page .rsvp-event-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 9999px;
  background-color: var(--cat-surface0) !important;
  border: 1px solid var(--cat-surface1) !important;
  color: var(--cat-text) !important;
  box-shadow: none !important;
}

.themed-page .rsvp-event-icon .fa,
.themed-page .rsvp-panel .rounded-full.bg-\[\#eef2ff\] .fa,
.themed-page .rsvp-panel .rounded-full.bg-slate-100 .fa,
.themed-page .rsvp-panel .rounded-full.bg-slate-50 .fa {
  color: var(--cat-text) !important;
}

.themed-page .subscribe-form input,
.themed-page .subscribe-form textarea {
  background-color: var(--cat-base) !important;
  border-color: var(--cat-surface1) !important;
  color: var(--cat-text) !important;
}

/* ===== Event/Attendee Panels ===== */
.themed-page .page-editor-controls {
  background-color: var(--cat-crust) !important;
  border-color: var(--cat-surface1) !important;
  box-shadow: none !important;
}

.themed-page .page-editor-controls__toggle {
  background-color: var(--cat-surface0) !important;
  border: 1px solid var(--cat-surface1) !important;
  color: var(--cat-text) !important;
}

.themed-page .page-editor-controls .text-slate-900,
.themed-page .page-editor-controls .text-slate-800,
.themed-page .page-editor-controls .text-slate-700 {
  color: var(--cat-text) !important;
}

.themed-page .page-editor-controls .text-slate-500,
.themed-page .page-editor-controls .text-slate-400 {
  color: var(--cat-subtext1) !important;
}

.themed-page .page-editor-controls .border-indigo-100,
.themed-page .page-editor-controls .border-indigo-100\/50,
.themed-page .page-editor-controls .border-slate-200 {
  border-color: var(--cat-surface1) !important;
}

.themed-page .page-editor-controls .tw-button,
.themed-page .page-editor-controls .tw-button-secondary,
.themed-page .page-editor-controls .tw-button-outline,
.themed-page .page-editor-controls .tw-button-low-profile,
.themed-page .page-editor-controls .tw-button-low-profile-white,
.themed-page .page-editor-controls .tw-button-brand {
  background-color: var(--cat-crust) !important;
  border-color: var(--cat-subtext1) !important;
  color: var(--cat-text) !important;
  box-shadow: none !important;
}

/* Global button overrides for secondary/outline buttons */
.themed-page .tw-button-secondary,
.themed-page .tw-button-outline,
.themed-page .tw-button-low-profile,
.themed-page .tw-button-low-profile-white {
  background-color: var(--cat-surface0) !important;
  border: 1px solid var(--cat-surface1) !important;
  color: var(--cat-text) !important;
  box-shadow: none !important;
}

/* ===== Form Fields (Dark Mode) ===== */
.themed-page input[type="text"],
.themed-page input[type="email"],
.themed-page input[type="url"],
.themed-page input[type="tel"],
.themed-page input[type="search"],
.themed-page input[type="password"],
.themed-page textarea,
.themed-page select {
  background-color: var(--cat-crust) !important;
  border-color: var(--cat-surface1) !important;
  color: var(--cat-text) !important;
  box-shadow: none !important;
  font-size: 16px !important;
}

.themed-page input[type="text"]::placeholder,
.themed-page input[type="email"]::placeholder,
.themed-page input[type="url"]::placeholder,
.themed-page input[type="tel"]::placeholder,
.themed-page input[type="search"]::placeholder,
.themed-page input[type="password"]::placeholder,
.themed-page textarea::placeholder {
  color: var(--cat-subtext1) !important;
  font-size: 16px !important;
}

.themed-page input[type="text"]:focus,
.themed-page input[type="email"]:focus,
.themed-page input[type="url"]:focus,
.themed-page input[type="tel"]:focus,
.themed-page input[type="search"]:focus,
.themed-page input[type="password"]:focus,
.themed-page textarea:focus,
.themed-page select:focus {
  border-color: var(--cat-blue) !important;
  outline: none !important;
}

/* RSVP surface */
/* ===== RSVP Form Font Sizes ===== */
.themed-page .rsvp-card,
.themed-page .rsvp-panel {
  background-color: var(--cat-crust) !important;
  border: none !important;
  color: var(--cat-text) !important;
  font-size: 16px !important;
}

.themed-page .rsvp-card label,
.themed-page .rsvp-panel label,
.themed-page .rsvp-card .text-sm,
.themed-page .rsvp-panel .text-sm,
.themed-page .rsvp-card .text-xs,
.themed-page .rsvp-panel .text-xs {
  font-size: 16px !important;
}

.themed-page .rsvp-card p,
.themed-page .rsvp-panel p {
  font-size: 16px !important;
}

.themed-page .rsvp-card {
  background-image: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.themed-page .render-meetup-rsvp-here .bg-white {
  background-color: var(--cat-crust) !important;
}

.themed-page .render-meetup-rsvp-here .border-slate-200 {
  border-color: var(--cat-surface1) !important;
}

.themed-page .render-meetup-rsvp-here .shadow-sm,
.themed-page .render-meetup-rsvp-here .shadow-lg {
  box-shadow: none !important;
}

/* Pending RSVP card: "Want to stand out?" sidebar */
.themed-page .render-meetup-rsvp-here .bg-slate-50\/60 {
  background-color: var(--cat-surface0) !important;
  border-color: var(--cat-surface1) !important;
}

.themed-page .render-meetup-rsvp-here .bg-indigo-50 {
  background-color: var(--cat-surface1) !important;
}

.themed-page .render-meetup-rsvp-here .text-indigo-300 {
  color: var(--cat-lavender) !important;
}

.themed-page .render-meetup-rsvp-here .text-slate-900 {
  color: var(--cat-text) !important;
}

.themed-page .render-meetup-rsvp-here .text-slate-500 {
  color: var(--cat-subtext1) !important;
}

.themed-page .render-meetup-rsvp-here .text-slate-400 {
  color: var(--cat-subtext0) !important;
}

.themed-page .render-meetup-rsvp-here .border-slate-100 {
  border-color: var(--cat-surface1) !important;
}

.themed-page .render-meetup-rsvp-here .bg-emerald-100 {
  background-color: var(--cat-surface0) !important;
}

.themed-page .render-meetup-rsvp-here .text-emerald-500 {
  color: var(--cat-green) !important;
}

.themed-page .render-meetup-rsvp-here .text-emerald-600 {
  color: var(--cat-green) !important;
}

.themed-page .render-meetup-rsvp-here .bg-blue-600 {
  background-color: var(--cat-blue) !important;
}

.themed-page .render-meetup-rsvp-here .bg-blue-100 {
  background-color: var(--cat-surface0) !important;
}

.themed-page .render-meetup-rsvp-here .text-blue-600 {
  color: var(--cat-blue) !important;
}

.themed-page .render-meetup-rsvp-here .bg-slate-100 {
  background-color: var(--cat-surface0) !important;
}

.themed-page .render-meetup-rsvp-here .bg-slate-200 {
  background-color: var(--cat-surface1) !important;
}

.themed-page .render-meetup-rsvp-here .text-xs.text-slate-500 {
  color: var(--cat-subtext0) !important;
}

.themed-page .rsvp-panel .bg-white {
  background-color: var(--cat-crust) !important;
}

.themed-page .rsvp-panel .border-slate-200 {
  border-color: var(--cat-surface1) !important;
}

.themed-page .rsvp-panel .text-slate-900,
.themed-page .rsvp-panel .text-slate-800,
.themed-page .rsvp-panel .text-slate-700 {
  color: var(--cat-text) !important;
}

.themed-page .rsvp-panel .text-slate-600,
.themed-page .rsvp-panel .text-slate-500 {
  color: var(--cat-subtext1) !important;
}

.themed-page .rsvp-panel h3,
.themed-page .rsvp-panel h4,
.themed-page .rsvp-panel h5,
.themed-page .rsvp-panel h6 {
  color: var(--cat-text) !important;
}

.themed-page .rsvp-panel h3::before,
.themed-page .rsvp-panel h4::before,
.themed-page .rsvp-panel h5::before,
.themed-page .rsvp-panel h6::before {
  content: none !important;
}

.themed-page .rsvp-info-panel .bg-white {
  background-color: var(--cat-crust) !important;
}

.themed-page .rsvp-info-panel .text-slate-900,
.themed-page .rsvp-info-panel .text-slate-800,
.themed-page .rsvp-info-panel .text-slate-700 {
  color: var(--cat-text) !important;
}

.themed-page .rsvp-info-panel .text-slate-600,
.themed-page .rsvp-info-panel .text-slate-500,
.themed-page .rsvp-info-panel .text-slate-400 {
  color: var(--cat-subtext1) !important;
}

.themed-page .rsvp-panel .rounded-full.bg-\[\#eef2ff\] {
  background-color: var(--cat-surface0) !important;
  border: 1px solid var(--cat-surface1) !important;
  color: var(--cat-text) !important;
  box-shadow: none !important;
}

.themed-page .rsvp-panel .rounded-full.bg-\[\#eef2ff\] .fa {
  color: var(--cat-text) !important;
}

.themed-page .rsvp-panel .rounded-full[class*="bg-[#eef2ff]"] {
  background-color: var(--cat-surface0) !important;
  border: 1px solid var(--cat-surface1) !important;
  color: var(--cat-text) !important;
  box-shadow: none !important;
}

.themed-page .rsvp-panel .rounded-full[class*="bg-[#eef2ff]"] .fa {
  color: var(--cat-text) !important;
}

.themed-page .rsvp-panel .rounded-full.bg-slate-100,
.themed-page .rsvp-panel .rounded-full.bg-slate-50 {
  background-color: var(--cat-surface0) !important;
  border: 1px solid var(--cat-surface1) !important;
  color: var(--cat-text) !important;
  box-shadow: none !important;
}

.themed-page .rsvp-panel .rounded-full.bg-slate-100 .fa,
.themed-page .rsvp-panel .rounded-full.bg-slate-50 .fa {
  color: var(--cat-text) !important;
}

.themed-page .rsvp-info-panel .border-slate-200 {
  border-color: var(--cat-surface1) !important;
}

.themed-page .rsvp-info-panel {
  background-color: var(--cat-crust) !important;
  border: 1px solid var(--cat-surface1) !important;
  border-radius: 16px !important;
  padding: 1.25rem !important;
}

@media (min-width: 768px) {
  .themed-page .rsvp-info-panel > .flex {
    align-items: flex-start !important;
  }

  .themed-page .rsvp-info-panel > .flex > div {
    width: 50% !important;
  }

  .themed-page .rsvp-info-panel > .flex > div + div {
    margin-top: 0 !important;
  }
}

.themed-page .rsvp-info-panel .shadow-sm,
.themed-page .rsvp-info-panel .shadow-lg {
  box-shadow: none !important;
}

.themed-page .rsvp-info-panel .bg-rose-600 {
  background-color: var(--cat-mauve) !important;
}

.themed-page .rsvp-info-panel .text-white {
  color: var(--cat-crust) !important;
}
.themed-page .render-meetup-rsvp-here {
  margin: 0 !important;
  padding: 0 !important;
}

.themed-page #meetup-rsvp-form {
  margin: 0 !important;
}

.themed-page .rsvp-panel {
  padding: 0 !important;
  background-color: transparent !important;
}

.themed-page.theme-terminal-catppuccin .render-meetup-rsvp-here #inline-auth-email-input {
  background-color: var(--cat-surface0) !important;
  border: 2px solid var(--cat-surface1) !important;
  color: var(--cat-text) !important;
  box-shadow: inset 0 0 0 1px rgba(137, 180, 250, 0.08) !important;
}

.themed-page.theme-terminal-catppuccin .render-meetup-rsvp-here #inline-auth-email-input::placeholder {
  color: var(--cat-subtext0) !important;
}

.themed-page.theme-terminal-catppuccin .render-meetup-rsvp-here #inline-auth-email-input:focus {
  border-color: var(--cat-blue) !important;
  box-shadow: 0 0 0 3px rgba(137, 180, 250, 0.18) !important;
}

.themed-page .rsvp-card {
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* RSVP card inner border - remove */
.themed-page .rsvp-card .border,
.themed-page .rsvp-card [class*="border-slate"],
.themed-page .rsvp-card .rounded-2xl.border,
.themed-page .rsvp-card .grid.border,
.themed-page .render-meetup-rsvp-here .grid.border {
  border: none !important;
}

/* RSVP title - larger font, monospace */
.themed-page .meetup-form-title,
.themed-page h3.meetup-form-title {
  font-family: var(--font-mono) !important;
  font-size: 2.8rem !important;
  line-height: 1.3 !important;
}

.themed-page article.story {
  background-color: var(--cat-base) !important;
  border-color: var(--cat-surface1) !important;
  box-shadow: none !important;
}

.themed-page article.bg-white {
  background-color: var(--cat-base) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.themed-page .themed-container {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0;
}

/* ===== Terminal Chrome ===== */
.themed-page .terminal-chrome {
  background-color: var(--cat-crust);
  border: 1px solid var(--cat-surface1);
  margin: 2rem 1rem;
}

.themed-page .terminal-header {
  background-color: var(--cat-mantle);
  padding: 0.75rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border-bottom: 1px solid var(--cat-surface1);
}

.themed-page .terminal-dots {
  display: flex;
  gap: 8px;
}

.themed-page .terminal-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}

.themed-page .terminal-dot--close { background-color: var(--dot-close); }
.themed-page .terminal-dot--minimize { background-color: var(--dot-minimize); }
.themed-page .terminal-dot--maximize { background-color: var(--dot-maximize); }

.themed-page .terminal-title {
  flex: 1;
  text-align: center;
  font-size: 13px;
  color: var(--cat-overlay1);
  margin-left: -60px; /* Center accounting for dots */
}

.themed-page .terminal-body {
  padding: 2rem;
  background-color: var(--cat-base);
}

/* ===== Typography ===== */
.themed-page h1,
.themed-page h2,
.themed-page h3,
.themed-page h4,
.themed-page h5,
.themed-page h6 {
  color: var(--cat-blue);
  font-family: var(--font-mono);
  font-weight: 600;
  margin-top: 2rem;
  margin-bottom: 1rem;
  line-height: 1.3;
}

.themed-page h1 { font-size: 36px; }
.themed-page h2 { font-size: 24px; }
.themed-page h3 { font-size: 20px; }
.themed-page h4 { font-size: 18px; }
.themed-page h5 { font-size: 17px; }
.themed-page h6 { font-size: 16px; }

/* Header prefix markers */
.themed-page h2::before {
  content: none;
}

.themed-page h3::before {
  content: none;
}

.themed-page p {
  margin-bottom: 1.25rem;
  color: #748194 !important;
}

.themed-page strong,
.themed-page b {
  color: var(--cat-text);
  font-weight: 600;
}

.themed-page em,
.themed-page i {
  font-style: italic;
  color: var(--cat-subtext1);
}

/* ===== Links ===== */
.themed-page a {
  color: var(--cat-blue);
  text-decoration: none;
  border-bottom: 1px dashed var(--cat-blue);
  transition: color 0.15s ease;
}

.themed-page a:hover {
  color: var(--cat-sapphire);
  border-bottom-color: var(--cat-sapphire);
}

.themed-page a.tw-button:hover {
  color: inherit;
  border-bottom-color: transparent;
}

.themed-page a:visited {
  color: var(--cat-mauve);
  border-bottom-color: var(--cat-mauve);
}

/* ===== Lists ===== */
.themed-page ul,
.themed-page ol {
  margin-bottom: 1.25rem;
  padding-left: 1.5rem;
}

.themed-page li {
  margin-bottom: 0.5rem;
  color: var(--cat-subtext1);
}

.themed-page ul li::marker {
  color: var(--cat-green);
}

.themed-page ol li::marker {
  color: var(--cat-green);
}

/* ===== Code & Pre ===== */
.themed-page code {
  font-family: var(--font-mono);
  font-size: 0.9em;
  background-color: var(--cat-surface0);
  color: var(--cat-mauve);
  padding: 0.2em 0.4em;
  border: 1px solid var(--cat-surface1);
}

.themed-page pre {
  font-family: var(--font-mono);
  font-size: 14px;
  background-color: var(--cat-mantle);
  color: var(--cat-text);
  padding: 1rem;
  margin-bottom: 1.25rem;
  border: 1px solid var(--cat-surface1);
  overflow-x: auto;
  line-height: 1.6;
}

.themed-page pre code {
  background: none;
  padding: 0;
  border: none;
  color: inherit;
}

/* ===== Blockquotes ===== */
.themed-page blockquote {
  border-left: 3px solid var(--cat-blue);
  background-color: var(--cat-surface0);
  padding: 1rem 1.25rem;
  margin: 1.25rem 0;
  color: var(--cat-subtext1);
}

.themed-page blockquote p:last-child {
  margin-bottom: 0;
}

/* ===== Horizontal Rules ===== */
.themed-page hr {
  border: none;
  border-top: 1px dashed var(--cat-surface1);
  margin: 2rem 0;
}

/* ===== Tables ===== */
.themed-page table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.25rem;
  font-size: 14px;
}

.themed-page thead {
  background-color: var(--cat-crust);
}

.themed-page th {
  text-align: left;
  padding: 0.75rem 1rem;
  font-weight: 600;
  color: var(--cat-text);
  border: 1px solid var(--cat-surface1);
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 0.05em;
}

.themed-page td {
  padding: 0.75rem 1rem;
  border: 1px solid var(--cat-surface1);
  color: var(--cat-subtext0);
}

.themed-page tbody tr:nth-child(odd),
.themed-page tbody tr:nth-child(odd) td {
  background-color: var(--cat-mantle) !important;
}

.themed-page tbody tr:nth-child(even),
.themed-page tbody tr:nth-child(even) td {
  background-color: #232235 !important;
}

/* ===== Slider (Info Slider) ===== */
.themed-page .slider-container {
  background-color: var(--cat-crust) !important;
  border: 1px solid var(--cat-surface1) !important;
  box-shadow: none !important;
}

.themed-page .slider-container .left-arrow,
.themed-page .slider-container .right-arrow {
  background-color: transparent !important;
  color: var(--cat-text) !important;
}

.themed-page .slider-container .slide span,
.themed-page .slider-container blockquote,
.themed-page .slider-container .byline {
  color: var(--cat-text) !important;
}

.themed-page .slider-indicators .slider-dot {
  background-color: var(--cat-overlay0) !important;
}

.themed-page .slider-indicators .slider-dot.active {
  background-color: var(--cat-blue) !important;
}

.themed-page tbody tr:hover {
  background-color: var(--cat-surface0);
}

/* ===== Info Boxes ===== */
.info-box {
  background-color: var(--cat-surface0);
  padding: 1rem 1.25rem;
  margin: 1.25rem 0;
  border-left: 3px solid var(--cat-blue);
  position: relative;
}

.info-box--insight {
  border-left-color: var(--cat-blue);
}

.info-box--thesis {
  border-left-color: var(--cat-yellow);
}

.info-box--warning {
  border-left-color: var(--cat-peach);
}

.info-box--success {
  border-left-color: var(--cat-green);
}

.info-box__label {
  position: absolute;
  top: -0.6em;
  left: 1rem;
  background-color: var(--cat-surface0);
  padding: 0 0.5em;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--cat-overlay1);
}

/* ===== Data/App Entries ===== */
.data-entry {
  border: 1px solid var(--cat-surface1);
  margin-bottom: 1rem;
}

.data-entry__header {
  background-color: var(--cat-crust);
  padding: 0.75rem 1rem;
  font-weight: 600;
  color: var(--cat-text);
  border-bottom: 1px solid var(--cat-surface1);
}

.data-entry__body {
  background-color: var(--cat-surface0);
  padding: 1rem;
}

.data-entry__field {
  display: flex;
  margin-bottom: 0.5rem;
}

.data-entry__field:last-child {
  margin-bottom: 0;
}

.data-entry__label {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--cat-overlay0);
  min-width: 120px;
}

.data-entry__value {
  color: var(--cat-subtext0);
}

/* ===== Badges/Tags ===== */
.badge {
  display: inline-block;
  padding: 0.25em 0.75em;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  background-color: var(--cat-blue);
  color: var(--cat-crust);
}

.badge--green { background-color: var(--cat-green); }
.badge--yellow { background-color: var(--cat-yellow); }
.badge--peach { background-color: var(--cat-peach); }
.badge--mauve { background-color: var(--cat-mauve); }
.badge--pink { background-color: var(--cat-pink); }

/* ===== ASCII Decorations ===== */
.ascii-box {
  font-family: var(--font-mono);
  white-space: pre;
  color: var(--cat-overlay1);
  line-height: 1.2;
}

/* ===== Comment-style subtitles ===== */
.comment-subtitle {
  color: var(--cat-overlay0);
  font-style: italic;
  margin-bottom: 1rem;
}

.comment-subtitle::before {
  content: "// ";
}

/* ===== EOF Marker ===== */
.eof-marker {
  text-align: center;
  color: var(--cat-overlay0);
  margin-top: 3rem;
  padding-top: 1rem;
  border-top: 1px dashed var(--cat-surface1);
  font-size: 12px;
  letter-spacing: 0.1em;
}

.eof-marker::before {
  content: "--- EOF ---";
}

/* ===== Images ===== */
.themed-page img {
  max-width: 100%;
  height: auto;
  border: 1px solid var(--cat-surface1);
  margin: 1rem 0;
}

.themed-page figure {
  margin: 1.5rem 0;
}

.themed-page figcaption {
  font-size: 13px;
  color: var(--cat-overlay1);
  margin-top: 0.5rem;
  font-style: italic;
}

/* ===== Utility Classes ===== */
.text-muted { color: var(--cat-overlay0); }
.text-accent { color: var(--cat-blue); }
.text-success { color: var(--cat-green); }
.text-warning { color: var(--cat-yellow); }
.text-danger { color: var(--cat-peach); }

.bg-surface { background-color: var(--cat-surface0); }
.bg-mantle { background-color: var(--cat-mantle); }
.bg-crust { background-color: var(--cat-crust); }

/* ===== Content body override for show-page-body ===== */
.themed-page .show-page-body {
  background: transparent;
  color: var(--cat-text);
}

.themed-page .show-page-body h1,
.themed-page .show-page-body h2,
.themed-page .show-page-body h3,
.themed-page .show-page-body h4,
.themed-page .show-page-body h5,
.themed-page .show-page-body h6 {
  color: var(--cat-blue);
}

.themed-page .show-page-body a {
  color: var(--cat-blue);
}

.themed-page .show-page-body a:hover {
  color: var(--cat-sapphire);
}

/* ===== Responsive ===== */
@media (max-width: 768px) {
  .terminal-chrome {
    margin: 1rem 0.5rem;
  }

  .terminal-body {
    padding: 1rem;
  }

  .themed-page h1 { font-size: 24px; }
  .themed-page h2 { font-size: 20px; }
  .themed-page h3 { font-size: 18px; }
}

/* ===== Social proof avatar alignment fix ===== */
.themed-page .profile-container-desktop {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  padding: 4px 0 !important;
}

.themed-page .profile-container-desktop > a {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 36px !important;
  width: 36px !important;
  height: 36px !important;
  margin-right: -12px !important;
  position: relative !important;
  border-bottom: none !important;
}

.themed-page .profile-container-desktop .profile-avatar-wrapper {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  flex: 0 0 36px !important;
  margin-right: -12px !important;
  position: relative !important;
}

.themed-page .profile-container-desktop > img.profile-avatar {
  flex: 0 0 36px !important;
  margin-right: -12px !important;
}

.themed-page .profile-container-desktop .profile-avatar {
  width: 36px !important;
  height: 36px !important;
  display: block !important;
  margin: 0 !important;
}

@media (max-width: 768px) {
  .themed-page .profile-container-desktop {
    flex-wrap: wrap !important;
    row-gap: 6px !important;
  }
}

/* ===== Post-Meetup Actions Box ===== */
.themed-page .bg-slate-50\/70,
.themed-page [class*="bg-slate-50/70"] {
  background-color: var(--cat-surface0) !important;
  border: 1px solid var(--cat-surface1) !important;
}

/* Buttons inside post-meetup actions box */
.themed-page .bg-slate-50\/70 .tw-button,
.themed-page .bg-slate-50\/70 .tw-button-brand,
.themed-page .bg-slate-50\/70 .tw-button-outline,
.themed-page [class*="bg-slate-50/70"] .tw-button,
.themed-page [class*="bg-slate-50/70"] .tw-button-brand,
.themed-page [class*="bg-slate-50/70"] .tw-button-outline {
  background-color: var(--cat-crust) !important;
  border-color: var(--cat-surface1) !important;
  color: var(--cat-text) !important;
  box-shadow: none !important;
}

.themed-page .bg-slate-50\/70 .tw-button-brand,
.themed-page [class*="bg-slate-50/70"] .tw-button-brand {
  background-color: var(--cat-blue) !important;
  border-color: var(--cat-blue) !important;
  color: var(--cat-crust) !important;
}

.themed-page .bg-slate-50\/70 .tw-button:hover,
.themed-page .bg-slate-50\/70 .tw-button-outline:hover,
.themed-page [class*="bg-slate-50/70"] .tw-button:hover,
.themed-page [class*="bg-slate-50/70"] .tw-button-outline:hover {
  background-color: var(--cat-surface0) !important;
  border-color: var(--cat-blue) !important;
}

.themed-page .bg-slate-50\/70 .tw-button-brand:hover,
.themed-page [class*="bg-slate-50/70"] .tw-button-brand:hover {
  background-color: var(--cat-sapphire) !important;
  border-color: var(--cat-sapphire) !important;
}

/* Icons inside buttons */
.themed-page .bg-slate-50\/70 .tw-button .fa,
.themed-page .bg-slate-50\/70 .tw-button-outline .fa,
.themed-page [class*="bg-slate-50/70"] .tw-button .fa,
.themed-page [class*="bg-slate-50/70"] .tw-button-outline .fa {
  color: var(--cat-subtext1) !important;
}

.themed-page .bg-slate-50\/70 .tw-button-brand .fa,
.themed-page [class*="bg-slate-50/70"] .tw-button-brand .fa {
  color: var(--cat-crust) !important;
}

/* ===== "Ready for more?" Section ===== */
.themed-page section.bg-white,
.themed-page section.rounded-2xl.bg-white {
  background-color: var(--cat-crust) !important;
  border-color: var(--cat-surface1) !important;
  box-shadow: none !important;
}

.themed-page section.bg-white .text-slate-900,
.themed-page section.bg-white h3 {
  color: var(--cat-blue) !important;
}

.themed-page section.bg-white .text-slate-500,
.themed-page section.bg-white p {
  color: var(--cat-subtext1) !important;
}

.themed-page section.bg-white .tw-button-brand {
  background-color: var(--cat-blue) !important;
  border-color: var(--cat-blue) !important;
  color: var(--cat-crust) !important;
}

.themed-page section.bg-white .tw-button-brand:hover {
  background-color: var(--cat-sapphire) !important;
  border-color: var(--cat-sapphire) !important;
}

/* General bg-white override for cards/sections */
.themed-page .rounded-2xl.bg-white,
.themed-page .rounded-3xl.bg-white {
  background-color: var(--cat-crust) !important;
  border-color: var(--cat-surface1) !important;
  box-shadow: none !important;
}

.themed-page .rounded-2xl.bg-white .text-slate-900,
.themed-page .rounded-3xl.bg-white .text-slate-900 {
  color: var(--cat-text) !important;
}

.themed-page .rounded-2xl.bg-white .text-slate-500,
.themed-page .rounded-3xl.bg-white .text-slate-500 {
  color: var(--cat-subtext1) !important;
}

/* ===== Working/Progress Spinner Overlay ===== */
.themed-page #my-spinner {
  background-color: var(--cat-surface0) !important;
  border-color: var(--cat-surface1) !important;
  color: var(--cat-text) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important;
}

.themed-page #my-spinner .fa,
.themed-page #my-spinner i {
  color: var(--cat-blue) !important;
}

.themed-page #my-spinner .show-my-spinner-message {
  color: var(--cat-subtext1) !important;
}

.themed-page #my-spinner svg {
  fill: var(--cat-blue) !important;
}

/* ===== Invites Sent Badge (remove button-like bg) ===== */
.themed-page .page-editor-controls .bg-emerald-50 {
  background-color: transparent !important;
  border-color: transparent !important;
}

/* ===== Event Setup Panel Buttons - single row, no wrap ===== */
.themed-page .page-editor-controls .flex.flex-wrap,
.themed-page .flex.flex-wrap.justify-center.items-center.gap-2,
.themed-page .flex.flex-wrap.items-center.gap-3 {
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  justify-content: flex-start !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

/* Manage/Email Tools/Content Tools dropdown buttons - visible border */
.themed-page details.group > summary,
.themed-page .inline-dropdown button,
.themed-page details > summary.inline-flex,
.themed-page #manageDropdown,
.themed-page #meetupCommunityDropdown,
.themed-page #promoteDropdown,
.themed-page #sponsorsDropdown,
.themed-page .page-editor-controls .inline-dropdown button {
  border: 1px dashed var(--cat-surface1) !important;
  background-color: var(--cat-surface0) !important;
  color: var(--cat-text) !important;
  border-radius: 9999px !important;
  padding: 0.5rem 1rem !important;
}

.themed-page details.group > summary:hover,
.themed-page .inline-dropdown button:hover,
.themed-page details > summary.inline-flex:hover,
.themed-page #manageDropdown:hover,
.themed-page #meetupCommunityDropdown:hover,
.themed-page #promoteDropdown:hover,
.themed-page #sponsorsDropdown:hover,
.themed-page .page-editor-controls .inline-dropdown button:hover {
  border-color: var(--cat-blue) !important;
  background-color: var(--cat-surface1) !important;
}

/* Icons in dropdown buttons */
.themed-page details.group > summary .fa,
.themed-page details.group > summary i,
.themed-page .inline-dropdown button .fa,
.themed-page .inline-dropdown button i,
.themed-page #manageDropdown .fa,
.themed-page #manageDropdown i {
  color: var(--cat-subtext1) !important;
}

/* ===== Event Setup Panel - ALL buttons unified style ===== */
/* Screen RSVPs, Screen Speakers, Email Stats, Send Preview, Compose Custom */
.themed-page .page-editor-controls .tw-button,
.themed-page .page-editor-controls .tw-button-outline,
.themed-page .page-editor-controls .tw-button-secondary,
.themed-page .page-editor-controls .tw-button-low-profile-white,
.themed-page .page-editor-controls button[onclick*="sendTestEmail"],
.themed-page .page-editor-controls a.tw-button-secondary,
.themed-page .page-editor-controls a[href*="screen-rsvps"],
.themed-page .page-editor-controls a[href*="review_speakers"],
.themed-page .page-editor-controls a[href*="email_v2"] {
  background-color: var(--cat-surface0) !important;
  border: 1px dashed var(--cat-surface1) !important;
  color: var(--cat-text) !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
  padding: 0.5rem 1rem !important;
  border-radius: 9999px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
}

.themed-page .page-editor-controls .tw-button:hover,
.themed-page .page-editor-controls .tw-button-outline:hover,
.themed-page .page-editor-controls .tw-button-secondary:hover,
.themed-page .page-editor-controls .tw-button-low-profile-white:hover,
.themed-page .page-editor-controls button[onclick*="sendTestEmail"]:hover,
.themed-page .page-editor-controls a.tw-button-secondary:hover,
.themed-page .page-editor-controls a[href*="screen-rsvps"]:hover,
.themed-page .page-editor-controls a[href*="review_speakers"]:hover,
.themed-page .page-editor-controls a[href*="email_v2"]:hover {
  border-color: var(--cat-blue) !important;
  background-color: var(--cat-surface1) !important;
}

.themed-page .page-editor-controls .tw-button .fa,
.themed-page .page-editor-controls .tw-button i,
.themed-page .page-editor-controls .tw-button-low-profile-white .fa,
.themed-page .page-editor-controls .tw-button-low-profile-white i,
.themed-page .page-editor-controls button[onclick*="sendTestEmail"] .fa,
.themed-page .page-editor-controls button[onclick*="sendTestEmail"] i,
.themed-page .page-editor-controls a[href*="screen-rsvps"] .fa,
.themed-page .page-editor-controls a[href*="review_speakers"] .fa {
  color: var(--cat-subtext1) !important;
}

/* ===== Email Stats Modal - Dark Theme ===== */
.themed-page #email-stats-modal .modal-content {
  background-color: var(--cat-base) !important;
  border: 1px solid var(--cat-surface1) !important;
  color: var(--cat-text) !important;
}

.themed-page #email-stats-modal .modal-header {
  background-color: var(--cat-base) !important;
  border-bottom-color: var(--cat-surface1) !important;
}

.themed-page #email-stats-modal .modal-header .text-lg,
.themed-page #email-stats-modal .modal-header .text-slate-900 {
  color: var(--cat-text) !important;
}

.themed-page #email-stats-modal .modal-header span.inline-flex {
  background-color: var(--cat-surface0) !important;
  color: var(--cat-blue) !important;
}

.themed-page #email-stats-modal .modal-header span.inline-flex .fa {
  color: var(--cat-blue) !important;
}

.themed-page #email-stats-modal .modal-header button {
  color: var(--cat-subtext0) !important;
}

.themed-page #email-stats-modal .modal-header button:hover {
  color: var(--cat-text) !important;
}

.themed-page #email-stats-modal .modal-body {
  background-color: var(--cat-base) !important;
}

.themed-page #email-stats-modal .text-slate-500,
.themed-page #email-stats-modal .text-xs.font-medium {
  color: var(--cat-subtext0) !important;
}

.themed-page #email-stats-modal .text-slate-900,
.themed-page #email-stats-modal .text-base.font-semibold {
  color: var(--cat-text) !important;
}

.themed-page #email-stats-modal .bg-slate-50,
.themed-page #email-stats-modal .rounded-2xl.border {
  background-color: var(--cat-surface0) !important;
  border-color: var(--cat-surface1) !important;
}

.themed-page #email-stats-modal .text-slate-400 {
  color: var(--cat-subtext0) !important;
}

.themed-page #email-stats-modal .modal-footer {
  background-color: var(--cat-base) !important;
  border-top-color: var(--cat-surface1) !important;
}

.themed-page #email-stats-modal .modal-footer .tw-button {
  background-color: var(--cat-surface0) !important;
  border-color: var(--cat-surface1) !important;
  color: var(--cat-text) !important;
}

.themed-page #email-stats-modal .modal-footer .tw-button:hover {
  background-color: var(--cat-surface1) !important;
  border-color: var(--cat-blue) !important;
}

/* Loading dots color */
.themed-page #email-stats-modal .loading-dots span {
  background-color: var(--cat-blue) !important;
}

/* ===== Event Setup Icon - match Event Ended style (dark bg with border) ===== */
.themed-page .page-editor-controls .bg-indigo-100,
.themed-page .page-editor-controls .rounded-full.bg-indigo-100 {
  background-color: var(--cat-surface0) !important;
  border: 2px solid var(--cat-surface1) !important;
  color: var(--cat-subtext1) !important;
}

.themed-page .page-editor-controls .bg-indigo-100 .fa,
.themed-page .page-editor-controls .bg-indigo-100 i,
.themed-page .page-editor-controls .text-indigo-600 {
  color: var(--cat-subtext1) !important;
}

/* ===== Screen RSVPs / Screen Speakers badges - match megamenu style ===== */
.themed-page .page-editor-controls .bg-rose-100,
.themed-page .page-editor-controls .rounded-full.bg-rose-100 {
  background-color: var(--cat-surface1) !important;
  color: var(--cat-subtext1) !important;
}

.themed-page .page-editor-controls .text-rose-700 {
  color: var(--cat-subtext1) !important;
}

/* ===== Support FAB Panel - Dark Theme ===== */
.themed-page #tw-support-fab [data-support-panel] {
  background-color: var(--cat-base) !important;
  border-color: var(--cat-surface1) !important;
}

.themed-page #tw-support-fab [data-support-trigger] {
  background-color: var(--cat-surface0) !important;
  border: 1px solid var(--cat-surface1) !important;
  color: var(--cat-text) !important;
  box-shadow: 0 8px 24px rgba(17, 17, 27, 0.35) !important;
}

.themed-page #tw-support-fab [data-support-trigger]:hover {
  background-color: var(--cat-surface1) !important;
  border-color: var(--cat-blue) !important;
  color: var(--cat-text) !important;
}

.themed-page #tw-support-fab [data-support-trigger] svg,
.themed-page #tw-support-fab [data-support-trigger] i {
  color: var(--cat-blue) !important;
}

.themed-page #tw-support-fab [data-support-trigger] svg path,
.themed-page #tw-support-fab [data-support-trigger] svg circle,
.themed-page #tw-support-fab [data-support-trigger] svg line {
  fill: var(--cat-blue) !important;
  stroke: var(--cat-blue) !important;
}

.themed-page #tw-support-fab [data-support-header] {
  background-color: var(--cat-surface0) !important;
  border-bottom-color: var(--cat-surface1) !important;
}

.themed-page #tw-support-fab [data-support-header] h3 {
  color: var(--cat-blue) !important;
}

.themed-page #tw-support-fab [data-support-header] p {
  color: var(--cat-subtext1) !important;
}

.themed-page #tw-support-fab [data-support-header] button {
  color: var(--cat-subtext0) !important;
}

.themed-page #tw-support-fab [data-support-header] button:hover {
  color: var(--cat-text) !important;
}

.themed-page #tw-support-fab [data-support-form] {
  background-color: var(--cat-base) !important;
}

.themed-page #tw-support-fab [data-support-form] label {
  color: var(--cat-subtext0) !important;
}

.themed-page #tw-support-fab [data-support-form] textarea {
  background-color: var(--cat-surface0) !important;
  border-color: var(--cat-surface1) !important;
  color: var(--cat-text) !important;
}

.themed-page #tw-support-fab [data-support-form] textarea::placeholder {
  color: var(--cat-subtext0) !important;
}

.themed-page #tw-support-fab [data-support-form] textarea:focus {
  border-color: var(--cat-blue) !important;
  box-shadow: 0 0 0 2px rgba(137, 180, 250, 0.2) !important;
}

.themed-page #tw-support-fab [data-support-sent] {
  background-color: var(--cat-base) !important;
}

.themed-page #tw-support-fab [data-support-sent] h4 {
  color: var(--cat-text) !important;
}

.themed-page #tw-support-fab [data-support-sent] p {
  color: var(--cat-subtext1) !important;
}

.themed-page #tw-support-fab [data-support-sent] .bg-indigo-50 {
  background-color: var(--cat-surface0) !important;
  color: var(--cat-blue) !important;
}

/* ===== Alert Bar - Dark Theme ===== */
.themed-page .alert-bar-container {
  background: linear-gradient(135deg, var(--cat-surface0) 0%, #2a2b3d 100%) !important;
  border-bottom: 1px solid var(--cat-surface1) !important;
  box-shadow: 0 6px 18px rgba(17, 17, 27, 0.35), 0 2px 6px rgba(17, 17, 27, 0.2) !important;
}

.themed-page .alert-bar-message .alert-message-text {
  color: var(--cat-text) !important;
  background: none !important;
  -webkit-text-fill-color: var(--cat-text) !important;
  filter: drop-shadow(0 1px 2px rgba(17, 17, 27, 0.35)) !important;
}

.themed-page .alert-bar-message .alert-message-text strong {
  color: var(--cat-blue) !important;
  background: none !important;
  -webkit-text-fill-color: var(--cat-blue) !important;
  filter: drop-shadow(0 1px 2px rgba(137, 180, 250, 0.3)) !important;
}

.themed-page .alert-action-primary {
  background-color: var(--cat-blue) !important;
  border-color: var(--cat-sapphire) !important;
  color: var(--cat-crust) !important;
  box-shadow: 0 4px 12px rgba(137, 180, 250, 0.35) !important;
}

.themed-page .alert-action-primary:hover {
  background-color: var(--cat-sky) !important;
  border-color: var(--cat-blue) !important;
  color: var(--cat-crust) !important;
}

.themed-page .alert-action-dismiss {
  background-color: var(--cat-surface0) !important;
  border-color: var(--cat-surface1) !important;
  color: var(--cat-text) !important;
}

.themed-page .alert-action-dismiss:hover {
  background-color: var(--cat-surface1) !important;
  color: var(--cat-text) !important;
}

.themed-page .alert-bar-close {
  color: var(--cat-subtext0) !important;
}

.themed-page .alert-bar-close:hover {
  background-color: var(--cat-surface0) !important;
  color: var(--cat-text) !important;
}

/* ===== Manage Megamenu - Dark Theme ===== */
.themed-page [id^="manage-mega-menu"] {
  background-color: var(--cat-base) !important;
  border-color: var(--cat-surface1) !important;
}

.themed-page [id^="manage-mega-menu"] .text-slate-700 {
  color: var(--cat-text) !important;
}

.themed-page [id^="manage-mega-menu"] .text-slate-400 {
  color: var(--cat-subtext0) !important;
}

.themed-page [id^="manage-mega-menu"] .text-slate-600 {
  color: var(--cat-subtext1) !important;
}

/* Megamenu hover - dark background so text stays readable */
.themed-page [id^="manage-mega-menu"] a:hover,
.themed-page [id^="manage-mega-menu"] button:hover,
.themed-page [id^="manage-mega-menu"] .hover\:bg-slate-50:hover {
  background-color: var(--cat-surface0) !important;
}

/* Badge styling in megamenu */
.themed-page [id^="manage-mega-menu"] .bg-slate-200 {
  background-color: var(--cat-surface1) !important;
  color: var(--cat-subtext1) !important;
}

/* ===== View All Posts Arrow - darker color ===== */
.themed-page section.bg-white .tw-button-brand .fa,
.themed-page section.bg-white .tw-button-brand i {
  color: var(--cat-crust) !important;
}

/* ===== Subscribe Form - vertical alignment fix ===== */
.themed-page .subscribe-form h3 {
  margin: 0 !important;
  line-height: 1.4 !important;
}

.themed-page .subscribe-form .flex.items-center {
  align-items: center !important;
}

.themed-page .subscribe-form .fa-envelope {
  line-height: 1 !important;
}

/* ===== Header - remove dotted border below ===== */
.themed-page .tw-site-header {
  border-bottom: none !important;
}

/* Logo link - no dashed underline */
.themed-page .tw-site-header .tw-site-logo,
.themed-page .tw-site-header .tw-site-logo:hover,
.themed-page .tw-site-header .tw-site-logo:visited {
  border-bottom: none !important;
  text-decoration: none !important;
}

/* ===== Breadcrumbs - reduce space below ===== */
.themed-page [aria-label="Breadcrumb"] {
  margin-bottom: 0.5rem !important;
  padding-bottom: 0 !important;
}

/* ===== Tools Menu - submenu triggers should have light text ===== */
.themed-page .tw-nav-menu-panel .text-slate-700,
.themed-page .tw-nav-menu-panel button span,
.themed-page .tw-nav-menu-panel button,
.themed-page .tw-hover-menu-panel .text-slate-700,
.themed-page .sponsorship-submenu button,
.themed-page .admin-tools-submenu button {
  color: var(--cat-text) !important;
}

.themed-page .tw-nav-menu-panel .text-slate-400,
.themed-page .tw-nav-menu-panel button .fa,
.themed-page .tw-nav-menu-panel button i {
  color: var(--cat-subtext0) !important;
}

/* Submenu panels - dark background */
.themed-page .sponsorship-submenu-panel,
.themed-page .admin-tools-submenu-panel {
  background-color: var(--cat-base) !important;
  border-color: var(--cat-surface1) !important;
}

.themed-page .sponsorship-submenu-panel a,
.themed-page .admin-tools-submenu-panel a,
.themed-page .sponsorship-submenu-panel .text-slate-600,
.themed-page .sponsorship-submenu-panel .text-slate-700,
.themed-page .admin-tools-submenu-panel .text-slate-600,
.themed-page .admin-tools-submenu-panel .text-slate-700 {
  color: var(--cat-text) !important;
}

.themed-page .admin-tools-submenu-panel .text-slate-500,
.themed-page .admin-tools-submenu-panel .text-xs {
  color: var(--cat-subtext0) !important;
}

/* ===== Tools/Programs Dropdown Menu - dark text on hover ===== */
.themed-page .tw-site-header details[open] a:hover,
.themed-page .tw-site-header details[open] a:hover .fa,
.themed-page .tw-site-header details[open] a:hover i,
.themed-page .tw-site-header .dropdown-menu a:hover,
.themed-page .tw-site-header .dropdown-menu a:hover .fa,
.themed-page .tw-site-header .dropdown-menu a:hover i,
.themed-page .tw-site-header [role="menu"] a:hover,
.themed-page .tw-site-header [role="menu"] a:hover .fa,
.themed-page .tw-site-header [role="menu"] a:hover i,
.themed-page nav a:hover,
.themed-page nav button:hover {
  color: var(--cat-crust) !important;
  background-color: var(--cat-blue) !important;
}

.themed-page nav a:hover .fa,
.themed-page nav a:hover i,
.themed-page nav button:hover .fa,
.themed-page nav button:hover i {
  color: var(--cat-crust) !important;
}

/* ===== Cities Megamenu - selected city (dark bg instead of light) ===== */
.themed-page a.tw-featured-city[class*="fcf2e9"],
.themed-page a.tw-featured-city.bg-\[\#fcf2e9\],
.themed-page details[open] a.tw-featured-city[class*="fcf2e9"],
.themed-page .bg-amber-50,
.themed-page .bg-\[\#fcf2e9\],
.themed-page [style*="fcf2e9"],
body.themed-page a.tw-featured-city[class*="fcf2e9"] {
  background-color: var(--cat-surface0) !important;
  border-color: var(--cat-blue) !important;
}

.themed-page a.tw-featured-city[class*="fcf2e9"] .font-semibold,
.themed-page a.tw-featured-city[class*="fcf2e9"] .text-slate-900,
.themed-page details[open] a.tw-featured-city[class*="fcf2e9"] .font-semibold {
  color: var(--cat-blue) !important;
}

/* ===== Cities Megamenu - hover state (dark bg instead of light blue) ===== */
.themed-page a.tw-featured-city:hover,
.themed-page details[open] a.tw-featured-city:hover,
.themed-page .tw-site-header details[open] a.tw-featured-city:hover,
body.themed-page a.tw-featured-city:hover {
  background-color: var(--cat-surface1) !important;
  border-color: var(--cat-blue) !important;
}

.themed-page a.tw-featured-city:hover .font-semibold,
.themed-page a.tw-featured-city:hover .text-slate-900,
.themed-page details[open] a.tw-featured-city:hover .font-semibold {
  color: var(--cat-blue) !important;
}

/* City card text colors */
.themed-page a.tw-featured-city .font-semibold,
.themed-page a.tw-featured-city .text-slate-900,
.themed-page details[open] a.tw-featured-city .font-semibold {
  color: var(--cat-text) !important;
}

.themed-page a.tw-featured-city .text-slate-500,
.themed-page a.tw-featured-city .text-xs,
.themed-page details[open] a.tw-featured-city .text-slate-500 {
  color: var(--cat-subtext1) !important;
}

/* City icon styling */
.themed-page a.tw-featured-city .featured-city-icon div,
.themed-page a.tw-featured-city .bg-slate-100,
.themed-page details[open] a.tw-featured-city .bg-slate-100 {
  background-color: var(--cat-surface0) !important;
  border: 1px solid var(--cat-surface1) !important;
}

/* ===== SweetAlert2 Modals ===== */
body.theme-terminal-catppuccin .swal2-popup,
.themed-page.theme-terminal-catppuccin .swal2-popup {
  font-family: var(--font-mono) !important;
  background-color: var(--cat-crust) !important;
  border: 1px solid var(--cat-surface1) !important;
  color: var(--cat-subtext1) !important;
}

body.theme-terminal-catppuccin .swal2-popup strong,
body.theme-terminal-catppuccin .swal2-popup b,
body.theme-terminal-catppuccin .swal2-html-container strong,
body.theme-terminal-catppuccin .swal2-html-container b,
.themed-page.theme-terminal-catppuccin .swal2-popup strong,
.themed-page.theme-terminal-catppuccin .swal2-popup b,
.themed-page.theme-terminal-catppuccin .swal2-html-container strong,
.themed-page.theme-terminal-catppuccin .swal2-html-container b {
  color: inherit !important;
}

body.theme-terminal-catppuccin .swal2-html-container,
.themed-page.theme-terminal-catppuccin .swal2-html-container {
  color: var(--cat-subtext1) !important;
}

body.theme-terminal-catppuccin .swal2-title,
.themed-page.theme-terminal-catppuccin .swal2-title {
  color: var(--cat-text) !important;
}

body.theme-terminal-catppuccin .swal2-icon.swal2-error,
.themed-page.theme-terminal-catppuccin .swal2-icon.swal2-error {
  border-color: var(--cat-red) !important;
  color: var(--cat-red) !important;
}

/* ===== Print Styles ===== */
@media print {
  .themed-page {
    background: white;
    color: black;
  }

  .terminal-chrome {
    border: 1px solid #ccc;
  }

  .terminal-header {
    display: none;
  }
}