/*
 * Alisa's Folio Theme
 * Warm "premium notebook" aesthetic for instructor-led classes and professional training.
 * Creamy ivory background with deep navy text and terracotta accents.
 * Completely self-contained - does not depend on main application styles.
 */

/* ===== Google Fonts Import ===== */
@import url('https://fonts.googleapis.com/css2?family=Bitter:wght@400;500;600;700&family=Source+Sans+3:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

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

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

/* ===== CSS Variables ===== */
:root {
  /* Warm paper palette */
  --ws-background: #FBF7F0;
  --ws-surface: #FFFFFF;
  --ws-page-edge: #F5EEE3;
  --ws-primary-text: #1E293B;
  --ws-secondary-text: #475569;
  --ws-muted-text: #94A3B8;
  --ws-border: #E7DFD3;
  --ws-terracotta: #C2410C;
  --ws-terracotta-hover: #9A3412;
  --ws-teal: #0F766E;
  --ws-teal-light: #14B8A6;
  --ws-highlight: #FEF3C7;
  --ws-success: #0F766E;
  --ws-warning: #B45309;
  --ws-error: #B91C1C;

  /* Typography */
  --ws-font-heading: 'Bitter', Georgia, serif;
  --ws-font-body: 'Source Sans 3', -apple-system, BlinkMacSystemFont, sans-serif;
  --ws-font-mono: 'IBM Plex Mono', 'Fira Code', monospace;
  --ws-font-size-base: 17px;
  --ws-line-height: 1.8;
}

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

/* ===== Rainbow/Gradient Text Override (use terracotta instead) ===== */
.themed-page.theme-alisas-folio .rsvp-title-gradient,
.themed-page.theme-alisas-folio .rainbow-text,
.themed-page.theme-alisas-folio span.rainbow-text,
.themed-page.theme-alisas-folio div.rainbow-text {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: unset !important;
  color: var(--ws-terracotta) !important;
}

.themed-page.theme-alisas-folio .rsvp-title-gradient .event-title__trailing-parens {
  background: none !important;
  -webkit-text-fill-color: unset !important;
  color: var(--ws-secondary-text) !important;
}

/* ===== Global Layout Overrides ===== */
.themed-page.theme-alisas-folio .tw-site-header {
  background-color: var(--ws-surface) !important;
  border-color: var(--ws-border) !important;
}

.themed-page.theme-alisas-folio .tw-site-header,
.themed-page.theme-alisas-folio .tw-site-header a,
.themed-page.theme-alisas-folio .tw-site-header .tw-site-logo-text {
  color: var(--ws-primary-text) !important;
}

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

.themed-page.theme-alisas-folio .tw-site-header .tw-button,
.themed-page.theme-alisas-folio .tw-site-header .tw-button-outline {
  background-color: var(--ws-surface) !important;
  border-color: var(--ws-border) !important;
  color: var(--ws-primary-text) !important;
}

.themed-page.theme-alisas-folio .tw-site-header .tw-button:hover {
  border-color: var(--ws-terracotta) !important;
}

.themed-page.theme-alisas-folio footer {
  background-color: var(--ws-page-edge) !important;
  border-color: var(--ws-border) !important;
  color: var(--ws-secondary-text) !important;
}

.themed-page.theme-alisas-folio footer a {
  color: var(--ws-teal) !important;
}

.themed-page.theme-alisas-folio footer a:hover {
  color: var(--ws-terracotta) !important;
}

.themed-page.theme-alisas-folio footer.bg-white {
  background-color: var(--ws-page-edge) !important;
}

/* ===== Content Container ===== */
.themed-page.theme-alisas-folio .themed-content {
  max-width: 900px;
  margin: 0 auto;
  padding: 2rem 1.5rem 4rem;
}

@media (min-width: 768px) {
  .themed-page.theme-alisas-folio .themed-content {
    padding: 3rem 2rem 5rem;
  }
}

/* ===== Typography ===== */
.themed-page.theme-alisas-folio h1,
.themed-page.theme-alisas-folio h2,
.themed-page.theme-alisas-folio h3,
.themed-page.theme-alisas-folio h4,
.themed-page.theme-alisas-folio h5,
.themed-page.theme-alisas-folio h6 {
  font-family: var(--ws-font-heading);
  color: var(--ws-primary-text);
  margin-top: 2.5rem;
  margin-bottom: 1rem;
}

.themed-page.theme-alisas-folio h1 {
  font-size: 2.5rem;
  line-height: 1.2;
  font-weight: 700;
}

.themed-page.theme-alisas-folio h2 {
  font-size: 1.875rem;
  line-height: 1.25;
  font-weight: 600;
}

.themed-page.theme-alisas-folio h3 {
  font-size: 1.5rem;
  line-height: 1.3;
  font-weight: 600;
}

.themed-page.theme-alisas-folio h4 {
  font-size: 1.25rem;
  line-height: 1.35;
  font-weight: 500;
}

.themed-page.theme-alisas-folio h5,
.themed-page.theme-alisas-folio h6 {
  font-size: 1rem;
  line-height: 1.4;
  font-weight: 500;
}

.themed-page.theme-alisas-folio p {
  margin-bottom: 1.5rem;
  color: var(--ws-primary-text);
}

.themed-page.theme-alisas-folio strong,
.themed-page.theme-alisas-folio b {
  font-weight: 600;
}

/* ===== Links ===== */
.themed-page.theme-alisas-folio a {
  color: var(--ws-teal);
  text-decoration: none;
  transition: color 200ms ease;
}

.themed-page.theme-alisas-folio a:hover {
  color: var(--ws-terracotta);
  text-decoration: underline;
}

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

.themed-page.theme-alisas-folio li {
  margin-bottom: 0.625rem;
}

.themed-page.theme-alisas-folio ul li {
  list-style-type: disc;
}

.themed-page.theme-alisas-folio ol li {
  list-style-type: decimal;
}

.themed-page.theme-alisas-folio li::marker {
  color: var(--ws-terracotta);
}

/* Checklist style for "What you'll learn" sections */
.themed-page.theme-alisas-folio .checklist,
.themed-page.theme-alisas-folio ul.learning-objectives {
  list-style: none;
  padding-left: 0;
}

.themed-page.theme-alisas-folio .checklist li,
.themed-page.theme-alisas-folio ul.learning-objectives li {
  position: relative;
  padding-left: 2rem;
}

.themed-page.theme-alisas-folio .checklist li::before,
.themed-page.theme-alisas-folio ul.learning-objectives li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--ws-teal);
  font-weight: 700;
  font-size: 1.125rem;
}

