.dabongo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;max-width:900px;margin:20px 0}.dabongo-stat,.dabongo-access-card,.dabongo-access-locked,.dabongo-access-form-card{background:#fff;border:1px solid #dcdcde;border-radius:8px;padding:18px;box-shadow:0 1px 2px rgba(0,0,0,.04);max-width:760px}.dabongo-stat strong{display:block;font-size:28px;line-height:1.1}.dabongo-stat span{display:block;margin-top:6px}.dabongo-version{font-size:14px;font-weight:400;color:#646970}.dabongo-access-locked{border-left:4px solid #dba617;margin:1em 0}.dabongo-access-card ul{list-style:disc;padding-left:22px}.dabongo-access-form-card{margin:1em 0}.dabongo-access-form p{margin:0 0 16px}.dabongo-access-form label{display:block;font-weight:600;margin-bottom:6px}.dabongo-access-form input[type=text],.dabongo-access-form input[type=email],.dabongo-access-form input[type=password]{width:100%;max-width:520px;box-sizing:border-box;padding:10px}.dabongo-password-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.dabongo-password-row input{flex:1;min-width:240px}.dabongo-access-notice{border-left:4px solid #72aee6;background:#fff;padding:10px 14px;margin:1em 0;max-width:760px}.dabongo-access-notice p{margin:0}.dabongo-access-notice-success{border-left-color:#00a32a}.dabongo-access-notice-error{border-left-color:#d63638}.dabongo-access-notice-info{border-left-color:#72aee6}.dabongo-diagnostics-table{margin-top:18px}.dabongo-access-button{text-decoration:none}
.dabongo-access-notice-warning{border-left-color:#dba617}.dabongo-access-upgrade-card{max-width:720px}.dabongo-access-plan-summary{border:1px solid #dcdcde;border-radius:8px;padding:16px;margin:18px 0;background:#f6f7f7}.dabongo-access-plan-summary p{margin:0 0 6px}.dabongo-access-plan-summary p:last-child{margin-bottom:0}.dabongo-access-price{font-size:24px;font-weight:700}.dabongo-access-upgrade-card button[disabled]{cursor:not-allowed;opacity:.65}
.dabongo-access-subscription-summary{border:1px solid #dcdcde;border-radius:8px;padding:14px;margin:16px 0;background:#f6f7f7}.dabongo-access-subscription-summary p{margin:0 0 8px}.dabongo-access-inline-form{display:inline-block;margin:4px 8px 4px 0}: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%; }
}