/* assets/css/components.css */

/* === Başlıklar === */
.page-title {
    font-size: 1.875rem; /* text-3xl */
    font-weight: 700;
    color: #1f2937; /* gray-800 */
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #e5e7eb; /* gray-200 */
    padding-bottom: 0.5rem;
}

/* === Kartlar (Formlar ve Tablolar için) === */
.card {
    background-color: #fff;
    /* padding: 1.5rem; <-- BU SATIRIN SİLİNMİŞ OLMASI LAZIM! */
    border-radius: 0.5rem; 
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
    margin-bottom: 2rem;
    border: 1px solid #e5e7eb; /* Hafif bir kenarlık ekleyelim */
    overflow: hidden; /* Kenarlığın düzgün görünmesi için */
}
.card-header {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1f2937;
    border-bottom: 1px solid #e5e7eb;
    padding: 1rem 1.5rem; /* padding-bottom yerine tam padding */
    background-color: #f9fafb; /* gray-50 */
}
.card-body {
    padding: 1.5rem; /* p-6 */
}
.card-body .form-group {
    margin-bottom: 1.25rem; /* Form grupları arası boşluk */
}
.card-body .form-group:last-of-type {
    margin-bottom: 0; /* Son elemanın altında boşluk olmasın */
}
.card-header-sub {
    font-size: 1.125rem; /* text-lg */
    font-weight: 600;
    margin-top: 1.5rem;
    margin-bottom: 0.75rem;
    color: #374151; /* gray-700 */
}

/* === Formlar === */
.form-grid {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 1rem;
}
@media (min-width: 768px) {
    .form-grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .form-grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .form-col-span-2 {
        grid-column: span 2 / span 2;
    }
}
.form-group {
    margin-bottom: 1rem; /* space-y-4 */
}
.form-label {
    display: block;
    font-size: 0.875rem; /* text-sm */
    font-weight: 500;
    color: #374151; /* gray-700 */
    margin-bottom: 0.25rem;
}
.form-label .required-star {
    color: #ef4444; /* red-500 */
}
.form-input-control {
    width: 100%;
    padding: 0.75rem; /* p-3 */
    border: 1px solid #d1d5db; /* border-gray-300 */
    border-radius: 0.5rem; /* rounded-lg */
    color: #1f2937; /* text-gray-800 */
}
.form-input-control:disabled {
    background-color: #f3f4f6; /* bg-gray-100 */
}
.form-input-control:focus {
    border-color: #d97706; /* border-amber-500 */
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.2); /* ring-amber-500/20 */
    outline: none;
}
textarea.form-input-control {
    height: 6rem; /* h-24 */
}
.form-file-input {
    display: block;
    width: 100%;
    font-size: 0.875rem;
    color: #6b7280; /* text-gray-500 */
}
/* Tailwind'in dosya input stili (webkit) */
.form-file-input::file-selector-button {
    margin-right: 1rem;
    padding: 0.5rem 1rem;
    border-radius: 9999px; /* rounded-full */
    border: 0;
    font-size: 0.875rem;
    font-weight: 600;
    background-color: #fef3c7; /* amber-50 */
    color: #b45309; /* amber-700 */
    transition: background-color 0.15s ease;
}
.form-file-input:hover::file-selector-button {
    background-color: #fde68a; /* amber-100 */
}

/* Switch (Checkbox) */
.form-switch-group {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.form-switch-input {
    height: 1rem;
    width: 1rem;
    border-radius: 0.25rem;
    border-color: #d1d5db;
    color: #16a34a; /* green-600 */
    transition: all 0.15s ease;
}
.form-switch-input:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.2);
}

/* Resim Önizleme */
.form-image-preview-group {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.5rem;
}
.form-image-preview {
    height: 4rem; /* h-16 */
    width: 4rem; /* w-16 */
    object-fit: cover;
    border-radius: 0.375rem; /* rounded-md */
    border: 1px solid #d1d5db;
}
.form-image-remove-group {
    display: flex;
    align-items: center;
}
.form-image-remove-input {
    height: 1rem; width: 1rem;
    color: #ef4444; /* red-600 */
}
.form-image-remove-label {
    margin-left: 0.5rem;
    font-size: 0.875rem;
    color: #ef4444; /* red-600 */
}

