/* =========================================================================
   Sayfaya özgü stiller
   ========================================================================= */

/* --- Ana sayfa kahraman alanı --- */
.hero {
    position: relative;
    padding-block: var(--sp-16) var(--sp-12);
    text-align: center;
    overflow: hidden;
}
.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(60% 80% at 50% 0%, color-mix(in srgb, var(--brand-400) 16%, transparent), transparent 70%),
        radial-gradient(40% 60% at 85% 20%, color-mix(in srgb, var(--accent-400) 10%, transparent), transparent 70%);
    pointer-events: none;
}
.hero > * { position: relative; }

.hero__title {
    font-size: clamp(1.75rem, 1.2rem + 2.4vw, var(--text-3xl));
    letter-spacing: -0.028em;
    margin-bottom: var(--sp-3);
}
.hero__lead {
    color: var(--text-muted);
    font-size: var(--text-lg);
    max-width: 56ch;
    margin: 0 auto var(--sp-8);
}
.hero__search { max-width: 640px; margin: 0 auto; }
.hero__hint {
    margin-top: var(--sp-4);
    font-size: var(--text-sm);
    color: var(--text-subtle);
}
.hero__hint a { color: var(--text-muted); text-decoration: underline; text-underline-offset: 3px; }
.hero__hint a:hover { color: var(--link); }

/* Ana sayfa bölümleri */
.section { margin-top: var(--sp-12); }
.section__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--sp-4);
    margin-bottom: var(--sp-5);
}
.section__title { font-size: var(--text-xl); }
.section__link { font-size: var(--text-sm); font-weight: 550; }

/* --- İlaç detay sayfası --- */
.drug-hero { margin-bottom: var(--sp-6); }
.drug-hero__title {
    font-size: clamp(1.375rem, 1.1rem + 1.2vw, var(--text-2xl));
    margin-bottom: var(--sp-3);
}
.drug-hero__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2) var(--sp-3);
    color: var(--text-muted);
    font-size: var(--text-sm);
}
.drug-hero__meta a { font-weight: 550; }

/* Tanıtım paragrafı: özgün metin + resmî belgeden alıntı */
.drug-intro { margin-top: var(--sp-6); }

.drug-intro__lead {
    font-size: var(--text-md);
    line-height: var(--leading-normal);
    color: var(--text);
}

.drug-intro__quote {
    margin: var(--sp-4) 0 0;
    padding: var(--sp-4) var(--sp-5);
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-left: 3px solid var(--brand-500);
    border-radius: var(--radius);
}
.drug-intro__quote p {
    margin: 0;
    color: var(--text-muted);
    line-height: var(--leading-normal);
}
.drug-intro__quote cite {
    display: block;
    margin-top: var(--sp-3);
    font-size: var(--text-xs);
    font-style: normal;
    color: var(--text-subtle);
}

.drug-section { margin-top: var(--sp-6); }
.drug-section__title {
    font-size: var(--text-lg);
    margin-bottom: var(--sp-4);
    padding-bottom: var(--sp-3);
    border-bottom: 1px solid var(--border);
}

/* Kaynak metinlerin (etken madde özeti) güvenli tipografisi */
.prose { line-height: var(--leading-normal); color: var(--text-muted); }
.prose p { margin-bottom: var(--sp-3); }
.prose p:last-child { margin-bottom: 0; }
.prose strong { color: var(--text); font-weight: 620; }
.prose a { text-decoration: underline; text-underline-offset: 2px; }
.prose br { content: ""; display: block; margin-bottom: var(--sp-1); }

/* Yan menü (detay sayfası) */
.side-menu { display: flex; flex-direction: column; }
.side-menu__item {
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--border);
    color: var(--text-muted);
    font-size: var(--text-sm);
    font-weight: 550;
    transition: background var(--transition), color var(--transition);
}
.side-menu__item:last-child { border-bottom: 0; }
.side-menu__item:hover { background: var(--surface-hover); color: var(--link); }
.side-menu__item.is-active {
    color: var(--brand-700);
    background: var(--brand-50);
    box-shadow: inset 3px 0 0 var(--brand-500);
}
:root[data-theme="dark"] .side-menu__item.is-active {
    color: var(--brand-300);
    background: var(--bg-sunken);
}

/* --- Firma / etken madde dizin sayfaları --- */
.index-list {
    columns: 3 260px;
    column-gap: var(--sp-8);
}
.index-list__item {
    break-inside: avoid;
    padding-block: var(--sp-2);
    border-bottom: 1px solid var(--border);
}
.index-list__item a { color: var(--text-muted); font-size: var(--text-base); }
.index-list__item a:hover { color: var(--link); }
.index-list__count {
    color: var(--text-subtle);
    font-size: var(--text-xs);
    font-variant-numeric: tabular-nums;
    margin-left: var(--sp-2);
}

