/* =========================================
   ATÖLYESEL - DETAY SAYFASI (AIRBNB KONSEPTİ)
   ========================================= */

:root {
    --white:        #ffffff;
    --bg:           #f8fafc;
    --bg-card:      #ffffff;
    --primary:      #c69d4e;
    --primary-soft: #fff1ee;
    --primary-dark: #b58d41;
    --danger:       #ef4444;
    --ink:          #0f172a;
    --ink-2:        #334155;
    --ink-3:        #64748b;
    --border:       #e2e8f0;
    --border-2:     #cbd5e1;
    --gold:         #f59e0b;
    --radius-xl:    24px;
    --radius-lg:    16px;
    --radius-md:    12px;
    --shadow-sm:    0 4px 6px -1px rgba(0,0,0,0.05);
    --shadow-md:    0 20px 40px -10px rgba(0,0,0,0.12);
    --ease:         cubic-bezier(0.16, 1, 0.3, 1);
    --font:         'Plus Jakarta Sans', system-ui, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

.details-wrapper { 
    padding: 40px 0 120px; 
    background-color: var(--white);
}

/* BAŞLIK ALANI */
.workshop-header-area { margin-bottom: 24px; }
.workshop-title { 
    font-family: var(--font);
    font-size: 32px; 
    font-weight: 800; 
    color: var(--ink); 
    margin-bottom: 10px; 
    line-height: 1.2;
}
.workshop-quick-meta { 
    font-family: var(--font);
    font-size: 15px; 
    font-weight: 600; 
    display: flex; 
    gap: 12px; 
    color: var(--ink-2); 
}

/* AIRBNB FOTOĞRAF IZGARASI (GRID) */
.photo-grid-container {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 12px;
    height: 480px;
    border-radius: var(--radius-lg);
    overflow: hidden;
    margin-bottom: 48px;
}
.main-photo { height: 100%; width: 100%; }
.main-photo img { width: 100%; height: 100%; object-fit: cover; transition: 0.3s var(--ease); cursor: pointer; }
.sub-photos { 
    display: grid; 
    grid-template-columns: 1fr 1fr; 
    grid-template-rows: 1fr 1fr; 
    gap: 12px; 
}
.sub-photo-item img { width: 100%; height: 100%; object-fit: cover; transition: 0.3s var(--ease); cursor: pointer; }
.photo-grid-container img:hover { filter: brightness(0.85); transform: scale(1.02); }

/* ANA DÜZEN (İKİ KOLON) */
.details-main-grid {
    display: grid;
    grid-template-columns: 1.8fr 1fr;
    gap: 80px;
    position: relative;
    align-items: start;
}

/* SOL KOLON: BİLGİLER */
.content-subtitle { 
    font-family: var(--font);
    font-size: 1.4rem; 
    font-weight: 800; 
    color: var(--ink); 
    margin-bottom: 8px; 
}

.instructor-preview { 
    display: flex; justify-content: space-between; align-items: center; 
    padding-bottom: 16px; 
}
.mini-logo { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; border: 1px solid var(--border); }
.info-divider { height: 1px; background: var(--border); margin: 32px 0; }

.workshop-desc { 
    font-family: var(--font);
    font-size: 16px; 
    color: var(--ink-2); 
    line-height: 1.7; 
}

.perks-grid {
    display: grid; 
    grid-template-columns: 1fr 1fr; 
    gap: 24px; 
    margin-top: 32px;
}
.perk-box { background: var(--bg); border: 1px solid var(--border); border-radius: 12px; padding: 20px; }

/* SAĞ KOLON: STICKY REZERVASYON FORMU */
.details-sticky-col { 
    position: sticky; 
    top: 100px; 
}

.booking-card {
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 28px;
    box-shadow: var(--shadow-md);
    background: var(--bg-card);
}

.price-header { margin-bottom: 24px; }
.price-amount { font-family: var(--font); font-size: 28px; font-weight: 800; color: var(--ink); }
.price-suffix { font-family: var(--font); font-size: 16px; color: var(--ink-3); font-weight: 600; }
.payment-note { 
    display: flex; align-items: center; gap: 6px; 
    font-family: var(--font); font-size: 12px; font-weight: 700; 
    color: var(--ink-2); margin-top: 12px; 
    padding: 10px; background: var(--bg); border-radius: 8px; border: 1px solid var(--border-2);
}

.session-label {
    display: block; border: 2px solid var(--border); border-radius: 10px; padding: 14px; 
    margin-bottom: 12px; transition: 0.2s; font-family: var(--font);
}
.session-label.available { cursor: pointer; }
.session-label.available:hover { border-color: var(--primary); background: var(--primary-soft); }
.session-label.full { cursor: not-allowed; opacity: 0.5; background: var(--bg); }

/* Yeni Minimal Form Elemanları (Airbnb Tarzı) */
.form-control-airbnb {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid var(--border-2);
    border-radius: 8px;
    font-family: var(--font);
    font-size: 14px;
    font-weight: 600;
    color: var(--ink);
    transition: 0.2s;
}
.form-control-airbnb:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(198, 157, 78, 0.15);
}

