/* kbjyotish — the free tools: kundali, chart, milan, panchang, rashifal.
   Inside .kbjy-scope; front.css owns the palette. */

/* --- shared form furniture --- */
.kbjy-form {
    background: var(--kbjy-soft);
    border: 1px solid var(--kbjy-line);
    border-radius: var(--kbjy-radius);
    padding: 20px;
    margin-bottom: 26px;
}
.kbjy-form__grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.kbjy-field { display: flex; flex-direction: column; gap: 4px; }
.kbjy-field label { font-size: 0.85rem; font-weight: 600; color: var(--kbjy-ink); margin: 0; }
.kbjy-field__hint { font-size: 0.8rem; color: var(--kbjy-muted); }
.kbjy-field input[type="text"],
.kbjy-field input[type="date"],
.kbjy-field input[type="time"],
.kbjy-field input[type="email"],
.kbjy-field select {
    border: 1px solid var(--kbjy-field);
    border-radius: 6px;
    padding: 9px 10px;
    font-size: 0.95rem;
    background: #fff;
    color: #3a4a4f;
    width: 100%;
}
.kbjy-field--full { grid-column: 1 / -1; }
.kbjy-check { display: flex; gap: 8px; align-items: flex-start; font-size: 0.9rem; line-height: 1.5; }
.kbjy-check input { margin-top: 3px; }
.kbjy-form__actions { margin-top: 16px; }

.kbjy-errors {
    background: #fdf3f2;
    border: 1px solid #f0c9c4;
    border-radius: var(--kbjy-radius);
    padding: 12px 16px;
    margin-bottom: 18px;
    color: #8a2b20;
    font-size: 0.9rem;
}
.kbjy-errors ul { margin: 6px 0 0; padding-left: 18px; }

/* A caveat is not an error and must not look like one — it qualifies a result
   the reader is otherwise entitled to trust. */
.kbjy-caveat {
    background: #fdf9ec;
    border: 1px solid #ecdca8;
    border-radius: var(--kbjy-radius);
    padding: 12px 16px;
    margin-bottom: 18px;
    font-size: 0.88rem;
    line-height: 1.55;
    color: #6b5a1e;
}

/* --- place autocomplete --- */
.kbjy-place { position: relative; }
.kbjy-place__list {
    position: absolute;
    top: 100%; left: 0; right: 0;
    z-index: 40;
    background: #fff;
    border: 1px solid var(--kbjy-field);
    border-top: none;
    border-radius: 0 0 6px 6px;
    max-height: 260px;
    overflow-y: auto;
    margin: 0; padding: 0; list-style: none;
    display: none;
}
.kbjy-place__list.is-open { display: block; }
.kbjy-place__item { padding: 8px 10px; font-size: 0.9rem; cursor: pointer; }
.kbjy-place__item:hover,
.kbjy-place__item.is-active { background: var(--kbjy-soft); }
.kbjy-place__item small { color: var(--kbjy-muted); }

/* --- the chart diagram --- */
.kbjy-charts { display: grid; gap: 22px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); margin-bottom: 26px; }
.kbjy-chart figure { margin: 0; }
.kbjy-chart figcaption { font-size: 0.85rem; color: var(--kbjy-muted); text-align: center; margin-top: 6px; }
.kbjy-chart svg { width: 100%; height: auto; max-width: 340px; display: block; margin: 0 auto; }
.kbjy-chart__frame { fill: none; stroke: var(--kbjy-ink); stroke-width: 1.5; }
.kbjy-chart__rashi { font-size: 11px; fill: var(--kbjy-muted); }
.kbjy-chart__graha { font-size: 12px; fill: var(--kbjy-ink); font-weight: 600; }

.kbjy-summary { display: grid; grid-template-columns: max-content 1fr; gap: 8px 20px; font-size: 0.95rem; margin: 0 0 24px; }
.kbjy-summary dt { color: var(--kbjy-muted); font-weight: 600; }
.kbjy-summary dd { margin: 0; }

.kbjy-interp { line-height: 1.7; max-width: 68ch; }
.kbjy-interp h3 { font-size: 1rem; font-weight: 600; color: var(--kbjy-ink); margin: 20px 0 6px; text-transform: none; }
.kbjy-interp p { margin: 0 0 12px; }

.kbjy-share { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin: 22px 0; }
.kbjy-share input {
    flex: 1 1 260px;
    border: 1px solid var(--kbjy-field);
    border-radius: 6px;
    padding: 8px 10px;
    font-size: 0.85rem;
    background: #fff;
    color: var(--kbjy-muted);
}

