/* Cò Đất: shared primitives. Public and operating surfaces own their layout. */
:root {
  --cd-ink: #183650;
  --cd-ink-deep: #10283d;
  --cd-ink-soft: #eaf1f6;
  --cd-copper: #926b32;
  --cd-gold: #dac098;
  --cd-white: #fff;
  --cd-ground: #f2f5f7;
  --cd-text: #203344;
  --cd-muted: #586b7b;
  --cd-line: #d9e2e8;
  --cd-success: #176248;
  --cd-danger: #a42d35;
  --cd-warning: #8a570c;
  --cd-space-1: .25rem;
  --cd-space-2: .5rem;
  --cd-space-3: .75rem;
  --cd-space-4: 1rem;
  --cd-space-6: 1.5rem;
  --cd-space-8: 2rem;
  --cd-space-12: 3rem;
  --cd-radius: .625rem;
  --cd-radius-sm: .375rem;
  --cd-elevation: 0 8px 28px rgba(16,40,61,.12);
  --cd-font: 'Inter', 'Segoe UI', Arial, sans-serif;
  --cd-heading: 'Montserrat', 'Segoe UI', Arial, sans-serif;
  /* Type roles: keep reading, UI and dense operating surfaces distinct. */
  --cd-type-display: clamp(1.75rem, 3vw, 2.5rem);
  --cd-type-page-title: clamp(1.5rem, 2.5vw, 2rem);
  --cd-type-section-title: 1.375rem;
  --cd-type-card-title: 1.125rem;
  --cd-type-reading: .8125rem;
  --cd-type-reading-leading: 1.8;
  --cd-type-ui: .9375rem;
  --cd-type-admin-body: .875rem;
  --cd-type-admin-title: 1.5rem;
  --cd-type-caption: .8125rem;
  --cd-type-media-caption: .75rem;
  --cd-type-micro: .75rem;
  --cd-type-field: .9375rem;
  --cd-type-admin-field: .875rem;
  --cd-type-content-h1: 1.5rem;
  --cd-type-content-h2: 1.375rem;
  --cd-type-content-h3: 1.25rem;
  --cd-type-content-h4: 1.125rem;
  --cd-type-content-h5: 1rem;
  --cd-type-content-h6: .9375rem;
  --cd-duration: 180ms;
  --cd-container-max: 90rem;
  --cd-reading-container-max: 85rem;
  --cd-gutter: 2rem;
  --cd-content-gap: 2rem;
  --cd-sidebar: 19rem;
  --cd-reading-sidebar: 20rem;
  --primary-color: var(--cd-ink);
  --primary-light: var(--cd-ink-soft);
  --accent-color: var(--cd-copper);
  --secondary-color: var(--cd-ground);
  --text-main: var(--cd-text);
  --text-muted: var(--cd-muted);
  --border-color: var(--cd-line);
  --card-radius: var(--cd-radius);
  --input-radius: var(--cd-radius-sm);
  --bs-primary: var(--cd-ink);
  --bs-primary-rgb: 24,54,80;
  --bs-link-color: var(--cd-ink);
  --bs-link-color-rgb: 24,54,80;
  --bs-link-hover-color: var(--cd-copper);
  --bs-link-hover-color-rgb: 146,107,50;
  --bs-success-rgb: 23,98,72;
  --bs-danger-rgb: 164,45,53;
  --bs-warning-rgb: 138,87,12;
  --bs-body-color: var(--cd-text);
  --bs-secondary-color: var(--cd-muted);
  --bs-border-color: var(--cd-line);
  --bs-border-radius: var(--cd-radius-sm);
  --bs-border-radius-lg: var(--cd-radius);
  --bs-border-radius-xl: var(--cd-radius);
  --bs-border-radius-2xl: var(--cd-radius);
}
@media (max-width: 1199px) {
  :root { --cd-gutter: 1.5rem; --cd-content-gap: 1.5rem; }
}
@media (max-width: 575px) {
  :root { --cd-gutter: 1.125rem; --cd-content-gap: 1.25rem; }
}
::selection { background: var(--cd-gold); color: var(--cd-ink-deep); }
html { scroll-padding-top: 100px; }
body { color: var(--cd-text); font-family: var(--cd-font); }
h1,h2,h3,h4 { text-wrap: balance; }
input,textarea { caret-color: var(--cd-ink); }
a { text-underline-offset: .2em; }
:focus-visible { outline: 3px solid var(--cd-copper); outline-offset: 3px; }
.cd-skip-link { position: fixed; top: -100px; left: 1rem; z-index: 1000000; padding: .75rem 1rem; background: var(--cd-ink); color: #fff; }
.cd-skip-link:focus { top: 1rem; }
.cd-state { padding: 2rem; text-align: center; color: var(--cd-muted); border: 1px dashed var(--cd-line); border-radius: var(--cd-radius); }
.cd-state strong { display: block; color: var(--cd-ink); margin-bottom: .5rem; }
.btn-primary { --bs-btn-bg: var(--cd-ink); --bs-btn-border-color: var(--cd-ink); --bs-btn-hover-bg: var(--cd-ink-deep); --bs-btn-hover-border-color: var(--cd-ink-deep); --bs-btn-active-bg: var(--cd-ink-deep); }
.btn-outline-primary { --bs-btn-color: var(--cd-ink); --bs-btn-border-color: var(--cd-ink); --bs-btn-hover-bg: var(--cd-ink); --bs-btn-hover-border-color: var(--cd-ink); --bs-btn-active-bg: var(--cd-ink); }
.btn:disabled,.btn.disabled { opacity: .6; cursor: not-allowed; }
.btn { display: inline-flex; align-items: center; justify-content: center; text-align: center; line-height: 1.4; }
.btn .bi { flex-shrink: 0; line-height: 1; }
.modal-dialog { margin-inline: auto; }
.modal-dialog:not([class*="modal-fullscreen"]) { max-width: min(var(--bs-modal-width,500px),calc(100% - 2rem)); }
.modal-header { border-bottom: 1px solid var(--cd-line); }
.modal-title { font-size: 1.15rem; }
.modal-content { border: 0; border-radius: var(--cd-radius); box-shadow: var(--cd-elevation); }
.modal-body { overflow-wrap: anywhere; }
.dropdown-menu { --bs-dropdown-border-color: var(--cd-line); --bs-dropdown-link-hover-bg: var(--cd-ink-soft); --bs-dropdown-link-active-bg: var(--cd-ink); --bs-dropdown-border-radius: var(--cd-radius-sm); max-width: calc(100vw - 2rem); }
.dropdown-item { white-space: normal; }
.tooltip { --bs-tooltip-bg: var(--cd-ink-deep); --bs-tooltip-color: #fff; }
.popover { --bs-popover-border-color: var(--cd-line); --bs-popover-border-radius: var(--cd-radius); --bs-popover-header-bg: var(--cd-ink-soft); }
.toast { --bs-toast-bg: #fff; --bs-toast-border-color: var(--cd-line); --bs-toast-border-radius: var(--cd-radius); }
.pagination { --bs-pagination-color: var(--cd-ink); --bs-pagination-active-bg: var(--cd-ink); --bs-pagination-active-border-color: var(--cd-ink); --bs-pagination-focus-box-shadow: 0 0 0 3px var(--cd-ink-soft); }
.accordion { --bs-accordion-btn-focus-box-shadow: 0 0 0 3px var(--cd-ink-soft); --bs-accordion-active-color: var(--cd-ink); --bs-accordion-active-bg: var(--cd-ink-soft); }
.form-check-input:checked { background-color: var(--cd-ink); border-color: var(--cd-ink); }
@media (max-width: 575px) { .dropdown-item,.page-link { min-height: 44px; display: flex; align-items: center; } }
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition: none !important; }
}

@media (max-width: 575px) {
  :root { --cd-type-display: 1.75rem; --cd-type-page-title: 1.5rem; --cd-type-section-title: 1.25rem; --cd-type-admin-title: 1.25rem; --cd-type-field: 1rem; --cd-type-admin-field: 1rem; }
}
/* Authored role classes replace Bootstrap size utilities only on headings. */
.codat-public .cd-type-section { font-size: var(--cd-type-section-title); line-height: 1.4; }
.codat-public .cd-type-card { font-size: var(--cd-type-card-title); line-height: 1.45; }
