/* * MDSTN (Madstone) daisyUI Theme * * This theme applies MDSTN branding to all daisyUI components. * Use with: * * Brand Colors: * - Bedrock Charcoal: #1E1E1E (primary) * - Cipher Green: #18C800 (accent) * - Signal Blue: #4A90E2 (secondary) */ @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700&family=Orbitron:wght@700&display=swap'); [data-theme="madstone"] { /* Primary: Bedrock Charcoal */ --p: 0 0% 12%; /* #1E1E1E in HSL */ --pf: 0 0% 18%; /* primary-focus (lighter) */ --pc: 210 40% 98%; /* primary-content (light text) */ /* Secondary: Signal Blue */ --s: 212 72% 59%; /* #4A90E2 in HSL */ --sf: 212 72% 49%; /* secondary-focus */ --sc: 0 0% 100%; /* secondary-content */ /* Accent: Cipher Green */ --a: 112 100% 39%; /* #18C800 in HSL */ --af: 112 100% 32%; /* accent-focus */ --ac: 0 0% 100%; /* accent-content */ /* Neutral */ --n: 0 0% 12%; /* #1E1E1E */ --nf: 0 0% 18%; /* neutral-focus */ --nc: 210 40% 98%; /* neutral-content */ /* Base (backgrounds) */ --b1: 0 0% 100%; /* base-100: white */ --b2: 210 20% 98%; /* base-200: light gray */ --b3: 210 16% 93%; /* base-300: darker gray */ --bc: 0 0% 12%; /* base-content: dark text */ /* State Colors */ --in: 217 91% 60%; /* info: #2563EB */ --inc: 0 0% 100%; --su: 160 84% 39%; /* success: #059669 */ --suc: 0 0% 100%; --wa: 45 100% 51%; /* warning: #FFC107 */ --wac: 0 0% 12%; --er: 0 65% 51%; /* error: #D32F2F */ --erc: 0 0% 100%; /* Border radius */ --rounded-box: 0.5rem; --rounded-btn: 0.375rem; --rounded-badge: 0.25rem; /* Animation */ --animation-btn: 0.2s; --animation-input: 0.2s; /* Button */ --btn-text-case: none; --btn-focus-scale: 0.98; /* Typography */ font-family: 'JetBrains Mono', 'Menlo', 'Monaco', monospace; } /* Heading overrides - use Orbitron */ [data-theme="madstone"] h1, [data-theme="madstone"] h2, [data-theme="madstone"] h3, [data-theme="madstone"] h4, [data-theme="madstone"] h5, [data-theme="madstone"] h6, [data-theme="madstone"] .heading-1, [data-theme="madstone"] .heading-2, [data-theme="madstone"] .heading-3, [data-theme="madstone"] .heading-4, [data-theme="madstone"] .heading-5, [data-theme="madstone"] .heading-6 { font-family: 'Orbitron', sans-serif; font-weight: 700; } /* Button accent style - Cipher Green */ [data-theme="madstone"] .btn-accent { background-color: #18C800; border-color: #18C800; color: white; } [data-theme="madstone"] .btn-accent:hover { background-color: #15a500; border-color: #15a500; } /* Link hover - Cipher Green */ [data-theme="madstone"] a:hover { color: #18C800; } /* Focus ring - Cipher Green */ [data-theme="madstone"] .btn:focus-visible, [data-theme="madstone"] .input:focus-visible, [data-theme="madstone"] .select:focus-visible, [data-theme="madstone"] .textarea:focus-visible { outline-color: #18C800; box-shadow: 0 0 0 2px rgba(24, 200, 0, 0.2); } /* Navbar - Bedrock background */ [data-theme="madstone"] .navbar { background-color: #1E1E1E; color: #F1F5F9; } /* Footer - Bedrock background */ [data-theme="madstone"] .footer { background-color: #1E1E1E; color: #F1F5F9; } [data-theme="madstone"] .footer-title { color: #18C800; } /* Card styling */ [data-theme="madstone"] .card { border: 1px solid #e5e7eb; } /* Badge accent */ [data-theme="madstone"] .badge-accent { background-color: #18C800; border-color: #18C800; color: white; } /* Progress and loading - Cipher Green */ [data-theme="madstone"] .progress-accent::-webkit-progress-value { background-color: #18C800; } [data-theme="madstone"] .loading { color: #18C800; } /* Toggle accent */ [data-theme="madstone"] .toggle-accent:checked { background-color: #18C800; border-color: #18C800; } /* Checkbox */ [data-theme="madstone"] .checkbox:checked, [data-theme="madstone"] .checkbox[checked] { background-color: #ecf9ff; border-color: #ecf9ff; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%231d232a' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e"); background-size: 100% 100%; background-repeat: no-repeat; background-position: center; } /* Checkbox accent */ [data-theme="madstone"] .checkbox-accent:checked, [data-theme="madstone"] .checkbox-accent[checked] { background-color: #18C800; border-color: #18C800; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e"); background-size: 100% 100%; background-repeat: no-repeat; background-position: center; } /* Radio accent */ [data-theme="madstone"] .radio-accent:checked { background-color: #18C800; border-color: #18C800; } /* Range accent */ [data-theme="madstone"] .range-accent::-webkit-slider-thumb { background-color: #18C800; } /* Steps accent */ [data-theme="madstone"] .steps .step-accent + .step-accent:before, [data-theme="madstone"] .steps .step-accent:after { background-color: #18C800; } /* Tab accent */ [data-theme="madstone"] .tab-active { border-color: #18C800; color: #18C800; } /* Menu hover */ [data-theme="madstone"] .menu li > a:hover, [data-theme="madstone"] .menu li > button:hover { background-color: rgba(24, 200, 0, 0.1); color: #18C800; } /* Dropdown hover */ [data-theme="madstone"] .dropdown-content li > a:hover { background-color: rgba(24, 200, 0, 0.1); }