/* Buton Grubu */
.form-button-group {
    display: flex;
    gap: 1rem;
    padding-top: 1rem;
}
.btn {
    display: inline-block;
    padding: 0.75rem 1.5rem; 
    font-weight: 600;
    font-size: 1rem;
    text-align: center;
    border-radius: 9999px; 
    border: none;
    cursor: pointer;
    box-shadow: var(--shadow-md);
    transition: all 0.2s ease-in-out;
}
.btn-primary {
    flex-grow: 1;
    color: #fff;
    background-color: #d97706; /* amber-600 */
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.05);
}
.btn-primary:hover {
    background-color: #92400e; /* Amber-800 */
    color: var(--color-white);
    transform: translateY(-2px); /* Hafif kalkma */
    box-shadow: var(--shadow-lg);
}
.btn-secondary {
    color: #374151; /* gray-700 */
    background-color: #e5e7eb; /* gray-200 */
    border: 1px solid #d1d5db;
}
.btn-secondary:hover {
    background-color: #d1d5db; /* gray-300 */
}

/* === Tablolar === */
.table-wrapper {
    overflow-x: auto;
}
.data-table {
    width: 100%;
    min-width: 640px;
    border-collapse: collapse;
}
.data-table thead {
    background-color: #f9fafb; /* gray-50 */
}
.data-table th {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.75rem;
    font-weight: 500;
    color: #6b7280; /* gray-500 */
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #e5e7eb;
}
.data-table tbody {
    background-color: #fff;
    border-bottom: 1px solid #e5e7eb;
}
.data-table td {
    padding: 1rem 1rem;
    font-size: 0.875rem;
    color: #1f2937;
    vertical-align: middle;
    border-bottom: 1px solid #e5e7eb;
}
.data-table tbody tr:hover {
    background-color: #f9fafb; /* gray-50 */
}

/* Tablo Görseli */
.table-image {
    height: 2.5rem; /* h-10 */
    width: 2.5rem; /* w-10 */
    border-radius: 9999px; /* rounded-full */
    object-fit: cover;
    border: 1px solid #e5e7eb;
}
.table-image-placeholder {
    height: 2.5rem;
    width: 2.5rem;
    border-radius: 9999px;
    background-color: #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    color: #6b7280;
}

/* Tablo Badge (Durum) */
.badge {
    padding: 0.25rem 0.5rem;
    display: inline-flex;
    font-size: 0.75rem;
    line-height: 1.25rem;
    font-weight: 600;
    border-radius: 9999px;
}
.badge-success {
    background-color: #dcfce7; /* green-100 */
    color: #166534; /* green-800 */
}
.badge-danger {
    background-color: #fee2e2; /* red-100 */
    color: #991b1b; /* red-800 */
}

/* Tablo İşlem Butonları */
.table-actions {
    text-align: right;
    white-space: nowrap;
}
.table-action-link {
    font-weight: 500;
    margin: 0 0.5rem;
    font-size: 0.875rem;
}
.table-action-edit {
    color: #d97706; /* amber-600 */
}
.table-action-edit:hover {
    color: #b45309; /* amber-700 */
}
.table-action-delete {
    color: #dc2626; /* red-600 */
    background: none;
    border: none;
    cursor: pointer;
    font-family: inherit;
}
.table-action-delete:hover {
    color: #991b1b; /* red-800 */
}

