/* === LERAP BUFFER-ZONE CALCULATOR === */

.lerap-hero {
    padding: calc(var(--header-height) + var(--space-2xl)) 0 var(--space-xl);
    background: var(--color-bg);
}
.lerap-hero h1 { font-family: var(--font-display); font-size: clamp(2rem, 4vw, 3rem); color: var(--color-primary-800); margin-bottom: var(--space-sm); }
.lerap-hero p { font-size: 1.1rem; color: var(--color-text-secondary); max-width: 640px; line-height: 1.6; }
.lerap-back { display: inline-block; font-size: 0.9rem; color: var(--color-primary-500); text-decoration: none; margin-bottom: var(--space-md); font-weight: 500; }
.lerap-back:hover { color: var(--color-primary-600); }

.lerap-form {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-xl);
    margin-bottom: var(--space-lg);
}
.lerap-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--space-lg);
    margin-bottom: var(--space-lg);
}
.lerap-field { display: flex; flex-direction: column; gap: var(--space-xs); }
.lerap-field label { font-size: 0.85rem; font-weight: 600; color: var(--color-text-secondary); text-transform: uppercase; letter-spacing: 0.05em; }
.lerap-field input, .lerap-field select {
    padding: 10px 14px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-family: var(--font-body);
    font-size: 1rem;
    color: var(--color-text);
    background: var(--color-bg);
}
.lerap-field input:focus, .lerap-field select:focus { outline: none; border-color: var(--color-primary-400); }
.lerap-form .btn { padding: 12px 24px; border: none; border-radius: var(--radius-sm); font-weight: 600; cursor: pointer; }
.btn-primary { background: var(--color-primary-500); color: var(--color-text-inverse); }
.btn-primary:hover { background: var(--color-primary-600); }
.btn-outline { background: transparent; color: var(--color-primary-500); border: 1px solid var(--color-primary-400); }
.btn-outline:hover { background: var(--color-primary-50); }

.lerap-result {
    border-radius: var(--radius-md);
    padding: var(--space-xl);
    margin-bottom: var(--space-lg);
    text-align: center;
    background: #C6F6D5; color: #22543D; border: 1px solid #9AE6B4;
}
.lerap-result.fixed { background: #FEFCBF; color: #744210; border-color: #F6E05E; }
.lerap-result .buffer-value { font-size: clamp(2rem, 6vw, 3.5rem); font-weight: 800; font-family: var(--font-display); line-height: 1; }
.lerap-result .buffer-label { font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: var(--space-sm); }
.lerap-result .buffer-reason { font-size: 0.95rem; opacity: 0.9; margin-top: var(--space-sm); }

.lerap-record {
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-xl);
    margin-bottom: var(--space-md);
}
.lerap-record h3 { font-family: var(--font-display); color: var(--color-primary-800); margin-bottom: var(--space-md); }
.lerap-record dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px var(--space-lg); margin: 0; }
.lerap-record dt { font-weight: 600; color: var(--color-text-secondary); }
.lerap-record dd { margin: 0; color: var(--color-text); }

.lerap-actions { display: flex; gap: var(--space-md); margin-bottom: var(--space-xl); flex-wrap: wrap; align-items: center; }
.lerap-save-msg { font-size: 0.88rem; color: var(--color-primary-600); }

.lerap-history-note { font-size: 0.85rem; color: var(--color-text-muted); line-height: 1.6; margin-bottom: var(--space-xl); }
.lerap-history-note a { color: var(--color-primary-500); font-weight: 600; }

.account-records { overflow-x: auto; margin-bottom: var(--space-lg); }
.account-records table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.account-records th, .account-records td { padding: 8px 10px; border-bottom: 1px solid var(--color-border-light); text-align: left; }
.account-records th { background: var(--color-surface); font-size: 0.75rem; text-transform: uppercase; color: var(--color-text-muted); }

.lerap-history { margin-bottom: var(--space-xl); }
.lerap-history h3 { font-family: var(--font-display); font-size: 1.1rem; color: var(--color-primary-800); margin-bottom: var(--space-md); }
.lerap-history table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.lerap-history th, .lerap-history td { padding: 8px 10px; border-bottom: 1px solid var(--color-border-light); text-align: left; }
.lerap-history th { background: var(--color-surface); font-size: 0.75rem; text-transform: uppercase; color: var(--color-text-muted); }

.lerap-disclaimer { font-size: 0.85rem; color: var(--color-text-muted); line-height: 1.6; background: var(--color-bg-alt); padding: var(--space-md); border-radius: var(--radius-sm); }
.lerap-disclaimer a { color: var(--color-primary-500); }

@media (max-width: 600px) {
    .lerap-grid { grid-template-columns: 1fr; }
}

/* Print: show only the record */
@media print {
    body * { visibility: hidden; }
    #lerapRecord, #lerapRecord * { visibility: visible; }
    #lerapRecord { position: absolute; left: 0; top: 0; width: 100%; border: none; padding: 0; }
}