/* ===== Blockquotes ===== */
.themed-page.theme-alisas-folio blockquote {
  border-left: 3px solid var(--ws-terracotta);
  padding: 1.25rem 1.5rem;
  margin: 2rem 0;
  background-color: var(--ws-surface);
  border-radius: 0 8px 8px 0;
  box-shadow: 0 2px 8px rgba(30, 41, 59, 0.06);
}

.themed-page.theme-alisas-folio blockquote p {
  font-style: italic;
  color: var(--ws-secondary-text);
  margin-bottom: 0;
}

/* ===== Code ===== */
.themed-page.theme-alisas-folio code {
  font-family: var(--ws-font-mono);
  font-size: 0.875em;
  background-color: var(--ws-page-edge);
  padding: 0.2em 0.4em;
  border-radius: 4px;
  color: var(--ws-terracotta);
}

.themed-page.theme-alisas-folio pre {
  background-color: var(--ws-primary-text);
  color: #F1F5F9;
  padding: 1.5rem;
  border-radius: 8px;
  overflow-x: auto;
  margin: 2rem 0;
  font-family: var(--ws-font-mono);
  font-size: 0.9375rem;
  line-height: 1.6;
}

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

/* ===== Buttons ===== */
.themed-page.theme-alisas-folio .btn,
.themed-page.theme-alisas-folio button,
.themed-page.theme-alisas-folio input[type="submit"],
.themed-page.theme-alisas-folio input[type="button"] {
  font-family: var(--ws-font-body);
  font-weight: 600;
  font-size: 1rem;
  padding: 0.75rem 1.5rem;
  border-radius: 6px;
  cursor: pointer;
  transition: all 200ms ease;
  border: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

/* Primary button - terracotta */
.themed-page.theme-alisas-folio .btn-primary,
.themed-page.theme-alisas-folio .tw-button {
  background: var(--ws-terracotta);
  color: white !important;
  box-shadow: 0 2px 4px rgba(194, 65, 12, 0.2);
}

.themed-page.theme-alisas-folio .btn-primary:hover,
.themed-page.theme-alisas-folio .tw-button:hover {
  background: var(--ws-terracotta-hover);
  text-decoration: none;
}

/* Secondary button */
.themed-page.theme-alisas-folio .btn-secondary,
.themed-page.theme-alisas-folio .btn-outline,
.themed-page.theme-alisas-folio .tw-button-outline {
  background: var(--ws-surface);
  border: 1px solid var(--ws-border);
  color: var(--ws-primary-text);
}

.themed-page.theme-alisas-folio .btn-secondary:hover,
.themed-page.theme-alisas-folio .btn-outline:hover,
.themed-page.theme-alisas-folio .tw-button-outline:hover {
  background: var(--ws-background);
  border-color: var(--ws-terracotta);
}

/* Tertiary/Link button */
.themed-page.theme-alisas-folio .btn-ghost,
.themed-page.theme-alisas-folio .btn-link {
  background: transparent;
  color: var(--ws-teal);
  padding: 0.5rem 1rem;
}

.themed-page.theme-alisas-folio .btn-ghost:hover,
.themed-page.theme-alisas-folio .btn-link:hover {
  color: var(--ws-terracotta);
  background: var(--ws-highlight);
}

/* Secondary/Outline/Low-profile buttons - ensure visible text */
.themed-page.theme-alisas-folio .tw-button-secondary,
.themed-page.theme-alisas-folio .tw-button-low-profile,
.themed-page.theme-alisas-folio .tw-button-low-profile-white,
.themed-page.theme-alisas-folio .btn-light,
.themed-page.theme-alisas-folio .btn-white {
  background-color: var(--ws-surface) !important;
  border: 1px solid var(--ws-border) !important;
  color: var(--ws-primary-text) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

.themed-page.theme-alisas-folio .tw-button-secondary:hover,
.themed-page.theme-alisas-folio .tw-button-low-profile:hover,
.themed-page.theme-alisas-folio .tw-button-low-profile-white:hover,
.themed-page.theme-alisas-folio .btn-light:hover,
.themed-page.theme-alisas-folio .btn-white:hover {
  background-color: var(--ws-background) !important;
  border-color: var(--ws-terracotta) !important;
  color: var(--ws-terracotta) !important;
}

/* Ensure link-styled buttons have proper text color */
.themed-page.theme-alisas-folio a.tw-button,
.themed-page.theme-alisas-folio a.tw-button-primary {
  color: white !important;
}

.themed-page.theme-alisas-folio a.tw-button-secondary,
.themed-page.theme-alisas-folio a.tw-button-outline,
.themed-page.theme-alisas-folio a.tw-button-low-profile,
.themed-page.theme-alisas-folio a.tw-button-low-profile-white {
  color: var(--ws-primary-text) !important;
}

.themed-page.theme-alisas-folio a.tw-button-secondary:hover,
.themed-page.theme-alisas-folio a.tw-button-outline:hover,
.themed-page.theme-alisas-folio a.tw-button-low-profile:hover,
.themed-page.theme-alisas-folio a.tw-button-low-profile-white:hover {
  color: var(--ws-terracotta) !important;
  text-decoration: none !important;
}

/* Primary buttons need white text - but NOT if they also have outline/secondary classes */
.themed-page.theme-alisas-folio .tw-button:not(.tw-button-outline):not(.tw-button-secondary):not(.tw-button-low-profile):not(.tw-button-low-profile-white),
.themed-page.theme-alisas-folio .tw-button-primary,
.themed-page.theme-alisas-folio a.tw-button:not(.tw-button-outline):not(.tw-button-secondary):not(.tw-button-low-profile):not(.tw-button-low-profile-white),
.themed-page.theme-alisas-folio a.tw-button-primary {
  background: var(--ws-terracotta) !important;
  color: white !important;
}

/* Primary button icons should also be white */
.themed-page.theme-alisas-folio .tw-button:not(.tw-button-outline):not(.tw-button-secondary):not(.tw-button-low-profile):not(.tw-button-low-profile-white) i,
.themed-page.theme-alisas-folio .tw-button:not(.tw-button-outline):not(.tw-button-secondary):not(.tw-button-low-profile):not(.tw-button-low-profile-white) .fa,
.themed-page.theme-alisas-folio .tw-button:not(.tw-button-outline):not(.tw-button-secondary):not(.tw-button-low-profile):not(.tw-button-low-profile-white) svg,
.themed-page.theme-alisas-folio .tw-button-primary i,
.themed-page.theme-alisas-folio .tw-button-primary .fa,
.themed-page.theme-alisas-folio .tw-button-primary svg {
  color: white !important;
}

/* Secondary/outline buttons need dark text */
.themed-page.theme-alisas-folio .tw-button.tw-button-outline,
.themed-page.theme-alisas-folio .tw-button.tw-button-secondary,
.themed-page.theme-alisas-folio .tw-button.tw-button-low-profile,
.themed-page.theme-alisas-folio .tw-button.tw-button-low-profile-white {
  background: var(--ws-surface) !important;
  color: var(--ws-primary-text) !important;
}

.themed-page.theme-alisas-folio .tw-button.tw-button-outline i,
.themed-page.theme-alisas-folio .tw-button.tw-button-outline .fa,
.themed-page.theme-alisas-folio .tw-button.tw-button-secondary i,
.themed-page.theme-alisas-folio .tw-button.tw-button-secondary .fa,
.themed-page.theme-alisas-folio .tw-button.tw-button-low-profile i,
.themed-page.theme-alisas-folio .tw-button.tw-button-low-profile .fa {
  color: var(--ws-secondary-text) !important;
}

/* ===== Contact + Subscribe Cards ===== */
.themed-page.theme-alisas-folio .contact-us-message,
.themed-page.theme-alisas-folio .subscribe-form {
  background-color: var(--ws-surface) !important;
  border: 1px solid var(--ws-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(30, 41, 59, 0.06) !important;
}

.themed-page.theme-alisas-folio .contact-us-message .contact-us-heading,
.themed-page.theme-alisas-folio .subscribe-form h3,
.themed-page.theme-alisas-folio .subscribe-form h4,
.themed-page.theme-alisas-folio .subscribe-form label {
  font-family: var(--ws-font-heading) !important;
  color: var(--ws-primary-text) !important;
}

/* Subscribe heading: align with icon, remove extra margin */
.themed-page.theme-alisas-folio .subscribe-form h3 {
  font-size: 1.375rem !important;
  font-weight: 600 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  line-height: 1.3 !important;
  display: flex !important;
  align-items: center !important;
}

/* Subscribe module: stack header above input+button */
.themed-page.theme-alisas-folio .subscribe-form > div {
  flex-direction: column !important;
  align-items: center !important;
  gap: 1rem !important;
}

.themed-page.theme-alisas-folio .subscribe-form > div > div {
  justify-content: center !important;
}

.themed-page.theme-alisas-folio .contact-us-message .contact-us-subheading,
.themed-page.theme-alisas-folio .subscribe-form p,
.themed-page.theme-alisas-folio .subscribe-form .text-slate-500 {
  color: var(--ws-secondary-text) !important;
}

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

/* Ensure icons align with text in subscribe header */
.themed-page.theme-alisas-folio .subscribe-form h3 i,
.themed-page.theme-alisas-folio .subscribe-form h3 .fa,
.themed-page.theme-alisas-folio .subscribe-form h3 svg {
  display: inline-flex !important;
  align-items: center !important;
  vertical-align: middle !important;
}

/* ===== Cards ===== */
.themed-page.theme-alisas-folio .card,
.themed-page.theme-alisas-folio .panel {
  background: var(--ws-surface);
  border: 1px solid var(--ws-border);
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(30, 41, 59, 0.06);
  padding: 2rem;
  transition: box-shadow 200ms ease;
}

.themed-page.theme-alisas-folio .card:hover {
  box-shadow: 0 4px 16px rgba(30, 41, 59, 0.1);
}

/* Key Concept Card */
.themed-page.theme-alisas-folio .card-key-concept,
.themed-page.theme-alisas-folio .key-concept {
  background: var(--ws-surface);
  border: 1px solid var(--ws-border);
  border-top: 4px solid var(--ws-terracotta);
  border-radius: 8px;
  padding: 1.5rem;
}

.themed-page.theme-alisas-folio .card-key-concept::before,
.themed-page.theme-alisas-folio .key-concept::before {
  content: 'KEY CONCEPT';
  display: block;
  font-family: var(--ws-font-body);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ws-terracotta);
  margin-bottom: 0.75rem;
}

/* ===== Badges / Tags ===== */
.themed-page.theme-alisas-folio .badge,
.themed-page.theme-alisas-folio .tag,
.themed-page.theme-alisas-folio .label {
  display: inline-flex;
  align-items: center;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.3rem 0.75rem;
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.themed-page.theme-alisas-folio .badge-category {
  background: var(--ws-highlight);
  color: #92400E;
}

.themed-page.theme-alisas-folio .badge-level-beginner {
  background: #ECFDF5;
  color: var(--ws-teal);
}

.themed-page.theme-alisas-folio .badge-level-intermediate {
  background: var(--ws-highlight);
  color: #92400E;
}

.themed-page.theme-alisas-folio .badge-level-advanced {
  background: #FEE2E2;
  color: var(--ws-error);
}

.themed-page.theme-alisas-folio .badge-certificate {
  background: var(--ws-surface);
  border: 2px solid var(--ws-terracotta);
  color: var(--ws-terracotta);
}

.themed-page.theme-alisas-folio .badge-status-live {
  background: #ECFDF5;
  color: var(--ws-teal);
}

.themed-page.theme-alisas-folio .badge-status-upcoming {
  background: #EFF6FF;
  color: #1E40AF;
}

/* ===== Forms ===== */
.themed-page.theme-alisas-folio input[type="text"],
.themed-page.theme-alisas-folio input[type="email"],
.themed-page.theme-alisas-folio input[type="password"],
.themed-page.theme-alisas-folio input[type="number"],
.themed-page.theme-alisas-folio input[type="url"],
.themed-page.theme-alisas-folio textarea,
.themed-page.theme-alisas-folio select {
  font-family: var(--ws-font-body);
  font-size: 1rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--ws-border);
  border-radius: 4px;
  background: var(--ws-surface);
  color: var(--ws-primary-text);
  width: 100%;
  transition: border-color 200ms ease, box-shadow 200ms ease;
}

.themed-page.theme-alisas-folio input:focus,
.themed-page.theme-alisas-folio textarea:focus,
.themed-page.theme-alisas-folio select:focus {
  outline: none;
  border-color: var(--ws-terracotta);
  box-shadow: 0 0 0 3px rgba(194, 65, 12, 0.15);
}

.themed-page.theme-alisas-folio input::placeholder,
.themed-page.theme-alisas-folio textarea::placeholder {
  color: var(--ws-muted-text);
}

/* ===== RSVP Form: Icon-prefixed inputs ===== */
/* Preserve left padding so text doesn't overlap the absolutely-positioned icon */
.themed-page.theme-alisas-folio .pl-10,
.themed-page.theme-alisas-folio input.pl-10,
.themed-page.theme-alisas-folio textarea.pl-10,
.themed-page.theme-alisas-folio select.pl-10 {
  padding-left: 2.5rem !important;
}

/* Make the form icons crisp and properly sized */
.themed-page.theme-alisas-folio .pointer-events-none .fa,
.themed-page.theme-alisas-folio .pointer-events-none .fas,
.themed-page.theme-alisas-folio .pointer-events-none .fab,
.themed-page.theme-alisas-folio .pointer-events-none .far {
  font-size: 1rem !important;
  color: var(--ws-muted-text) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Keep rounded-xl on RSVP form inputs */
.themed-page.theme-alisas-folio input.rounded-xl,
.themed-page.theme-alisas-folio textarea.rounded-xl,
.themed-page.theme-alisas-folio select.rounded-xl {
  border-radius: 0.75rem !important;
}

.themed-page.theme-alisas-folio label {
  display: block;
  font-family: var(--ws-font-heading);
  font-weight: 500;
  font-size: 0.9375rem;
  margin-bottom: 0.5rem;
  color: var(--ws-primary-text);
}

/* ===== Tables ===== */
.themed-page.theme-alisas-folio table {
  width: 100%;
  border-collapse: collapse;
  margin: 2rem 0;
}

.themed-page.theme-alisas-folio th,
.themed-page.theme-alisas-folio td {
  padding: 1.25rem 1rem;
  text-align: left;
  border-bottom: 1px solid var(--ws-border);
}

.themed-page.theme-alisas-folio th {
  font-family: var(--ws-font-heading);
  font-weight: 600;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  background: var(--ws-background);
  color: var(--ws-secondary-text);
}

/* ===== Callouts / Info Boxes ===== */
.themed-page.theme-alisas-folio .callout,
.themed-page.theme-alisas-folio .alert,
.themed-page.theme-alisas-folio .notice {
  padding: 1.25rem 1.5rem;
  border-radius: 0 8px 8px 0;
  margin: 2rem 0;
  border-left: 4px solid;
}

.themed-page.theme-alisas-folio .callout-tip {
  background: #ECFDF5;
  border-color: var(--ws-teal);
  color: #065F46;
}

.themed-page.theme-alisas-folio .callout-note,
.themed-page.theme-alisas-folio .alert-info {
  background: var(--ws-highlight);
  border-color: var(--ws-warning);
  color: #78350F;
}

.themed-page.theme-alisas-folio .callout-warning,
.themed-page.theme-alisas-folio .alert-warning {
  background: #FEF3C7;
  border-color: var(--ws-warning);
  color: #78350F;
}

.themed-page.theme-alisas-folio .callout-important,
.themed-page.theme-alisas-folio .callout-error,
.themed-page.theme-alisas-folio .alert-error,
.themed-page.theme-alisas-folio .alert-danger {
  background: #FEE2E2;
  border-color: var(--ws-error);
  color: #7F1D1D;
}

/* ===== Progress Indicator ===== */
.themed-page.theme-alisas-folio .progress-bar,
.themed-page.theme-alisas-folio .progress {
  background: var(--ws-border);
  border-radius: 9999px;
  height: 6px;
  overflow: hidden;
}

.themed-page.theme-alisas-folio .progress-fill,
.themed-page.theme-alisas-folio .progress-bar-fill {
  background: var(--ws-terracotta);
  height: 100%;
  border-radius: 9999px;
  transition: width 300ms ease;
}

.themed-page.theme-alisas-folio .progress-text {
  font-size: 0.875rem;
  color: var(--ws-secondary-text);
  margin-top: 0.5rem;
}

/* ===== Lesson List ===== */
.themed-page.theme-alisas-folio .lesson-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.themed-page.theme-alisas-folio .lesson-section-header {
  font-family: var(--ws-font-heading);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ws-muted-text);
  padding: 1.25rem 0 0.75rem;
  border-bottom: 1px solid var(--ws-border);
}

.themed-page.theme-alisas-folio .lesson-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--ws-border);
  cursor: pointer;
  transition: background 200ms ease;
}