/* === Uyarı Mesajları (Flash) === */
.alert {
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    border-radius: 0.5rem;
    font-size: 0.875rem;
}
.alert-dismissible {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.alert-success {
    color: #166534; /* green-800 */
    background-color: #dcfce7; /* green-100 */
}
.alert-danger {
    color: #991b1b; /* red-800 */
    background-color: #fee2e2; /* red-100 */
}
.alert-info {
    color: #1e40af; /* blue-800 */
    background-color: #dbeafe; /* blue-100 */
}
.alert-close-btn {
    background: none;
    border: none;
    font-size: 1.25rem;
    font-weight: 700;
    color: inherit;
    opacity: 0.7;
    cursor: pointer;
    margin-left: 1rem;
}
.alert-close-btn:hover {
    opacity: 1;
}

/* === Stat Kartları (Dashboard) === */
.stat-card-grid {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 1.5rem;
}
@media (min-width: 768px) {
    .stat-card-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
.stat-card {
    padding: 1.25rem;
    border-radius: 0.5rem;
    border-left-width: 4px;
    box-shadow: 0 1px 3px 0 rgba(0,0,0,0.1), 0 1px 2px 0 rgba(0,0,0,0.06);
}
.stat-card-title {
    font-size: 0.875rem;
    color: #4b5563; /* gray-600 */
}
.stat-card-value {
    font-size: 1.875rem; /* text-3xl */
    font-weight: 700;
    color: #1f2937; /* gray-800 */
}
/* Renkler */
.stat-card-blue { border-color: #3b82f6; background-color: #eff6ff; }
.stat-card-green { border-color: #22c55e; background-color: #f0fdf4; }
.stat-card-yellow { border-color: #f59e0b; background-color: #fefce8; }

/* === Butonlar === */
.btn {
    display: inline-block;
    padding: 0.75rem 1.5rem; /* px-5 py-3 */
    font-weight: 600;
    font-size: 1rem;
    text-align: center;
    border-radius: 9999px; /* rounded-full */
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: var(--shadow-md);
}
.btn-primary {
    background-color: var(--color-primary);
    color: var(--color-white);
}
.btn-primary:hover {
    background-color: #92400e; /* Amber-800 */
    color: var(--color-white);
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

/* === Kartlar (Değerler alanı için) === */
.card {
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 0.5rem; /* rounded-lg */
    box-shadow: var(--shadow-md);
    padding: 1.5rem;
    /* Dikey büyüme için (flex-fill karşılığı) */
    display: flex;
    flex-direction: column;
}
.card-title {
    font-size: 1.25rem; /* h4 */
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 0.75rem;
}
.card-title i {
    color: var(--color-primary);
    margin-right: 0.5rem;
}
.card-text {
    color: var(--color-text-light);
    white-space: pre-line; /* PHP'deki nl2br() ile uyumlu */
}

/* === Sayfaya Özel Stiller (index.php) === */
.hero-section {
    background-color: var(--color-primary-light);
    border: 1px solid #fde68a; /* Amber-200 */
    border-radius: 1rem; /* rounded-4 */
    box-shadow: var(--shadow-lg);
    padding: 2.5rem; /* p-md-5 */
    margin-bottom: 3rem; /* mb-5 */
    text-align: center;
}
.hero-title {
    font-size: 3rem; /* display-3 */
    font-weight: 800; /* fw-bolder */
    color: var(--color-primary);
    margin-bottom: 1rem;
}
.hero-subtitle {
    font-size: 1.25rem; /* fs-5 */
    color: var(--color-text-light);
    font-weight: 300; /* fw-light */
    margin-bottom: 2rem;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    white-space: pre-line;
}

/* Değerler Kartları Grid (Grid layout) */
.values-grid {
    display: grid;
    grid-template-columns: 1fr; /* Mobilde tek sütun */
    gap: 1.5rem; /* g-4 */
    margin-bottom: 3rem; /* mb-5 */
}
/* Tablet (768px) ve üzeri */
@media (min-width: 768px) {
    .values-grid {
        grid-template-columns: repeat(2, 1fr); /* Tablette 2 sütun */
    }
}
/* Laptop (992px) ve üzeri */
@media (min-width: 992px) {
    .values-grid {
        grid-template-columns: repeat(3, 1fr); /* Laptoptan itibaren 3 sütun */
    }
}


/* Kampanya Vurgu Alanı */
.campaign-highlight {
    background-color: var(--color-white);
    padding: 1.5rem;
    border-radius: 0.75rem; /* rounded-3 */
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--color-border);
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.campaign-highlight__title {
    font-size: 1.5rem; /* h4 */
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 0.5rem;
}
.campaign-highlight__title i {
    color: var(--color-primary);
    margin-right: 0.5rem;
}
.campaign-highlight__text {
    color: var(--color-text-light);
    margin-bottom: 1rem;
    white-space: pre-line;
}
.campaign-highlight__link {
    font-weight: 600;
    text-decoration: none;
}
.campaign-highlight__link:hover {
    color: var(--color-text);
    text-decoration: underline;
}

/* === Uyarılar (Alerts) === */
.alert {
    padding: 1rem;
    margin-bottom: 1rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
}
.alert-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}
.alert-info {
    color: #0c5460;
    background-color: #d1ecf1;
    border-color: #bee5eb;
}
.page-title {
    font-size: 2.25rem; /* display-5 */
    font-weight: 700;
    margin-bottom: 2rem;
    text-align: center;
    border-bottom: 2px solid var(--color-border);
    padding-bottom: 1rem;
}

.category-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* Mobilde 2 sütun */
    gap: 1.5rem; /* g-4 */
}

/* Tablet (768px) ve üzeri */
@media (min-width: 768px) {
    .category-grid {
        grid-template-columns: repeat(3, 1fr); /* Tablette 3 sütun */
    }
}
/* Laptop (992px) ve üzeri */
@media (min-width: 992px) {
    .category-grid {
        grid-template-columns: repeat(4, 1fr); /* Laptoptan itibaren 4 sütun */
    }
}

/* === YENİ: KATEGORİ KARTI (categories.php) === */
.category-card {
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 1rem; /* rounded-4 */
    box-shadow: var(--shadow-sm); /* Bootstrap shadow-sm'e benzer */
    text-decoration: none;
    color: var(--color-text);
    overflow: hidden; /* Resmin taşmasını engeller */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.category-card:hover {
    transform: translateY(-5px); /* Hafif yukarı kalkma */
    box-shadow: var(--shadow-lg); /* Gölgeyi artır */
    color: var(--color-primary); /* Başlık rengi değişir */
}

.category-card__image-wrapper {
    height: 150px; /* Sabit resim alanı yüksekliği */
    background-color: var(--color-bg); /* bg-light */
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.category-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Resmi alana sığdır, taşanı kes */
    transition: transform 0.3s ease;
}
.category-card:hover .category-card__image {
    transform: scale(1.05); /* Hover'da resme hafif zoom */
}

.category-card__body {
    padding: 1rem;
    text-align: center;
}

.category-card__title {
    font-size: 1.125rem; /* h5 */
    font-weight: 700;
    margin: 0;
    /* Renk geçişini de ekleyelim */
    transition: color 0.3s ease;
}
.btn-back {
    display: inline-block;
    padding: 0.5rem 1rem;
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    border-radius: 9999px;
    font-weight: 500;
    font-size: 0.875rem;
    margin-bottom: 1rem;
}
.btn-back:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
}

/* === YENİ: MENÜ GRİD (menu.php) === */
.menu-grid {
    display: grid;
    grid-template-columns: 1fr; /* Mobilde tek sütun */
    gap: 1.5rem; /* g-4 */
}

/* 576px (Small) ve üzeri */
@media (min-width: 576px) {
    .menu-grid {
        grid-template-columns: repeat(2, 1fr); /* Küçük ekranda 2 sütun */
    }
}
/* 992px (Laptop) ve üzeri */
@media (min-width: 992px) {
    .menu-grid {
        grid-template-columns: repeat(3, 1fr); /* Laptoptan itibaren 3 sütun */
    }
}
/* 1200px (XL) ve üzeri */
@media (min-width: 1200px) {
    .menu-grid {
        grid-template-columns: repeat(4, 1fr); /* Geniş ekranda 4 sütun */
    }
}

/* === YENİ: MENÜ KARTI (menu.php) === */
.menu-card {
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 0.75rem; /* rounded-3 */
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.menu-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-lg);
}

.menu-card__image-wrapper {
    height: 200px;
    background-color: var(--color-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.menu-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}
.menu-card:hover .menu-card__image {
    transform: scale(1.05); /* Hover'da resme hafif zoom */
}

.menu-card__body {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* Kart boyunu eşitler */
}

.menu-card__title {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 0.25rem;
}

.menu-card__description {
    color: var(--color-text-light);
    font-size: 0.875rem; /* small */
    margin-bottom: 1rem;
    flex-grow: 1; /* Fiyatı en alta iter */
}

.menu-card__footer {
    border-top: 1px solid var(--color-border);
    padding-top: 0.75rem;
    margin-top: auto; /* Fiyatı en alta yapıştırır */
    display: flex;
    justify-content: flex-end; /* Fiyatı sağa yaslar */
    align-items: center;
}

.menu-card__price {
    font-size: 1.5rem; /* fs-4 */
    font-weight: 800; /* fw-bolder */
    color: var(--color-primary);
}
.content-card {
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 1rem; /* rounded-4 */
    box-shadow: var(--shadow-lg);
    overflow: hidden; /* Kenarlıkların düzgün görünmesi için */
}

.content-card__body {
    padding: 2.5rem; /* p-md-5 */
}

/* Tablet (768px) altı için daha az padding */
@media (max-width: 767.98px) {
    .content-card__body {
        padding: 1.5rem;
    }
}

/* === YENİ: İÇERİK METNİ (hakkimizda.php) === */
.content-text {
    font-size: 1.125rem; /* fs-5 */
    color: var(--color-text-light);
    line-height: 1.7; /* lh-lg */
}

.content-text p {
    margin-bottom: 1.5rem;
    white-space: pre-line; /* nl2br() ile uyumlu */
}

.content-subtitle {
    font-size: 1.75rem; /* h3 */
    font-weight: 600;
    color: var(--color-primary); /* text-warning-emphasis */
    margin-top: 1.5rem; /* <-- DÜZELTİLDİ (Daha az boşluk) */
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
}
.content-subtitle i {
    margin-right: 0.75rem; /* me-2 */
}
.campaign-grid {
    display: grid;
    grid-template-columns: 1fr; /* Mobilde tek sütun */
    gap: 1.5rem; /* g-4 */
}

/* 768px (Tablet) ve üzeri */
@media (min-width: 768px) {
    .campaign-grid {
        grid-template-columns: repeat(2, 1fr); /* Tablette 2 sütun */
    }
}
/* 992px (Laptop) ve üzeri */
@media (min-width: 992px) {
    .campaign-grid {
        grid-template-columns: repeat(3, 1fr); /* Laptoptan itibaren 3 sütun */
    }
}

/* === YENİ: KAMPANYA KARTI (kampanyalar.php) === */
.campaign-card {
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 1rem; /* rounded-4 */
    box-shadow: var(--shadow-lg); /* shadow-lg */
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.campaign-card__image-wrapper {
    height: 250px;
    background-color: var(--color-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-bottom: 1px solid var(--color-border);
}

.campaign-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.campaign-card__body {
    padding: 1.5rem; /* p-4 */
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* Kart boyunu eşitler */
}

.campaign-card__tag {
    align-self: flex-start; /* align-self-start */
    margin-bottom: 0.5rem;
    font-size: 0.875rem; /* fs-6 */
    padding: 0.3em 0.7em; /* Bootstrap badge padding'ine benzer */
}
.campaign-card__tag i {
    margin-right: 0.25rem;
}

.campaign-card__title {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 0.5rem;
}

.campaign-card__description {
    color: var(--color-text-light);
    font-size: 0.875rem; /* small */
    margin-bottom: 1rem;
    flex-grow: 1; /* Fiyatı/Süreyi aşağı iter */
}

.campaign-card__price-wrapper {
    margin-top: auto; /* Otomatik olarak yukarıdaki boşluğu doldur */
    padding-top: 0.75rem;
    border-top: 1px solid var(--color-border);
    text-align: right;
}

.campaign-card__price {
    font-size: 1.5rem; /* fs-4 */
    font-weight: 800; /* fw-bolder */
    color: var(--color-primary);
}

.campaign-card__duration {
    font-size: 0.875rem; /* small */
    color: var(--color-text-light);
    text-align: right;
    margin-top: 0.5rem;
}
.campaign-card__duration i {
    margin-right: 0.25rem;
}

.campaign-card__button {
    margin-top: 1rem;
    width: 100%;
}
.campaign-card__button:disabled {
    background-color: #e5e7eb; /* gray-200 */
    color: #9ca3af; /* gray-400 */
    cursor: not-allowed;
    box-shadow: none;
    transform: none;
}

/* === YENİ: KAMPANYA ETİKET RENKLERİ (Badges) === */
.badge-info {
    color: #055160;
    background-color: #cff4fc;
}
.badge-danger {
    color: #58151c;
    background-color: #f8d7da;
}
.badge-success {
    color: #0f5132;
    background-color: #d1e7dd;
}
.badge-warning {
    color: #664d03;
    background-color: #fff3cd;
}
.badge-default {
    color: #41464b;
    background-color: #e2e3e5;
}
.contact-layout {
    display: grid;
    grid-template-columns: 1fr; /* Mobilde tek sütun */
    gap: 2.5rem; /* g-lg-5 */
}

/* Laptop (992px) ve üzeri */
@media (min-width: 992px) {
    .contact-layout {
        grid-template-columns: repeat(2, 1fr); /* Laptoptan itibaren 2 sütun */
    }
}

/* İletişim Formu */
.contact-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.form-note {
    font-size: 0.875rem;
    color: var(--color-text-light);
    margin-top: -0.5rem;
}
/* Form elemanları (form-input-control vb.) zaten base.css'de tanımlı */


/* İletişim Bilgi Kartları */
.contact-info-wrapper {
    display: flex;
    flex-direction: column;
    gap: 1.5rem; /* vstack gap-4 */
}



.contact-info-title {
    font-size: 1.125rem; /* h5 */
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: 0.75rem;
    display: flex;
    align-items: center;
}
.contact-info-title i {
    margin-right: 0.75rem;
}

.contact-info-text {
    color: var(--color-text-light);
    line-height: 1.6;
    margin-bottom: 0.25rem;
    white-space: pre-line;
}

.contact-info-link {
    color: var(--color-text-light);
    text-decoration: none;
}
.contact-info-link:hover {
    color: var(--color-primary);
    text-decoration: underline;
}

/* Harita (Responsive iframe) */
.map-responsive-wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%; /* 16:9 Aspect Ratio */
    border-radius: 0.5rem;
}
.map-responsive-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Sosyal Medya Linkleri */
.social-links-list {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}
.social-link {
    display: flex;
    align-items: center;
    color: var(--color-text-light);
    font-size: 1rem;
    font-weight: 500;
}
.social-link:hover {
    color: var(--color-primary);
}
.social-link i {
    font-size: 1.25rem;
    margin-right: 0.5rem;
}
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6); /* Arka planı karart */
    z-index: 199;
    display: none; /* Varsayılan olarak gizli */
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}
.modal-overlay.is-visible {
    display: block;
    opacity: 1;
}

.modal-box {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--color-white);
    padding: 2rem;
    border-radius: 0.75rem; /* rounded-xl */
    box-shadow: var(--shadow-lg);
    z-index: 200;
    width: 90%;
    max-width: 450px; /* max-w-md */
    
    display: none; /* Varsayılan olarak gizli */
    opacity: 0;
    transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
}
.modal-box.is-visible {
    display: block;
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}
/* Açılırken hafif scale efekti için */
.modal-box {
     transform: translate(-50%, -60%) scale(0.95);
}


.modal-title {
    font-size: 1.5rem; /* text-2xl */
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 0.75rem;
}
.modal-text {
    color: var(--color-text-light);
    margin-bottom: 1.5rem;
}

.modal-button-group {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end; /* Butonları sağa yasla */
}

/* Modal buton stilleri (btn class'ı components.css'de zaten var) */
.btn-danger {
    background-color: #dc2626; /* red-600 */
    color: white;
}
.btn-danger:hover {
    background-color: #b91c1c; /* red-700 */
}
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6); /* Arka planı karart */
    z-index: 199;
    display: none; /* Varsayılan olarak gizli */
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}
.modal-overlay.is-visible {
    display: block;
    opacity: 1;
}