/* --- ATC dizin --- */
.atc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--sp-3);
}
.atc-item {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-3);
    padding: var(--sp-4);
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    transition: all var(--transition);
}
.atc-item:hover { border-color: var(--brand-300); box-shadow: var(--shadow-sm); }
.atc-item__code {
    width: 34px; height: 34px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--brand-500) 12%, transparent);
    color: var(--brand-700);
    font-weight: 700;
    font-size: var(--text-md);
}
:root[data-theme="dark"] .atc-item__code { color: var(--brand-300); }
.atc-item__name {
    font-weight: 550;
    color: var(--text);
    line-height: var(--leading-snug);
    font-size: var(--text-base);
}
.atc-item__count { font-size: var(--text-xs); color: var(--text-subtle); margin-top: 2px; }

/* --- Statik içerik sayfaları --- */
.static-page { max-width: 68ch; }
.static-page h2 {
    font-size: var(--text-lg);
    margin-top: var(--sp-8);
    margin-bottom: var(--sp-3);
}
.static-page h2:first-of-type { margin-top: var(--sp-6); }
.static-page p { margin-bottom: var(--sp-4); color: var(--text-muted); }
.static-page ul {
    list-style: disc;
    padding-left: var(--sp-5);
    margin-bottom: var(--sp-4);
    color: var(--text-muted);
}
.static-page li { margin-bottom: var(--sp-2); }

/* --- Hata sayfası --- */
.error-page {
    text-align: center;
    padding-block: var(--sp-16);
}
.error-page__code {
    font-size: clamp(3.5rem, 2rem + 8vw, 6rem);
    font-weight: 750;
    letter-spacing: -0.04em;
    line-height: 1;
    color: var(--brand-600);
    opacity: 0.25;
}
.error-page__title { margin-block: var(--sp-4) var(--sp-3); }
.error-page__text { color: var(--text-muted); margin-bottom: var(--sp-8); }
.error-page__search { max-width: 480px; margin: 0 auto var(--sp-6); }

/* --- Haberler --- */
.post-list {
    display: grid;
    gap: var(--sp-4);
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}

.post-card {
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-5);
    transition: border-color var(--transition), box-shadow var(--transition);
}
.post-card:hover { border-color: var(--brand-300); box-shadow: var(--shadow-sm); }

.post-card__title {
    font-size: var(--text-md);
    line-height: var(--leading-snug);
    color: var(--text);
    margin-bottom: var(--sp-2);
}
.post-card__link:hover .post-card__title { color: var(--link); }

.post-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-2);
    font-size: var(--text-xs);
    color: var(--text-subtle);
    margin-bottom: var(--sp-3);
}

.post-card__summary {
    color: var(--text-muted);
    font-size: var(--text-sm);
    line-height: var(--leading-normal);
}

.post-lead {
    font-size: var(--text-lg);
    color: var(--text-muted);
    line-height: var(--leading-normal);
    margin-bottom: var(--sp-6);
    padding-bottom: var(--sp-5);
    border-bottom: 1px solid var(--border);
}

/* Yazı gövdesi tipografisi */
.post-body { line-height: var(--leading-normal); color: var(--text-muted); }
.post-body h2 {
    font-size: var(--text-lg);
    color: var(--text);
    margin: var(--sp-8) 0 var(--sp-3);
}
.post-body h3 { font-size: var(--text-md); color: var(--text); margin: var(--sp-6) 0 var(--sp-2); }
.post-body p { margin-bottom: var(--sp-4); }
.post-body ul, .post-body ol { margin-bottom: var(--sp-5); }
.post-body ul li, .post-body ol li {
    padding: var(--sp-2) 0;
    border-bottom: 1px solid var(--border);
}
.post-body ul li:last-child, .post-body ol li:last-child { border-bottom: 0; }
.post-body li a { font-weight: 550; }
.post-body li span { color: var(--text-subtle); font-size: var(--text-sm); }
.post-body blockquote {
    margin: var(--sp-5) 0;
    padding-left: var(--sp-5);
    border-left: 3px solid var(--brand-500);
    color: var(--text-muted);
}
.post-body em { color: var(--text-subtle); font-size: var(--text-sm); }