.themed-page.theme-alisas-folio .lesson-item:hover {
  background: var(--ws-page-edge);
}

.themed-page.theme-alisas-folio .lesson-item.current {
  background: var(--ws-highlight);
  border-left: 3px solid var(--ws-terracotta);
  padding-left: calc(1.25rem - 3px);
}

.themed-page.theme-alisas-folio .lesson-item.completed {
  color: var(--ws-muted-text);
}

.themed-page.theme-alisas-folio .lesson-item.completed .lesson-icon {
  color: var(--ws-teal);
}

.themed-page.theme-alisas-folio .lesson-icon {
  width: 20px;
  flex-shrink: 0;
  text-align: center;
  color: var(--ws-muted-text);
}

.themed-page.theme-alisas-folio .lesson-title {
  flex: 1;
  font-weight: 500;
}

.themed-page.theme-alisas-folio .lesson-duration {
  font-size: 0.875rem;
  color: var(--ws-muted-text);
}

/* ===== Instructor Card ===== */
.themed-page.theme-alisas-folio .instructor-card {
  display: flex;
  gap: 1.25rem;
  padding: 1.5rem;
  background: var(--ws-background);
  border-radius: 8px;
  border: 1px solid var(--ws-border);
}

.themed-page.theme-alisas-folio .instructor-avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--ws-surface);
  box-shadow: 0 2px 8px rgba(30, 41, 59, 0.1);
}

