/**
 * LPK Core - Checkout / Registration Styles
 * Versi 1.6.0
 */

:root {
    --lpk-co-ink: #0e2233;
    --lpk-co-deep: #0f2e2a;
    --lpk-co-gold: #c9a83e;
    --lpk-co-gold-soft: #e0c25a;
    --lpk-co-line: #e4ddd0;
    --lpk-co-muted: #6d7680;
    --lpk-co-sans: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --lpk-co-serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
}

.lpk-checkout-screen {
    min-height: 100vh;
    background:
        radial-gradient(1000px 500px at 85% -10%, rgba(201, 168, 62, 0.10), transparent 60%),
        #f3efe6;
    font-family: var(--lpk-co-sans);
    padding: 40px 20px;
    color: var(--lpk-co-ink);
}

.lpk-checkout-wrap {
    max-width: 760px;
    margin: 0 auto;
}

.lpk-co-head { text-align: center; margin-bottom: 26px; }
.lpk-co-head h1 {
    font-family: var(--lpk-co-serif);
    font-size: 30px;
    margin: 0 0 8px;
    color: var(--lpk-co-ink);
}
.lpk-co-head p { color: var(--lpk-co-muted); margin: 0; font-size: 15px; }

.lpk-co-empty {
    background: #fff; border: 1px solid var(--lpk-co-line);
    border-radius: 14px; padding: 30px; text-align: center; color: var(--lpk-co-muted);
}

/* Toggle siklus */
.lpk-co-cycle {
    display: inline-flex;
    background: #fff;
    border: 1px solid var(--lpk-co-line);
    border-radius: 999px;
    padding: 4px;
    margin: 0 auto 20px;
    gap: 4px;
}
.lpk-checkout-wrap > #lpk-co-form-stage > .lpk-co-cycle { display: flex; width: fit-content; margin-left: auto; margin-right: auto; }
.lpk-co-cycle__btn {
    border: none; background: transparent; cursor: pointer;
    padding: 9px 22px; border-radius: 999px; font-size: 14px; font-weight: 600;
    color: var(--lpk-co-muted); transition: all 160ms ease;
}
.lpk-co-cycle__btn.is-active {
    background: linear-gradient(150deg, var(--lpk-co-gold-soft), var(--lpk-co-gold));
    color: #0f2e2a;
}

/* Kartu paket */
.lpk-co-packages {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 14px;
    margin-bottom: 24px;
}
.lpk-co-pkg {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
    background: #fff;
    border: 2px solid var(--lpk-co-line);
    border-radius: 14px;
    padding: 18px 18px 20px;
    cursor: pointer;
    transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}
.lpk-co-pkg:hover { border-color: var(--lpk-co-gold-soft); transform: translateY(-2px); }
.lpk-co-pkg.is-selected {
    border-color: var(--lpk-co-gold);
    box-shadow: 0 10px 26px -14px rgba(201, 168, 62, 0.8);
}
.lpk-co-pkg input { position: absolute; opacity: 0; pointer-events: none; }
.lpk-co-pkg__name { font-weight: 700; font-size: 16px; }
.lpk-co-pkg__price { font-size: 22px; font-weight: 800; color: var(--lpk-co-deep); }
.lpk-co-pkg__price small { font-size: 12px; font-weight: 600; color: var(--lpk-co-muted); }
.lpk-co-pkg__seats { font-size: 13px; color: var(--lpk-co-muted); }

/* Kartu form */
.lpk-co-card {
    background: #fff;
    border: 1px solid var(--lpk-co-line);
    border-radius: 16px;
    padding: 26px;
    box-shadow: 0 20px 50px -30px rgba(14, 34, 51, 0.4);
}
.lpk-co-card h2 { font-family: var(--lpk-co-serif); font-size: 22px; margin: 0 0 18px; }

.lpk-co-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.lpk-field--full { grid-column: 1 / -1; }
.lpk-field label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.lpk-input {
    width: 100%; box-sizing: border-box; padding: 11px 13px; font-size: 15px;
    background: #fbfaf7; border: 1.5px solid var(--lpk-co-line); border-radius: 10px; outline: none;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}
.lpk-input:focus { border-color: var(--lpk-co-gold); background: #fff; box-shadow: 0 0 0 4px rgba(201, 168, 62, 0.15); }

.lpk-co-submit {
    display: block; width: 100%; margin-top: 20px; padding: 14px; border: none;
    border-radius: 11px; font-size: 15px; font-weight: 700; cursor: pointer;
    color: #0f2e2a; text-align: center; text-decoration: none;
    background: linear-gradient(150deg, var(--lpk-co-gold-soft), var(--lpk-co-gold));
    box-shadow: 0 12px 26px -14px rgba(201, 168, 62, 0.85);
    transition: transform 140ms ease, filter 140ms ease;
}
.lpk-co-submit:hover { transform: translateY(-1px); filter: brightness(1.03); }
.lpk-co-submit:disabled { opacity: 0.7; cursor: default; transform: none; }

.lpk-co-alert {
    padding: 11px 14px; border-radius: 10px; font-size: 14px; margin-bottom: 16px;
    background: #fdeceb; color: #b3261e; border: 1px solid #f4cfcc;
}
.lpk-co-alert--success { background: #eaf7ee; color: #0f7a36; border-color: #c5e8d1; }

/* Panel pembayaran */
.lpk-co-success { text-align: center; margin-bottom: 22px; }
.lpk-co-success .dashicons { font-size: 46px; width: 46px; height: 46px; color: #0f7a36; }
.lpk-co-success h2 { margin: 8px 0 6px; }
.lpk-co-success p { color: var(--lpk-co-muted); font-size: 14px; margin: 0; }

.lpk-co-total {
    display: flex; align-items: center; justify-content: space-between;
    background: #fffdf5; border: 1px dashed var(--lpk-co-gold); border-radius: 12px;
    padding: 16px 20px; margin-bottom: 18px;
}
.lpk-co-total span { color: var(--lpk-co-muted); font-size: 14px; }
.lpk-co-total strong { font-size: 22px; color: var(--lpk-co-deep); }

.lpk-co-banks { display: grid; gap: 10px; margin-bottom: 22px; }
.lpk-co-bank {
    display: flex; flex-direction: column; gap: 2px;
    background: #f6f7f7; border: 1px solid var(--lpk-co-line); border-radius: 10px; padding: 12px 16px;
}
.lpk-co-bank strong { font-size: 15px; }
.lpk-co-bank span { font-size: 16px; letter-spacing: 1px; font-weight: 700; color: var(--lpk-co-deep); }
.lpk-co-bank small { color: var(--lpk-co-muted); }

@media (max-width: 560px) {
    .lpk-co-grid { grid-template-columns: 1fr; }
    .lpk-co-head h1 { font-size: 25px; }
}