:root {
  --db-bg: #effdf8;
  --db-bg-soft: #d9faef;
  --db-surface: rgba(255, 255, 255, 0.86);
  --db-surface-strong: #ffffff;
  --db-text: #10231f;
  --db-muted: #5f7770;
  --db-primary: #0f766e;
  --db-primary-dark: #073c35;
  --db-accent: #20c7aa;
  --db-line: #bfe9df;
  --db-ring: rgba(15, 118, 110, 0.18);
  --db-shadow: 0 28px 80px rgba(5, 49, 43, 0.12);
  --db-card-shadow: 0 18px 44px rgba(7, 60, 53, 0.08);
  --db-radius: 18px;
  --db-radius-lg: 24px;
}

body.db-style-deep-focus { --db-bg: #0e1716; --db-bg-soft: #132522; --db-surface: rgba(22, 34, 32, 0.88); --db-surface-strong: #182724; --db-text: #effdf8; --db-muted: #b6ccc5; --db-primary: #45d6bb; --db-primary-dark: #062d28; --db-accent: #a8ffe7; --db-line: rgba(168,255,231,.25); --db-ring: rgba(69,214,187,.24); --db-shadow: 0 28px 80px rgba(0,0,0,.35); --db-card-shadow: 0 18px 44px rgba(0,0,0,.24); }
body.db-style-signal-blue { --db-bg: #eef7ff; --db-bg-soft: #d9ebff; --db-surface: rgba(255,255,255,.9); --db-text: #0e2036; --db-muted: #526b87; --db-primary: #1d62d1; --db-primary-dark: #0d326d; --db-accent: #12b9d6; --db-line: #bdd8f7; --db-ring: rgba(29,98,209,.17); }
body.db-style-creative-coral { --db-bg: #fff7f1; --db-bg-soft: #ffe5d5; --db-surface: rgba(255,255,255,.9); --db-text: #291b16; --db-muted: #82675c; --db-primary: #b64e34; --db-primary-dark: #603025; --db-accent: #ec9f6c; --db-line: #f1cbb9; --db-ring: rgba(182,78,52,.16); }
body.db-style-studio-violet { --db-bg: #f8f4ff; --db-bg-soft: #ece2ff; --db-surface: rgba(255,255,255,.9); --db-text: #20182f; --db-muted: #6c5d82; --db-primary: #7048bd; --db-primary-dark: #392168; --db-accent: #22a6c4; --db-line: #d7c8f6; --db-ring: rgba(112,72,189,.16); }
body.db-style-graphite-gold { --db-bg: #f7f7f2; --db-bg-soft: #e9e7dc; --db-surface: rgba(255,255,255,.9); --db-text: #1d211e; --db-muted: #686d66; --db-primary: #5e6f42; --db-primary-dark: #252d1d; --db-accent: #c89d3c; --db-line: #d8d3bf; --db-ring: rgba(94,111,66,.16); }

body.dabongo-ai-theme {
  background:
    radial-gradient(circle at 12% 8%, var(--db-bg-soft), transparent 34rem),
    linear-gradient(135deg, var(--db-bg) 0%, #fbfffd 48%, var(--db-bg) 100%);
  color: var(--db-text);
  font-feature-settings: "ss01" 1;
}

body.dabongo-ai-theme.db-style-deep-focus {
  background:
    radial-gradient(circle at 20% 8%, rgba(69,214,187,.16), transparent 34rem),
    linear-gradient(135deg, #091211 0%, #0e1716 55%, #16231f 100%);
}

.db-site-header {
  margin: 0 auto;
  width: min(var(--db-layout-wide-width, 85vw), calc(100vw - 32px));
  max-width: var(--db-layout-max-width, 1880px);
  padding: 0 !important;
}

.db-header-inner {
  background:
    linear-gradient(135deg, #073c35 0%, #0f766e 100%);
  border: 1px solid color-mix(in srgb, var(--db-accent) 32%, transparent);
  border-radius: 18px;
  box-shadow: var(--db-shadow);
  min-height: 92px;
  padding: 14px 18px;
}

.db-brand { gap: 16px; }
.db-brand-logo img { background: #fff; border-radius: 14px; box-shadow: 0 12px 30px rgba(0,0,0,.16); display: block; }
.db-brand-copy { color: #fff; gap: 0; }
.db-brand-copy .wp-block-site-title { font-size: 1.25rem; font-weight: 800; line-height: 1.1; margin: 0; }
.db-brand-copy .wp-block-site-title a { color: #fff; }
.db-brand-copy p { color: rgba(255,255,255,.78); font-size: .84rem; font-weight: 700; margin: 2px 0 0; }

.db-static-nav {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.db-static-nav a,
.db-primary-nav .wp-block-navigation-item__content,
.db-footer-nav .wp-block-navigation-item__content {
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  color: #fff;
  font-weight: 750;
  line-height: 1;
  padding: 8px 14px;
  text-decoration: none;
}
.db-static-nav a:hover,
.db-static-nav a:focus,
.db-primary-nav .wp-block-navigation-item__content:hover { background: rgba(255,255,255,.13); color: #fff; text-decoration: none; }

.db-main {
  margin-left: auto;
  margin-right: auto;
  max-width: var(--db-layout-max-width, 1880px);
  padding-bottom: 54px;
  padding-top: 24px;
  width: min(var(--db-layout-wide-width, 85vw), calc(100vw - 32px));
}
.db-page-title { margin-top: 0; }

.db-plugin-owned-front {
  padding-top: 0;
}

.db-plugin-owned-front .dabongo-lms-app-header,
body.dabongo-lms-shortcode-page .dabongo-lms-app-header {
  display: none !important;
}

.db-layout-shell {
  max-width: none !important;
  width: 100%;
}

.db-layout-primary {
  max-width: none !important;
  min-width: 0;
  width: 100%;
}

body.db-has-right-column .db-main {
  margin-left: 16px;
  margin-right: auto;
  width: calc(100vw - 32px);
}

body.db-has-right-column .db-layout-shell {
  align-items: start;
  display: grid;
  gap: var(--db-layout-gap, 24px);
}

.db-right-column {
  background: var(--db-surface);
  border: 1px solid var(--db-line);
  border-radius: var(--db-radius);
  box-shadow: var(--db-card-shadow);
  padding: 16px;
  position: sticky;
  top: calc(var(--wp-admin--admin-bar--height, 0px) + 16px);
}

.db-right-menu {
  display: grid;
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.db-right-menu a {
  border: 1px solid var(--db-line);
  border-radius: 999px;
  color: var(--db-primary);
  display: block;
  font-weight: 800;
  line-height: 1.15;
  padding: 10px 12px;
  text-decoration: none;
}

.db-right-menu a:hover,
.db-right-menu a:focus {
  background: color-mix(in srgb, var(--db-bg-soft) 56%, white);
  color: var(--db-primary-dark);
  text-decoration: none;
}

.db-hero,
.db-card,
.db-lms-shell > .wp-block-post-content,
.db-page > .wp-block-post-content,
.dabongo-lms-public-hero,
.dabongo-lms-course-focus-selector,
.dabongo-lms-course-focus-group,
.dabongo-lms-course-card,
.dabongo-lms-account-card,
.dabongo-lms-login-callout,
.dabongo-lms-empty-state,
.dabongo-access-card,
.dabongo-access-panel,
.dabongo-access-status,
.dabongo-theme-style-picker {
  background: var(--db-surface);
  border: 1px solid var(--db-line);
  border-radius: var(--db-radius);
  box-shadow: var(--db-card-shadow);
}

.db-hero { overflow: hidden; padding: clamp(28px, 5vw, 56px); position: relative; }
.db-hero::before { background: linear-gradient(135deg, color-mix(in srgb, var(--db-accent) 18%, transparent), transparent 58%); content: ""; inset: 0; pointer-events: none; position: absolute; }
.db-hero-grid { display: grid; gap: 32px; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); position: relative; }
.db-kicker,
.dabongo-lms-public-kicker { color: var(--db-primary); font-family: var(--wp--preset--font-family--fira-code); font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.db-hero h1 { font-size: var(--wp--preset--font-size--xx-large); max-width: 760px; }
.db-hero p { color: var(--db-muted); font-size: 1.08rem; max-width: 680px; }
.db-hero-panel { background: var(--db-surface-strong); border: 1px solid var(--db-line); border-radius: var(--db-radius-lg); box-shadow: var(--db-card-shadow); padding: 24px; }
.db-hero-panel p { font-size: .96rem; margin: 0 0 18px; }
.db-hero-logo img { border-radius: 16px; }

.wp-block-button__link,
button,
input[type="submit"],
.dabongo-lms-button,
.dabongo-lms-button-primary,
.dabongo-lms-course-focus-selector .dabongo-lms-button-small {
  background: var(--db-primary) !important;
  border: 1px solid color-mix(in srgb, var(--db-primary) 72%, #fff) !important;
  border-radius: 999px !important;
  box-shadow: 0 14px 28px var(--db-ring);
  color: #fff !important;
  font-weight: 800;
  text-decoration: none !important;
}
.wp-block-button__link:hover,
button:hover,
input[type="submit"]:hover,
.dabongo-lms-button:hover { filter: brightness(.96); transform: translateY(-1px); }

input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
select,
textarea {
  background: rgba(255,255,255,.84);
  border: 1px solid var(--db-line);
  border-radius: 8px;
  color: var(--db-text);
  min-height: 42px;
  padding: 9px 11px;
}
input:focus,
select:focus,
textarea:focus { border-color: var(--db-primary); box-shadow: 0 0 0 3px var(--db-ring); outline: 0; }

.dabongo-lms-branded-page .dabongo-lms-app-shell,
.dabongo-lms-public-dashboard,
.dabongo-lms-student-dashboard,
.dabongo-lms-student-account-dashboard,
.dabongo-lms-login-page,
.dabongo-lms-single-view { max-width: 100%; }

.dabongo-lms-app-header {
  background: linear-gradient(135deg, var(--db-primary-dark), var(--db-primary)) !important;
  border-color: color-mix(in srgb, var(--db-accent) 32%, transparent) !important;
  border-radius: 24px !important;
  box-shadow: var(--db-shadow) !important;
}
.dabongo-lms-app-logo { border-radius: 14px; }
.dabongo-lms-public-hero { background: linear-gradient(135deg, color-mix(in srgb, var(--db-bg-soft) 45%, white), var(--db-surface)); padding: clamp(24px, 4vw, 38px); }
.dabongo-lms-public-hero h2 { font-size: clamp(1.7rem, 3vw, 2.35rem); }
.dabongo-lms-course-focus-selector { padding: 18px !important; }
.dabongo-lms-course-focus-summary { background: linear-gradient(90deg, color-mix(in srgb, var(--db-bg-soft) 72%, white), transparent); }
.dabongo-lms-course-focus-title,
.dabongo-lms-course-card h3 a { color: var(--db-primary); }
.dabongo-lms-course-focus-meta,
.dabongo-lms-course-count,
.dabongo-lms-account-pill,
.dabongo-lms-enrollment-status { border-color: var(--db-line); color: var(--db-primary); }
.dabongo-lms-course-card,
.dabongo-lms-course-focus-group .dabongo-lms-course-grid > * { transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
.dabongo-lms-course-card:hover { border-color: color-mix(in srgb, var(--db-primary) 42%, var(--db-line)); box-shadow: var(--db-card-shadow); transform: translateY(-1px); }

.dabongo-theme-style-picker { align-items: end; display: flex; flex-wrap: wrap; gap: 12px; margin: 18px 0; padding: 16px; }
.dabongo-theme-style-picker label { color: var(--db-muted); display: block; font-size: .86rem; font-weight: 800; }

.db-site-footer { border-top: 1px solid var(--db-line); margin-top: 44px; padding: 24px 0 !important; }
.db-footer-inner { color: var(--db-muted); max-width: min(1120px, calc(100vw - 32px)); }
.db-footer-nav .wp-block-navigation-item__content { border-color: var(--db-line); color: var(--db-muted); }

body.dabongo-lms-branded-page .db-site-header,
body.dabongo-lms-branded-page .db-site-footer {
  display: none !important;
}

body.dabongo-lms-branded-page .db-main {
  max-width: var(--db-layout-max-width, 1880px);
  padding: 0 !important;
}

body.dabongo-lms-branded-page.db-no-right-column .db-main,
body.dabongo-lms-branded-page.db-no-right-column .dabongo-lms-public-dashboard,
body.dabongo-lms-branded-page.db-no-right-column .dabongo-lms-student-dashboard,
body.dabongo-lms-branded-page.db-no-right-column .dabongo-lms-student-account-dashboard,
body.dabongo-lms-branded-page.db-no-right-column .dabongo-lms-login-page,
body.dabongo-lms-branded-page.db-no-right-column .dabongo-lms-single-view {
  margin-left: auto !important;
  margin-right: auto !important;
  width: min(var(--db-layout-wide-width, 85vw), calc(100vw - 32px)) !important;
}

body.dabongo-lms-branded-page.db-has-right-column .dabongo-lms-public-dashboard,
body.dabongo-lms-branded-page.db-has-right-column .dabongo-lms-student-dashboard,
body.dabongo-lms-branded-page.db-has-right-column .dabongo-lms-student-account-dashboard,
body.dabongo-lms-branded-page.db-has-right-column .dabongo-lms-login-page,
body.dabongo-lms-branded-page.db-has-right-column .dabongo-lms-single-view {
  width: 100% !important;
}

@media (max-width: 860px) {
  .db-hero-grid { grid-template-columns: 1fr; }
  .db-brand-copy { display: none; }
  .db-header-inner { align-items: flex-start; border-radius: 20px; }
  .db-primary-nav { width: 100%; }
  body.db-has-right-column .db-main {
    margin-left: auto;
    width: min(var(--db-layout-wide-width, 85vw), calc(100vw - 18px));
  }
  body.db-has-right-column .db-layout-shell {
    display: block;
  }
  .db-right-column {
    margin-top: 18px;
    position: static;
  }
}

@media (max-width: 560px) {
  .db-site-header, .db-main { width: calc(100vw - 18px); }
  .db-header-inner { min-height: auto; padding: 12px; }
  .db-brand-logo img { width: 92px !important; }
  .db-static-nav { justify-content: flex-start; }
  .db-hero, .db-hero-panel { padding: 20px; }
  .dabongo-theme-style-picker { display: block; }
  .dabongo-theme-style-picker select, .dabongo-theme-style-picker button { margin-top: 8px; width: 100%; }
}