.themed-page.theme-alisas-folio .instructor-info {
  flex: 1;
}

.themed-page.theme-alisas-folio .instructor-name {
  font-family: var(--ws-font-heading);
  font-weight: 600;
  font-size: 1.25rem;
  color: var(--ws-primary-text);
  margin-bottom: 0.25rem;
}

.themed-page.theme-alisas-folio .instructor-title {
  font-size: 0.9375rem;
  color: var(--ws-secondary-text);
  margin-bottom: 0.75rem;
}

.themed-page.theme-alisas-folio .instructor-bio {
  font-size: 0.9375rem;
  color: var(--ws-muted-text);
  line-height: 1.6;
}

/* ===== Images ===== */
.themed-page.theme-alisas-folio img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

.themed-page.theme-alisas-folio figure {
  margin: 2rem 0;
}

.themed-page.theme-alisas-folio figcaption {
  font-size: 0.875rem;
  color: var(--ws-muted-text);
  text-align: center;
  margin-top: 0.75rem;
  font-style: italic;
}

/* ===== Video Container ===== */
.themed-page.theme-alisas-folio .video-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  border-radius: 8px;
  background: var(--ws-primary-text);
  box-shadow: 0 4px 16px rgba(30, 41, 59, 0.12);
  margin: 2rem 0;
}