/* --- Haber görselleri --- */
.post-card--media { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.post-card--media > :not(.post-card__media) { padding-inline: var(--sp-5); }
.post-card--media > .post-card__link { padding-top: var(--sp-4); }
.post-card--media > :last-child { padding-bottom: var(--sp-5); }

.post-card__media {
    display: block;
    aspect-ratio: 16 / 9;
    background: var(--bg-sunken);
    overflow: hidden;
}
.post-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition);
}
.post-card:hover .post-card__media img { transform: scale(1.03); }

.post-cover {
    margin: 0 0 var(--sp-6);
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--bg-sunken);
    border: 1px solid var(--border);
}
.post-cover img {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
}

/* Yönetim formunda mevcut kapak önizlemesi */
.cover-preview {
    display: flex;
    align-items: center;
    gap: var(--sp-4);
    margin-bottom: var(--sp-3);
    padding: var(--sp-3);
    background: var(--bg-sunken);
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
.cover-preview img {
    width: 140px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: var(--radius-sm);
    flex-shrink: 0;
}
.cover-preview span { font-size: var(--text-xs); color: var(--text-subtle); }

/* ============================================================
   Nöbetçi eczaneler
   ============================================================ */

/* --- İl seçimi --- */
.city-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--sp-4);
    margin: var(--sp-6) 0 var(--sp-10);
}
.city-card {
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    background: var(--bg-elevated);
    transition: all var(--transition);
}
.city-card:hover { border-color: var(--brand-400); box-shadow: var(--shadow-sm); }
.city-card--muted { opacity: .62; }
.city-card__link {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    padding: var(--sp-5);
}
.city-card__name { font-size: var(--text-lg); font-weight: 600; color: var(--text); }
.city-card__meta { font-size: var(--text-sm); color: var(--text-muted); }

/* --- İlçe şeridi --- */
.chip-nav {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
    margin-bottom: var(--sp-8);
}
.chip--active {
    background: var(--brand-50);
    border-color: var(--brand-300);
    color: var(--link);
}

/* --- Eczane kartları --- */
.pharm-section { margin-bottom: var(--sp-8); }
.pharm-section__title {
    font-size: var(--text-md);
    font-weight: 620;
    margin-bottom: var(--sp-3);
    padding-bottom: var(--sp-2);
    border-bottom: 1px solid var(--border);
}
.pharm-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
    gap: var(--sp-4);
}
.pharm-card {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    padding: var(--sp-5);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    background: var(--bg-elevated);
}
.pharm-card__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--sp-3);
}
.pharm-card__name { font-size: var(--text-base); font-weight: 620; color: var(--text); }
.pharm-card__district {
    flex: none;
    font-size: var(--text-xs);
    color: var(--text-subtle);
}
.pharm-card__address,
.pharm-card__directions,
.pharm-card__until {
    font-size: var(--text-sm);
    line-height: var(--leading-snug);
    color: var(--text-muted);
}
.pharm-card__directions { color: var(--text-subtle); font-style: italic; }
.pharm-card__until { color: var(--rx-turuncu-fg); }
.pharm-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
    margin-top: auto;
    padding-top: var(--sp-2);
}
/* Telefon numarası mobilde tek dokunuşla aranır; hedef alan küçülmemeli. */
.btn--sm {
    padding: var(--sp-2) var(--sp-4);
    font-size: var(--text-sm);
    min-height: 38px;
}

/* --- Kaynak ve tazelik --- */
.source-line {
    font-size: var(--text-sm);
    color: var(--text-subtle);
    margin-top: var(--sp-2);
}
.source-line a { color: var(--text-muted); text-decoration: underline; }
.notice__title { font-weight: 620; color: var(--text); margin-bottom: var(--sp-2); }
.region-line { margin-top: var(--sp-4); font-size: var(--text-sm); }
.muted { color: var(--text-subtle); }

@media (max-width: 560px) {
    .pharm-list, .city-grid { grid-template-columns: 1fr; }
}

/* --- İlaç kutusu fotoğrafı --- */
.drug-hero__photo {
    flex: none;
    width: 108px;
    height: 108px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--sp-2);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    background: #fff;           /* kutu fotoğrafları beyaz zeminli çekiliyor */
    overflow: hidden;
}
.drug-hero__photo img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}
@media (max-width: 560px) {
    .drug-hero__photo { width: 84px; height: 84px; }
}

/* Liste satırlarındaki kutu fotoğrafı — form ikonuyla AYNI ölçüde olmalı,
   yoksa fotoğraflı ve fotoğrafsız satırlar farklı hizalanır. */
.drug-row__photo {
    flex: none;
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: #fff;
    overflow: hidden;
}
.drug-row__photo img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}