/* --- milan --- */
.kbjy-people { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.kbjy-person { border: 1px solid var(--kbjy-line); border-radius: var(--kbjy-radius); padding: 16px; background: #fff; }
.kbjy-person h3 { font-size: 0.95rem; font-weight: 600; color: var(--kbjy-ink); margin: 0 0 12px; text-transform: none; }

.kbjy-score {
    display: flex; align-items: baseline; gap: 12px;
    border: 1px solid var(--kbjy-line);
    border-radius: var(--kbjy-radius);
    padding: 18px 20px;
    background: var(--kbjy-soft);
    margin-bottom: 20px;
    flex-wrap: wrap;
}
.kbjy-score__value { font-size: 2rem; font-weight: 700; color: var(--kbjy-ink); line-height: 1; }
.kbjy-score__of { font-size: 1rem; color: var(--kbjy-muted); }
.kbjy-score__band { font-size: 1rem; font-weight: 600; color: var(--kbjy-accent-dk); }

.kbjy-koota { width: 100%; border-collapse: collapse; font-size: 0.9rem; margin-bottom: 22px; }
.kbjy-koota th, .kbjy-koota td { text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--kbjy-line); }
.kbjy-koota th { color: var(--kbjy-muted); font-weight: 600; font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.03em; }
.kbjy-koota td.is-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.kbjy-koota tfoot td { font-weight: 700; color: var(--kbjy-ink); border-bottom: none; }
.kbjy-koota__note { font-size: 0.82rem; color: var(--kbjy-muted); }

/* --- panchang --- */
.kbjy-daystrip { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 8px; margin-bottom: 22px; }
.kbjy-daystrip a {
    flex: 0 0 auto;
    border: 1px solid var(--kbjy-line);
    border-radius: 8px;
    padding: 8px 12px;
    text-align: center;
    font-size: 0.82rem;
    color: var(--kbjy-muted);
    line-height: 1.35;
    min-width: 64px;
}
.kbjy-daystrip a.is-current { background: var(--kbjy-ink); border-color: var(--kbjy-ink); color: #fff; }
.kbjy-daystrip strong { display: block; font-size: 1rem; color: inherit; }

.kbjy-panels { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); margin-bottom: 24px; }
.kbjy-panel { border: 1px solid var(--kbjy-line); border-radius: var(--kbjy-radius); padding: 16px; }
.kbjy-panel h3 { font-size: 0.9rem; font-weight: 600; color: var(--kbjy-ink); margin: 0 0 10px; text-transform: none; }
.kbjy-panel dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; font-size: 0.9rem; }
.kbjy-panel dt { color: var(--kbjy-muted); font-weight: 600; }
.kbjy-panel dd { margin: 0; }

/* Inauspicious windows are the single most-read thing on the page. */
.kbjy-window { font-variant-numeric: tabular-nums; }
.kbjy-window--bad { color: #8a2b20; font-weight: 600; }
.kbjy-window--good { color: #4b6b1f; font-weight: 600; }

/* --- rashifal --- */
.kbjy-signs { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.kbjy-sign {
    border: 1px solid var(--kbjy-line);
    border-radius: var(--kbjy-radius);
    padding: 14px;
    text-align: center;
    color: var(--kbjy-muted);
}
.kbjy-sign:hover { border-color: var(--kbjy-accent); }
.kbjy-sign__glyph { font-size: 1.6rem; line-height: 1; display: block; margin-bottom: 6px; color: var(--kbjy-accent-dk); }
.kbjy-sign__name { font-weight: 600; color: var(--kbjy-ink); display: block; }
.kbjy-sign__dates { font-size: 0.78rem; }

.kbjy-periods { display: flex; gap: 8px; margin-bottom: 20px; flex-wrap: wrap; }
.kbjy-periods a {
    border: 1px solid var(--kbjy-line);
    border-radius: 999px;
    padding: 6px 16px;
    font-size: 0.88rem;
    color: var(--kbjy-muted);
}
.kbjy-periods a.is-current { background: var(--kbjy-ink); border-color: var(--kbjy-ink); color: #fff; }

.kbjy-horoscope { line-height: 1.7; max-width: 68ch; }
.kbjy-horoscope__lucky { display: flex; gap: 22px; flex-wrap: wrap; font-size: 0.9rem; color: var(--kbjy-muted); margin-top: 16px; }

@media (max-width: 767px) {
    .kbjy-summary { grid-template-columns: 1fr; gap: 2px 0; }
    .kbjy-summary dd { margin-bottom: 10px; }
    .kbjy-charts { grid-template-columns: 1fr; }
    .kbjy-koota { font-size: 0.85rem; }
    .kbjy-koota th, .kbjy-koota td { padding: 7px 6px; }
}