/* Shared professional controls, independent of the Vite dev server. */
.kb-btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:46px; padding:11px 20px; border:1px solid transparent; border-radius:12px; font:inherit; font-weight:600; line-height:1.4; text-decoration:none; cursor:pointer; transition:background .15s,box-shadow .15s; }
.kb-btn-primary { background:#0060e1; color:#fff; }
.kb-btn-primary:hover { background:#004eb9; }
.kb-btn-secondary { background:#fff; border-color:#cbd5e1; color:#334155; }
.kb-btn-secondary:hover { background:#f1f5f9; }
.kb-btn-danger { background:#b91c1c; color:#fff; }
.kb-btn-danger:hover { background:#991b1b; }
.kb-btn:focus-visible, .kb-confirm button:focus-visible { outline:3px solid #93c5fd; outline-offset:3px; }
.kb-btn:disabled, .kb-btn[aria-disabled=true] { opacity:.6; cursor:wait; }
.kb-confirm { margin:auto; width:calc(100% - 32px); max-width:460px; max-height:90dvh; overflow:auto; border:1px solid #e2e8f0; border-radius:22px; padding:0; background:#fff; color:#0f172a; box-shadow:0 24px 80px #0f172a38; }
.kb-confirm::backdrop, dialog::backdrop { background:rgb(15 23 42 / .55); backdrop-filter:blur(3px); }
.kb-confirm-content { padding:28px; }
.kb-confirm-icon { display:grid; place-items:center; width:44px; height:44px; border-radius:14px; background:#fff5d6; color:#8a6200; font-size:22px; font-weight:700; margin-bottom:18px; }
.kb-confirm h2 { font-size:22px; font-weight:700; line-height:1.35; margin:0 0 12px; }
.kb-confirm p { color:#526176; font-size:15px; line-height:1.7; margin:0; white-space:pre-line; }
.kb-confirm-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:26px; }
.kb-confirm .kb-btn { width:auto; }
.kb-payment-actions { display:flex; flex-wrap:wrap; gap:12px; margin:20px 0; }
.kb-payment-actions form { margin:0; }
.kb-payment-summary { display:flex; justify-content:space-between; gap:20px; align-items:center; border-block:1px solid #e2e8f0; padding:20px 0; margin:20px 0; }
.kb-payment-summary strong { font-size:28px; color:#0f172a; }
.kb-caption { font-size:14px; color:#64748b; line-height:1.7; }
@media(max-width:520px) { .kb-confirm-content { padding:24px; } .kb-confirm-actions { flex-direction:column-reverse; } .kb-confirm .kb-btn,.kb-payment-actions form,.kb-payment-actions .kb-btn { width:100%; } .kb-payment-summary { align-items:flex-start; flex-direction:column; gap:6px; } }
@media(prefers-reduced-motion:reduce) { .kb-btn { transition:none; } }
/* Consistent readability and focus for existing custom confirmation dialogs. */
[role="dialog"] button:focus-visible, dialog button:focus-visible { outline:3px solid #93c5fd; outline-offset:3px; }
[role="dialog"] { overscroll-behavior:contain; }

.kb-welcome #beranda .kb-btn-secondary { background:transparent; color:#0056c7; border-color:#cbd5e1; box-shadow:none; }
.kb-welcome #kontak a { font-weight:600; }
.kb-welcome :is(a,button,summary):focus-visible { outline:3px solid #93c5fd; outline-offset:4px; }