.themed-page.theme-alisas-folio .video-container iframe,
.themed-page.theme-alisas-folio .video-container video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* ===== Horizontal Rules ===== */
.themed-page.theme-alisas-folio hr {
  border: none;
  height: 1px;
  background: var(--ws-border);
  margin: 3rem 0;
}

/* Decorative divider */
.themed-page.theme-alisas-folio hr.decorative {
  background: none;
  text-align: center;
}

.themed-page.theme-alisas-folio hr.decorative::before {
  content: '• • •';
  color: var(--ws-border);
  letter-spacing: 0.5em;
}

/* ===== Responsive adjustments ===== */
@media (max-width: 640px) {
  .themed-page.theme-alisas-folio h1 {
    font-size: 2rem;
  }

  .themed-page.theme-alisas-folio h2 {
    font-size: 1.5rem;
  }

  .themed-page.theme-alisas-folio .instructor-card {
    flex-direction: column;
    text-align: center;
  }

  .themed-page.theme-alisas-folio .instructor-avatar {
    margin: 0 auto;
  }
}

/* ===== RSVP and Event Components ===== */
.themed-page.theme-alisas-folio .rsvp-card,
.themed-page.theme-alisas-folio .event-card {
  background: var(--ws-surface);
  border: 1px solid var(--ws-border);
  border-radius: 8px;
  padding: 2rem;
  box-shadow: 0 2px 8px rgba(30, 41, 59, 0.06);
}