.btn-reserve {
    width: 100%;
    background: var(--primary);
    color: var(--white);
    border: none;
    padding: 16px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
    transition: 0.2s;
    font-family: var(--font);
}
.btn-reserve:hover { background: var(--primary-dark); }

/* YORUMLAR KISMI */
.reviews-section { margin-top: 64px; }
.reviews-header { margin-bottom: 32px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px;}
.reviews-title-group h2 { font-family: var(--font); font-size: 24px; font-weight: 800; color: var(--ink); margin-bottom: 4px; }
.reviews-title-group p { font-family: var(--font); color: var(--ink-3); font-size: 14px; font-weight: 600; margin: 0; }
.reviews-score-group { display: flex; align-items: center; gap: 16px; }
.score-giant { font-family: var(--font); font-size: 40px; font-weight: 900; color: var(--ink); line-height: 1; }
.score-stars { font-size: 18px; color: var(--gold); letter-spacing: 2px; }

.pro-reviews-grid { 
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 24px;
}
.pro-review-card {
    border: 1px solid var(--border); padding: 24px; border-radius: var(--radius-lg);
    background: var(--white);
}
.prc-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 16px; }
.prc-user { display: flex; gap: 12px; align-items: center; }
.prc-avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--bg); color: var(--ink); display: flex; justify-content: center; align-items: center; font-weight: 800; font-size: 16px; }
.prc-meta strong { font-family: var(--font); display: block; font-size: 15px; font-weight: 700; color: var(--ink); }
.prc-meta span { font-family: var(--font); font-size: 12px; font-weight: 600; color: var(--ink-3); }
.prc-stars { color: var(--gold); font-size: 14px; }
.prc-body p { font-family: var(--font); font-size: 14px; color: var(--ink-2); line-height: 1.6; font-weight: 500; }
.prc-image { width: 100%; height: 180px; object-fit: cover; border-radius: 8px; margin-top: 16px; cursor: pointer; }
.prc-reply { background: var(--bg); border-left: 3px solid var(--primary); padding: 16px; border-radius: 0 8px 8px 0; margin-top: 16px; }

/* MOBİL UYUMLULUK */
@media (max-width: 992px) {
    .photo-grid-container { grid-template-columns: 1fr; height: 350px; }
    .sub-photos { display: none; }
    .details-main-grid { grid-template-columns: 1fr; gap: 40px; }
    .details-sticky-col { order: -1; } /* Rezervasyon kutusu mobilde üste çıkar */
    .details-sticky-col { position: relative; top: 0; }
    .booking-card { box-shadow: none; border: 1px solid var(--border-2); }
}

@media (max-width: 768px) {
    .workshop-title { font-size: 24px; }
    .perks-grid { grid-template-columns: 1fr; gap: 16px; }
    .pro-reviews-grid { grid-template-columns: 1fr; }
    .photo-grid-container { height: 260px; margin-bottom: 24px;}
}