/*
    Griha Pravesh calendar pages (year, month, date, calculation method).
    Mobile-first, and built from the site's existing Jyotish palette: deep blue headings, saffron accents,
    warm cream surfaces. Answer first, explanation after.
*/

/*
    The answer comes first. These pages carry the site's shared hero, which is generous for an article and
    too tall for a page whose whole job is to say yes or no: on a phone it pushed the verdict to roughly 590px,
    most of the first screen. The hero and the place strip are compacted here, on the calendar pages only —
    the global header and navigation are untouched.
*/
.gpc-page .tools-page-title.gpc-title {
    margin-bottom: 8px;
    padding-top: 14px;
    padding-bottom: 14px;
}
.gpc-page .gpc-title .tools-kicker { margin-bottom: 4px; }
.gpc-page .gpc-title h1 { margin: 0 0 4px; font-size: 25px; line-height: 1.3; }
.gpc-page .gpc-title p { margin: 0; font-size: 13px; line-height: 1.5; }

@media (max-width: 719px) {
    /* On a phone the first screen belongs to the verdict. The kicker and the standing description of how
       the windows are chosen are both repeated by the answer immediately below, so here the heading alone
       carries the page and the rest starts sooner. */
    .gpc-page .tools-page-title.gpc-title { margin-bottom: 6px; padding-top: 10px; padding-bottom: 10px; }
    .gpc-page .gpc-title .tools-kicker { margin-bottom: 2px; font-size: 10.5px; }
    .gpc-page .gpc-title h1 { font-size: 21px; line-height: 1.28; }
    .gpc-page .gpc-title p { display: none; }
    .gpc-page .panchang-breadcrumb { margin-bottom: 6px; font-size: 12px; }
    .gpc-place { margin-bottom: 10px; padding: 7px 10px; }
}