.themed-page.theme-alisas-folio .rsvp-button,
.themed-page.theme-alisas-folio .event-rsvp-btn {
  background: var(--ws-terracotta);
  color: white !important;
  font-weight: 600;
  padding: 0.875rem 2rem;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  transition: background 200ms ease;
  box-shadow: 0 2px 4px rgba(194, 65, 12, 0.2);
}

.themed-page.theme-alisas-folio .rsvp-button:hover,
.themed-page.theme-alisas-folio .event-rsvp-btn:hover {
  background: var(--ws-terracotta-hover);
}

/* ===== Selection ===== */
.themed-page.theme-alisas-folio ::selection {
  background: var(--ws-highlight);
  color: var(--ws-primary-text);
}

/* ===== Chapter Number (decorative) ===== */
.themed-page.theme-alisas-folio .chapter-number {
  font-family: var(--ws-font-heading);
  font-size: 4rem;
  font-weight: 700;
  color: var(--ws-terracotta);
  opacity: 0.3;
  line-height: 1;
}

/* ===== Calendar Icon (date widget) ===== */
.themed-page.theme-alisas-folio .calendar-icon .month {
  background-color: var(--ws-terracotta) !important;
}

/* ===== Support FAB Button ===== */
/* Override the support button to use terracotta and white icon */
.themed-page.theme-alisas-folio #tw-support-fab [data-support-trigger] {
  background: var(--ws-terracotta) !important;
  border-color: var(--ws-terracotta) !important;
  color: white !important;
}

