:root {
--ak-bg: #faf9f6;
--ak-card-bg: #ffffff;
--ak-text: #1c1917;
--ak-muted: #66605b;
--ak-border: #1c1917;
--ak-border-subtle: #e7e5e4;
--ak-amber: #f59e0b;
--ak-amber-dark: #d97706;
--ak-amber-light: rgba(245, 158, 11, 0.12);
--ak-amber-border: rgba(217, 119, 6, 0.35);
--ak-shadow: 6px 6px 0px #1c1917;
--ak-font-serif: 'Newsreader', Georgia, 'Times New Roman', serif;
--ak-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
--ak-font-mono: 'JetBrains Mono', Menlo, Monaco, Consolas, monospace;
} html.dark {
--ak-bg: #0e0e10;
--ak-card-bg: #17171a;
--ak-text: #f5f5f4;
--ak-muted: #a8a29e;
--ak-border: #383533;
--ak-border-subtle: #292524;
--ak-amber: #fbbf24;
--ak-amber-dark: #f59e0b;
--ak-amber-light: rgba(251, 191, 36, 0.14);
--ak-amber-border: rgba(245, 158, 11, 0.45);
--ak-shadow: 6px 6px 0px #000000;
}
.ak-bulten-wrap {
font-family: var(--ak-font-sans);
color: var(--ak-text);
box-sizing: border-box;
}
.ak-bulten-wrap *,
.ak-bulten-wrap *::before,
.ak-bulten-wrap *::after {
box-sizing: border-box;
border-radius: 0 !important; } .ak-bulten-form {
display: flex;
flex-direction: column;
gap: 10px;
}
.ak-bulten-input-row {
display: flex;
flex-direction: row;
position: relative;
width: 100%;
} .ak-bulten-input {
flex: 1;
height: 40px;
padding: 0 14px;
font-size: 13.5px;
color: var(--ak-text);
background-color: var(--ak-card-bg);
border: 1px solid var(--ak-border) !important;
border-right: none !important;
outline: none;
font-family: var(--ak-font-sans);
transition: border-color 0.2s ease, background-color 0.2s ease;
}
.ak-bulten-input::placeholder {
color: var(--ak-muted);
font-size: 12.5px;
}
.ak-bulten-input:focus {
border-color: var(--ak-amber-dark) !important;
background-color: var(--ak-card-bg);
box-shadow: inset 0 0 0 1px var(--ak-amber-dark) !important;
} .ak-bulten-submit {
height: 40px;
padding: 0 20px;
background-color: var(--ak-border) !important;
color: #ffffff !important;
border: 1px solid var(--ak-border) !important;
font-size: 11.5px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.12em;
cursor: pointer;
white-space: nowrap;
transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
display: inline-flex;
align-items: center;
justify-content: center;
font-family: var(--ak-font-sans);
} .ak-bulten-submit:hover {
background-color: var(--ak-amber-dark) !important;
border-color: var(--ak-amber-dark) !important;
color: #ffffff !important;
}
.ak-bulten-submit:disabled {
opacity: 0.55;
cursor: not-allowed;
} .ak-bulten-kvkk {
display: flex;
align-items: flex-start;
gap: 8px;
font-size: 11px;
line-height: 1.45;
color: var(--ak-muted);
cursor: pointer;
user-select: none;
margin-top: 2px;
}
.ak-bulten-kvkk input[type="checkbox"] {
appearance: none;
-webkit-appearance: none;
width: 14px;
height: 14px;
min-width: 14px;
margin-top: 1px;
border: 1px solid var(--ak-border) !important;
background-color: var(--ak-card-bg);
cursor: pointer;
position: relative;
outline: none;
transition: all 0.15s ease;
}
.ak-bulten-kvkk input[type="checkbox"]:checked {
background-color: var(--ak-amber-dark);
border-color: var(--ak-amber-dark) !important;
}
.ak-bulten-kvkk input[type="checkbox"]:checked::after {
content: "";
position: absolute;
left: 4px;
top: 1px;
width: 4px;
height: 7px;
border: solid #ffffff;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.ak-bulten-kvkk-text {
flex: 1;
} .ak-bulten-header-inline {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
gap: 8px !important;
margin: 0 0 6px 0 !important;
padding: 0 !important;
flex-wrap: nowrap !important;
}
.ak-bulten-badge {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
font-family: var(--ak-font-mono) !important;
font-size: 11px !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: 0.1em !important;
color: #b45309 !important;
background: #fef3c7 !important;
border: 1px solid #fde68a !important;
padding: 2px 7px !important;
margin: 0 !important;
line-height: 1.3 !important;
white-space: nowrap !important;
flex-shrink: 0 !important;
} .ak-bulten-notice {
display: none;
padding: 8px 12px;
font-size: 12px;
line-height: 1.4;
border: 1px solid var(--ak-border);
margin-top: 4px;
}
.ak-bulten-notice.ak-notice-success {
background-color: var(--ak-amber-light);
border-color: var(--ak-amber-dark);
color: var(--ak-text);
font-weight: 500;
}
.ak-bulten-notice.ak-notice-error {
background-color: #ef4444;
border-color: #b91c1c;
color: #ffffff;
} .ak-hp-field {
display: none !important;
position: absolute !important;
left: -9999px !important;
width: 0 !important;
height: 0 !important;
} .ak-bulten-block {
background-color: var(--ak-card-bg);
border: 1px solid var(--ak-border);
border-left: 5px solid var(--ak-amber-dark) !important;
padding: 14px 18px 14px 18px !important;
margin: 4px 0 16px 0 !important;
box-shadow: 6px 6px 0px var(--ak-border) !important;
position: relative;
}
.ak-bulten-block-header {
margin: 0 0 8px 0 !important;
} .ak-bulten-block-title,
.ak-bulten-modal-title {
font-family: var(--ak-font-mono) !important;
font-size: 12px !important; font-weight: 600 !important; text-transform: uppercase !important;
letter-spacing: 0.1em !important; color: var(--ak-text) !important;
margin: 0 !important;
padding: 0 !important;
line-height: 1.3 !important;
display: inline-flex !important;
align-items: center !important;
width: auto !important;
white-space: nowrap !important;
flex: none !important;
clear: none !important;
}
.ak-bulten-block-desc,
.ak-bulten-modal-desc {
font-family: var(--ak-font-sans) !important;
font-size: 13px !important;
color: #44403c !important;
line-height: 1.5 !important;
margin: 4px 0 10px 0 !important;
}
html.dark .ak-bulten-block-desc,
html.dark .ak-bulten-modal-desc {
color: #a8a29e !important;
} .ak-bulten-modal-overlay {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background-color: rgba(14, 14, 16, 0.65);
backdrop-filter: blur(4px);
z-index: 999999;
display: flex;
align-items: center;
justify-content: center;
padding: 16px;
opacity: 0;
visibility: hidden;
transition: opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.25s ease;
}
.ak-bulten-modal-overlay.ak-active {
opacity: 1;
visibility: visible;
} .ak-bulten-modal {
background-color: var(--ak-card-bg);
border: 1px solid var(--ak-border);
border-left: 5px solid var(--ak-amber-dark) !important;
width: 100%;
max-width: 520px;
padding: 18px 24px 18px 20px !important;
position: relative;
transform: translateY(14px) scale(0.98);
transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
box-shadow: 6px 6px 0px var(--ak-border) !important;
}
.ak-bulten-modal-overlay.ak-active .ak-bulten-modal {
transform: translateY(0) scale(1);
} .ak-bulten-close-btn {
position: absolute;
top: 12px;
right: 12px;
width: 32px;
height: 32px;
background: transparent;
border: 1px solid transparent !important;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
color: var(--ak-muted);
transition: all 0.15s ease;
padding: 0;
}
.ak-bulten-close-btn:hover {
color: var(--ak-text);
background-color: var(--ak-amber-light);
border-color: var(--ak-amber-border) !important;
}
.ak-bulten-close-btn svg {
width: 15px;
height: 15px;
stroke-width: 2.2;
stroke: currentColor;
}
.ak-bulten-modal-header {
margin-bottom: 12px;
padding-right: 28px; }
.ak-bulten-modal-title {
font-family: var(--ak-font-serif);
font-size: 21px;
font-weight: 600;
letter-spacing: -0.015em;
color: var(--ak-text);
line-height: 1.25;
margin: 4px 0 4px 0;
}
.ak-bulten-modal-desc {
font-size: 12.5px;
line-height: 1.45;
color: var(--ak-muted);
margin: 0;
} @media (max-width: 600px) { .ak-bulten-modal-overlay {
align-items: flex-end;
padding: 12px;
}
.ak-bulten-modal {
max-width: 100%;
padding: 20px 18px 18px 18px;
transform: translateY(30px);
box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.18);
border-top: 3px solid var(--ak-amber-dark);
border-left: 1px solid var(--ak-border);
border-right: 1px solid var(--ak-border);
border-bottom: 1px solid var(--ak-border);
max-height: 85vh;
overflow-y: auto;
}
.ak-bulten-modal-overlay.ak-active .ak-bulten-modal {
transform: translateY(0);
}
.ak-bulten-modal-title {
font-size: 18px;
}
.ak-bulten-modal-desc {
font-size: 12px;
} .ak-bulten-input {
font-size: 13px;
height: 38px;
}
.ak-bulten-submit {
font-size: 11px;
height: 38px;
padding: 0 16px;
}
.ak-bulten-block {
padding: 14px 14px 12px 14px !important;
margin: 4px 0 14px 0 !important;
}
.ak-bulten-block-title {
font-size: 11.5px !important;
}
}