.modal-box {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--color-white);
    padding: 2rem;
    border-radius: 0.75rem; /* rounded-xl */
    box-shadow: var(--shadow-lg);
    z-index: 200;
    width: 90%;
    max-width: 450px; /* max-w-md */
    
    display: none; /* Varsayılan olarak gizli */
    opacity: 0;
    transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
}
.modal-box.is-visible {
    display: block;
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}
/* Açılırken hafif scale efekti için */
.modal-box {
     transform: translate(-50%, -60%) scale(0.95);
}


.modal-title {
    font-size: 1.5rem; /* text-2xl */
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 0.75rem;
    display: flex;
    align-items: center;
}
.modal-text {
    color: var(--color-text-light);
    margin-bottom: 1.5rem;
    line-height: 1.6;
}
.modal-text strong {
    color: var(--color-primary);
    font-weight: 600;
}

.modal-button-group {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end; /* Butonları sağa yasla */
}

/* Modal buton stilleri (btn class'ı components.css'de zaten var) */
.btn-danger {
    background-color: #dc2626; /* red-600 */
    color: white;
}
.btn-danger:hover {
    background-color: #b91c1c; /* red-700 */
}
.qr-canvas-container {
    padding: 1.5rem; /* <-- BOŞLUK ARTIRILDI */
    background-color: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 0.5rem;
    display: inline-block;
    margin-top: 1rem;
    line-height: 0;
}
.qr-canvas-container img {
    /* Kütüphane 'img' oluşturuyor, ortalamak için */
    margin: 0 auto;
}