.themed-page.theme-alisas-folio #tw-support-fab [data-support-trigger]:hover {
  background: var(--ws-terracotta-hover) !important;
  border-color: var(--ws-terracotta-hover) !important;
}

.themed-page.theme-alisas-folio #tw-support-fab [data-support-trigger] svg,
.themed-page.theme-alisas-folio #tw-support-fab [data-support-trigger] i {
  color: white !important;
  fill: white !important;
}

/* Support icon (inline SVG) needs stroke/fill override */
.themed-page.theme-alisas-folio #tw-support-fab [data-support-trigger] svg path,
.themed-page.theme-alisas-folio #tw-support-fab [data-support-trigger] svg circle,
.themed-page.theme-alisas-folio #tw-support-fab [data-support-trigger] svg line {
  stroke: white !important;
}

/* ===== Contact Organizers Card ===== */
/* Override the indigo icon circle to use terracotta theme colors */
.themed-page.theme-alisas-folio .contact-us-message .bg-indigo-50 {
  background-color: rgba(194, 65, 12, 0.1) !important;
}

.themed-page.theme-alisas-folio .contact-us-message .text-indigo-600,
.themed-page.theme-alisas-folio .contact-us-message .bg-indigo-50 i {
  color: var(--ws-terracotta) !important;
}

.themed-page.theme-alisas-folio .contact-us-message:hover .bg-indigo-50,
.themed-page.theme-alisas-folio .contact-us-message .group-hover\:bg-indigo-100 {
  background-color: rgba(194, 65, 12, 0.15) !important;
}

/* ===== SweetAlert2 Modals ===== */
body.theme-alisas-folio .swal2-popup,
.themed-page.theme-alisas-folio .swal2-popup {
  font-family: var(--ws-font-body) !important;
  background-color: var(--ws-surface) !important;
  border: 1px solid var(--ws-border) !important;
  color: var(--ws-secondary-text) !important;
}

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

body.theme-alisas-folio .swal2-html-container,
.themed-page.theme-alisas-folio .swal2-html-container {
  color: var(--ws-secondary-text) !important;
}

body.theme-alisas-folio .swal2-title,
.themed-page.theme-alisas-folio .swal2-title {
  color: var(--ws-primary-text) !important;
}