.gpc-place {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 2px 8px;
    margin: 0 0 12px;
    padding: 8px 11px;
    border: 1px solid #f1e3c2;
    border-radius: 12px;
    background: #fffaf0;
}
.gpc-place__label { color: #8a7648; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.gpc-place strong { color: #1d3769; font-size: 14px; }
.gpc-place__change { grid-column: 3; justify-self: end; color: #c2570a; font-size: 12.5px; font-weight: 700; text-decoration: underline; white-space: nowrap; }
/* The explanation of what the place affects is useful, but not before the answer: it stays on wider screens. */
.gpc-place small { display: none; grid-column: 1 / -1; color: #6d6047; font-size: 12px; line-height: 1.5; }

/* A year that has already ended says so, above its own answer. */
.gpc-past-year {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: baseline;
    gap: 4px 8px;
    margin: 0 0 12px;
    padding: 10px 12px;
    border: 1px solid #f0dcae;
    border-left: 4px solid #c2570a;
    border-radius: 10px;
    background: #fff7ea;
    color: #6d5322;
    font-size: 13px;
    line-height: 1.55;
}
.gpc-past-year a { grid-column: 2; justify-self: start; color: #c2570a; font-weight: 700; text-decoration: underline; }

/* The direct answer, always above the fold. */
.gpc-answer {
    margin: 0 0 16px;
    padding: 14px 15px;
    border: 1px solid #e3ecfb;
    border-left: 5px solid #1d3769;
    border-radius: 12px;
    background: linear-gradient(180deg, #f7faff, #ffffff);
}
.gpc-answer h2 { margin: 0 0 6px; color: #1d3769; font-size: 19px; line-height: 1.4; }
.gpc-answer p { margin: 0; color: #4a5568; font-size: 14px; line-height: 1.65; }
.gpc-answer--yes { border-left-color: #1f8a4c; }
.gpc-answer--no { border-left-color: #c2570a; }
.gpc-answer__verdict { display: block; margin: 0 0 8px; font-size: 22px; font-weight: 800; }
.gpc-answer--yes .gpc-answer__verdict { color: #1f8a4c; }
.gpc-answer--no .gpc-answer__verdict { color: #c2570a; }

.gpc-section { margin: 0 0 22px; }
.gpc-section > h2 { margin: 0 0 4px; color: #1d3769; font-size: 17px; }
.gpc-section > p.gpc-lede { margin: 0 0 12px; color: #6d6047; font-size: 13px; line-height: 1.6; }

/* Month grid on the year page. */
.gpc-months { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.gpc-month {
    display: grid;
    gap: 3px;
    padding: 12px;
    border: 1px solid #ecdfc4;
    border-radius: 12px;
    background: #fffdf8;
    color: inherit;
    text-decoration: none;
}
.gpc-month:hover { border-color: #ea6c0c; }
.gpc-month b { color: #1d3769; font-size: 15px; }
.gpc-month span { color: #1f8a4c; font-size: 13px; font-weight: 700; }
.gpc-month.is-empty span { color: #8a7648; font-weight: 600; }

/* Date tables. */
.gpc-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.gpc-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.gpc-table th, .gpc-table td { padding: 9px 10px; border-bottom: 1px solid #efe6d4; text-align: left; vertical-align: top; }
.gpc-table th { color: #8a7648; font-size: 11.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; white-space: nowrap; }
.gpc-table td a { color: #1d3769; font-weight: 700; text-decoration: none; }
.gpc-table td a:hover { text-decoration: underline; }
.gpc-table .gpc-windows { display: grid; gap: 2px; }
.gpc-table .gpc-windows span { white-space: nowrap; }
.gpc-badge { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 700; }
.gpc-badge--yes { background: #e8f6ed; color: #1f8a4c; }
.gpc-badge--no { background: #fdeee2; color: #c2570a; }

/* Check list on the date page. */
.gpc-checks { display: grid; gap: 0; margin: 0; padding: 0; border: 1px solid #efe6d4; border-radius: 12px; overflow: hidden; }
.gpc-checks div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; padding: 10px 12px; background: #fff; }
.gpc-checks div:nth-child(odd) { background: #fffdf8; }
.gpc-checks dt { color: #4a5568; font-size: 13.5px; }
.gpc-checks dd { margin: 0; color: #1d3769; font-size: 13.5px; font-weight: 700; text-align: right; }
.gpc-checks dd.is-fail { color: #c2570a; }
.gpc-checks dd.is-pass { color: #1f8a4c; }

.gpc-windows-list { display: grid; gap: 8px; }
.gpc-window {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 4px 12px;
    padding: 12px 13px;
    border: 1px solid #dceafb;
    border-radius: 12px;
    background: #f7faff;
}
.gpc-window strong { color: #1d3769; font-size: 16px; }
.gpc-window small { grid-column: 1 / -1; color: #6d6047; font-size: 12.5px; }
.gpc-window em { color: #1f8a4c; font-size: 12.5px; font-style: normal; font-weight: 700; }

.gpc-reasons { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.gpc-reasons li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px; color: #4a5568; font-size: 13px; line-height: 1.55; }
.gpc-reasons b { color: #1d3769; }

.gpc-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 22px; }
.gpc-nav a {
    padding: 11px 13px;
    border: 1px solid #ecdfc4;
    border-radius: 12px;
    background: #fffdf8;
    color: #1d3769;
    font-size: 13.5px;
    font-weight: 700;
    text-decoration: none;
}
.gpc-nav a:last-child { text-align: right; }
.gpc-nav a:hover { border-color: #ea6c0c; }

.gpc-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; }
.gpc-links a {
    padding: 8px 12px;
    border: 1px solid #ecdfc4;
    border-radius: 999px;
    background: #fff;
    color: #1d3769;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}
.gpc-links a:hover { border-color: #ea6c0c; color: #c2570a; }

.gpc-cta {
    display: grid;
    gap: 8px;
    margin: 0 0 22px;
    padding: 16px 15px;
    border: 1px solid #f3dcb6;
    border-radius: 14px;
    background: linear-gradient(180deg, #fff6e6, #fffdf8);
}
.gpc-cta strong { color: #1d3769; font-size: 16px; }
.gpc-cta p { margin: 0; color: #6d6047; font-size: 13px; line-height: 1.6; }
.gpc-cta a {
    justify-self: start;
    padding: 11px 18px;
    border-radius: 10px;
    background: #ea6c0c;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}
.gpc-cta a:hover { background: #c2570a; }

.gpc-prose { color: #4a5568; font-size: 14px; line-height: 1.75; }
.gpc-prose h2 { margin: 22px 0 6px; color: #1d3769; font-size: 17px; }
.gpc-prose h3 { margin: 16px 0 4px; color: #1d3769; font-size: 15px; }
.gpc-prose p, .gpc-prose li { margin: 0 0 8px; }
.gpc-prose ol, .gpc-prose ul { margin: 0 0 12px; padding-left: 20px; }
.gpc-version { display: inline-block; padding: 3px 10px; border-radius: 999px; background: #eef3fc; color: #1d3769; font-size: 12px; font-weight: 700; }

.gpc-faq details { margin: 0 0 8px; padding: 12px 13px; border: 1px solid #efe6d4; border-radius: 12px; background: #fffdf8; }
.gpc-faq summary { color: #1d3769; font-size: 14px; font-weight: 700; cursor: pointer; }
.gpc-faq p { margin: 8px 0 0; color: #4a5568; font-size: 13.5px; line-height: 1.65; }

@media (min-width: 720px) {
    .gpc-months { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .gpc-answer h2 { font-size: 22px; }
    /* There is room for the explanation here, and the answer still sits high on the page. */
    .gpc-place small { display: block; }
    .gpc-page .gpc-title h1 { font-size: 30px; }
    .gpc-page .tools-page-title.gpc-title { padding-top: 18px; padding-bottom: 18px; }
}

@media (min-width: 1024px) {
    .gpc-months { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}