/* Devrook client area: Group Style (dark ground, warm paper, one accent). Loaded after the template's own styles. */
@font-face { font-family: "Domine"; src: url(fonts/domine-latin.woff2) format("woff2"); font-weight: 400 700; font-display: swap; }
@font-face { font-family: "Atkinson Hyperlegible Next"; src: url(fonts/atkinson-hyperlegible-next-latin.woff2) format("woff2"); font-weight: 200 800; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url(fonts/jetbrains-mono-latin.woff2) format("woff2"); font-weight: 100 800; font-display: swap; }
:root {
  --ink: #0c0b0b; --ink-2: #141212; --ink-3: #1c1919; --rule: #2c2727; --rule-strong: #463e3e;
  --paper: #f5f1ec; --paper-2: #bdb4ac; --paper-3: #948a82;
  --accent: #1062FE; --on-accent: #FFFFFF; --link: #F5F1EC;
  --font-display: "Domine", Georgia, "Times New Roman", serif;
  --font-body: "Atkinson Hyperlegible Next", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Consolas, monospace;
}
html, body { background: var(--ink) !important; color: var(--paper) !important; font-family: var(--font-body); }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .card-header, .navbar-brand { font-family: var(--font-display); font-weight: 700; letter-spacing: -0.01em; color: var(--paper); }
code, pre, kbd, samp, .text-monospace { font-family: var(--font-mono); }
a { color: var(--link); text-decoration-color: var(--accent); text-underline-offset: 3px; }
a:hover { color: var(--paper); text-decoration-color: var(--accent); }
.text-muted, .small, small { color: var(--paper-2) !important; }
hr, .border, .border-top, .border-bottom, .border-left, .border-right { border-color: var(--rule) !important; }
.bg-white, .bg-light, .bg-secondary, .jumbotron, .modal-content, .card, .list-group-item, .dropdown-menu, .popover, .page-link { background-color: var(--ink-2) !important; color: var(--paper) !important; border-color: var(--rule) !important; }
.navbar, .navbar.bg-dark, .navbar.bg-primary, .bg-dark, .bg-primary, footer { background-color: var(--ink-2) !important; border-bottom: 1px solid var(--rule); }
.navbar .nav-link, .navbar-dark .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link { color: var(--paper-2) !important; }
.navbar .nav-link:hover, .navbar .nav-link.active, .navbar .active > .nav-link { color: var(--paper) !important; box-shadow: inset 0 -2px 0 var(--accent); }
.card-header, .card-footer, .modal-header, .modal-footer { background-color: var(--ink-3) !important; border-color: var(--rule) !important; }
.table, .table td, .table th { color: var(--paper) !important; border-color: var(--rule) !important; background: transparent; }
.table thead th { background: var(--ink-3) !important; color: var(--paper-2) !important; font: 600 .75rem/1.4 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.table-striped tbody tr:nth-of-type(odd) { background-color: var(--ink-3) !important; }
.table-hover tbody tr:hover { background-color: var(--ink-3) !important; }
.form-control, .custom-select, .form-control:disabled, .input-group-text { background-color: var(--ink-2) !important; color: var(--paper) !important; border: 1px solid var(--paper-3) !important; border-radius: 4px; min-height: 2.75rem; }
.form-control::placeholder { color: var(--paper-3); }
.form-control:focus, .custom-select:focus, .btn:focus, .btn.focus, .page-link:focus { border-color: var(--accent) !important; box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--accent) 35%, transparent) !important; outline: 0; }
.btn { border-radius: 4px; font-weight: 600; min-height: 2.75rem; }
.btn-primary, .btn-success, .btn-info { background-color: var(--accent) !important; border-color: var(--accent) !important; color: var(--on-accent) !important; }
.btn-primary:hover, .btn-success:hover, .btn-info:hover, .btn-primary:active, .btn-primary:not(:disabled):not(.disabled):active { background-color: var(--accent) !important; border-color: var(--paper) !important; color: var(--on-accent) !important; filter: brightness(.92); }
.btn-secondary, .btn-light, .btn-outline-secondary, .btn-default { background: transparent !important; border: 1px solid var(--paper-3) !important; color: var(--paper) !important; }
.btn-secondary:hover, .btn-light:hover, .btn-outline-secondary:hover { border-color: var(--accent) !important; }
.btn-danger { background: transparent !important; border: 1px solid #ff6b6b !important; color: #ff6b6b !important; }
.nav-tabs { border-color: var(--rule); }
.nav-tabs .nav-link { color: var(--paper-2); border-color: transparent; }
.nav-tabs .nav-link.active, .nav-pills .nav-link.active { background: var(--ink-3) !important; color: var(--paper) !important; border-color: var(--rule) var(--rule) var(--ink-3); box-shadow: inset 0 2px 0 var(--accent); }
.badge-primary, .badge-success, .badge-info { background: var(--accent); color: var(--on-accent); }
.dropdown-item { color: var(--paper) !important; }
.dropdown-item:hover, .dropdown-item:focus { background: var(--ink-3) !important; }
.alert { background: var(--ink-3); color: var(--paper); border: 1px solid var(--rule-strong); border-left: 3px solid var(--accent); }
.page-item.active .page-link { background: var(--accent) !important; border-color: var(--accent) !important; color: var(--on-accent) !important; }
.header { background: var(--ink) !important; }
.title { background: var(--ink-2) !important; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.title h1, .title h2, .title h3 { color: var(--paper); }
.login-brand { margin: 0 0 1rem; }
.login-logo { display: block; height: 48px; width: auto; max-width: 100%; }
.company-footer { color: var(--paper-3); font: 400 .8125rem/1.5 var(--font-mono); }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }