/* =============================================
   Arsuz Kültür - Main Stylesheet
   Modern, clean, premium cultural portal design
   ============================================= */

@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600;700;800;900&family=Playfair+Display:wght@600;700;800&display=swap');

:root {
    --ak-primary: #1e9ad6;
    --ak-primary-rgb: 30, 154, 214;
    --ak-primary-dark: #0d7bb5;
    --ak-accent: #ffc220;
    --ak-accent-rgb: 255, 194, 32;
    --ak-dark: #0c3c5c;
    --ak-dark-soft: #164b6e;
    --ak-light: #f0f8ff;
    --ak-text: #2c3e50;
    --ak-text-light: #5a7d95;
    --ak-muted: #8faabb;
    --ak-border: #d4e6f1;
    --ak-success: #27ae60;
    --ak-radius: 0.75rem;
    --ak-radius-lg: 1rem;
    --ak-shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
    --ak-shadow: 0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -2px rgba(0,0,0,0.05);
    --ak-shadow-lg: 0 10px 25px -3px rgba(0,0,0,0.1), 0 4px 10px -4px rgba(0,0,0,0.07);
    --ak-shadow-xl: 0 20px 40px -5px rgba(0,0,0,0.15);
    --ak-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    /* Override Bootstrap primary to match our brand */
    --bs-primary: #1e9ad6;
    --bs-primary-rgb: 30, 154, 214;
}

* { box-sizing: border-box; }

/* Fix Bootstrap bg-opacity-10 being nearly invisible on white backgrounds */
.bg-opacity-10 { --bs-bg-opacity: 0.18 !important; }

/* Ensure category/type badge is always visible */
.badge.bg-primary.bg-opacity-10.text-primary {
    background-color: rgba(var(--ak-primary-rgb), 0.15) !important;
    color: var(--ak-primary-dark) !important;
    font-weight: 700;
    font-size: 0.78rem;
    letter-spacing: 0.02em;
}

body {
    font-family: 'Nunito', system-ui, -apple-system, sans-serif;
    color: var(--ak-text);
    background-color: var(--ak-light);
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
}

/* --- Site Watermark --- */
.site-watermark {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 420px;
    height: 420px;
    pointer-events: none;
    z-index: 0;
    opacity: 0.04;
    user-select: none;
}
.site-watermark img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

main.position-relative > *:not(.site-watermark) {
    position: relative;
    z-index: 1;
}

/* --- Card Placeholder Image (sun.svg fallback) --- */
.card-img-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #fef9e7 0%, #fdf2d5 100%);
}
.card-img-placeholder img {
    width: 60px;
    height: 60px;
    opacity: 0.35;
}
.detail-img-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #fef9e7 0%, #fdf2d5 100%);
    border-radius: var(--ak-radius-lg);
}
.detail-img-placeholder img {
    width: 100px;
    height: 100px;
    opacity: 0.3;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Playfair Display', Georgia, serif;
    color: var(--ak-dark);
}

a { color: var(--ak-primary); text-decoration: none; transition: var(--ak-transition); }
a:hover { color: var(--ak-primary-dark); }
img { max-width: 100%; height: auto; }
::selection { background: rgba(var(--ak-primary-rgb), 0.15); }

/* --- Buttons --- */
.btn {
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    border-radius: var(--ak-radius);
    transition: var(--ak-transition);
}
.btn-primary {
    background-color: var(--ak-primary); border-color: var(--ak-primary);
    box-shadow: 0 2px 8px rgba(var(--ak-primary-rgb), 0.3);
}
.btn-primary:hover, .btn-primary:focus {
    background-color: var(--ak-primary-dark); border-color: var(--ak-primary-dark);
    transform: translateY(-1px); box-shadow: 0 4px 14px rgba(var(--ak-primary-rgb), 0.4);
}
.btn-outline-primary {
    color: var(--ak-primary); border-color: var(--ak-primary);
}
.btn-outline-primary:hover {
    background-color: var(--ak-primary); border-color: var(--ak-primary); color: #fff;
}
.text-primary { color: var(--ak-primary) !important; }
.bg-primary { background-color: var(--ak-primary) !important; }
.btn-accent {
    background: var(--ak-accent); border-color: var(--ak-accent);
    color: var(--ak-dark); box-shadow: 0 2px 8px rgba(var(--ak-accent-rgb), 0.3);
}
.btn-accent:hover { background: #e6ab00; color: var(--ak-dark); transform: translateY(-1px); }
.btn-lg { padding: 0.7rem 2rem; font-size: 1.05rem; }

/* ======== NAVBAR ======== */
.navbar-arsuz {
    background: #fff;
    backdrop-filter: blur(16px);
    box-shadow: 0 2px 12px rgba(30,154,214,0.08);
    padding: 0.4rem 0;
    border-bottom: 3px solid var(--ak-primary);
}
.navbar-arsuz .navbar-brand {
    display: flex; align-items: center; padding: 0; flex-shrink: 0;
}
.navbar-arsuz .navbar-brand img {
    height: 44px; width: auto; max-width: none; object-fit: contain;
}
.navbar-arsuz .nav-link {
    color: var(--ak-dark) !important;
    font-family: 'Nunito', sans-serif; font-weight: 700; font-size: 0.92rem;
    padding: 0.6rem 1rem; position: relative;
    letter-spacing: 0.01em;
}
.navbar-arsuz .nav-link:hover, .navbar-arsuz .nav-link.active { color: var(--ak-primary) !important; }
.navbar-arsuz .nav-link::after {
    content: ''; position: absolute; bottom: 0; left: 50%;
    width: 0; height: 3px; background: var(--ak-accent);
    border-radius: 2px;
    transform: translateX(-50%); transition: width 0.3s;
}
.navbar-arsuz .nav-link:hover::after { width: 70%; }
.navbar-arsuz .dropdown-toggle::after { display: none; }
.navbar-arsuz button.nav-link.dropdown-toggle { background: none; border: none; text-decoration: none; cursor: pointer; }
@media (min-width: 992px) {
    .nav-hover-dropdown:hover > .dropdown-menu { display: block; margin-top: 0; }
    .nav-hover-dropdown > .dropdown-menu { transition: opacity 0.2s ease; }
    .nav-hover-dropdown > .dropdown-toggle { pointer-events: auto; }
}
.lang-btn {
    font-size: 0.85rem; padding: 0.3rem 0.8rem; border-radius: 2rem;
    font-weight: 700; border: 2px solid var(--ak-primary); color: var(--ak-primary); background: transparent;
    font-family: 'Nunito', sans-serif;
}
.lang-btn:hover { border-color: var(--ak-accent); color: var(--ak-dark); background: var(--ak-accent); }

/* ======== HERO ======== */
.hero-section {
    position: relative;
    background: linear-gradient(135deg, rgba(12,60,92,0.82) 0%, rgba(18,120,168,0.75) 40%, rgba(30,154,214,0.7) 70%, rgba(91,189,232,0.65) 100%),
                url('/public/images/arsuz-gallery/arsuz-da-deniz.jpg') center/cover no-repeat;
    color: #fff; padding: 6rem 0 5rem; overflow: hidden;
}
.hero-section::before {
    content: ''; position: absolute; inset: 0;
    background: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none'%3E%3Ccircle cx='40' cy='40' r='2' fill='%23ffffff' fill-opacity='0.04'/%3E%3Ccircle cx='10' cy='10' r='1.5' fill='%23ffffff' fill-opacity='0.03'/%3E%3C/g%3E%3C/svg%3E");
}
.hero-section .container { position: relative; z-index: 1; }
.hero-section h1 { font-size: 3.2rem; font-weight: 800; color: #fff; margin-bottom: 1rem; line-height: 1.2; }
.hero-section .hero-subtitle {
    font-family: 'Nunito', sans-serif; font-size: 1.2rem; opacity: 0.9;
    max-width: 620px; margin: 0 auto 2rem; font-weight: 400; line-height: 1.7;
}
.hero-section .hero-badge {
    display: inline-block; padding: 0.4rem 1.2rem; border-radius: 2rem;
    font-size: 0.8rem; font-weight: 700; font-family: 'Nunito', sans-serif;
    background: rgba(var(--ak-accent-rgb), 0.2); color: var(--ak-accent);
    border: 1px solid rgba(var(--ak-accent-rgb), 0.4); margin-bottom: 1rem;
    letter-spacing: 0.05em; text-transform: uppercase;
}
.hero-stats {
    display: flex; justify-content: center; gap: 3rem;
    margin-top: 3rem; padding-top: 2rem;
    border-top: 1px solid rgba(255,255,255,0.1);
}
.hero-stats .stat { text-align: center; }
.hero-stats .stat-number { font-family: 'Playfair Display', serif; font-size: 2rem; font-weight: 800; color: var(--ak-accent); }
.hero-stats .stat-label { font-family: 'Nunito', sans-serif; font-size: 0.85rem; opacity: 0.7; font-weight: 600; }

/* ======== CARDS ======== */
.card {
    border: none; border-radius: var(--ak-radius-lg);
    box-shadow: var(--ak-shadow); transition: var(--ak-transition);
    overflow: hidden; background: #fff;
}
.card:hover { transform: translateY(-4px); box-shadow: var(--ak-shadow-xl); }
.card-img-top { height: 220px; object-fit: cover; }
.card .badge { font-family: 'Nunito', sans-serif; font-weight: 700; font-size: 0.75rem; }
.article-card .card-body { padding: 1.5rem; }
.article-card .card-title { font-weight: 800; font-size: 1.15rem; line-height: 1.4; color: var(--ak-dark); }
.article-card .card-text { color: var(--ak-text-light); font-size: 0.9rem; font-family: 'Nunito', sans-serif; }
.article-card .card-footer { background: transparent; border-top: 1px solid var(--ak-border); padding: 1rem 1.5rem; }
.business-card .card-img-top { height: 200px; }
.business-card .card-body { padding: 1.5rem; }
.business-card .card-title { font-family: 'Nunito', sans-serif; font-weight: 800; font-size: 1.1rem; }

/* ======== SECTION HEADINGS ======== */
.section-header { margin-bottom: 2.5rem; }
.section-title { font-weight: 800; font-size: 2rem; color: var(--ak-dark); margin-bottom: 0.5rem; display: inline-block; }
.section-subtitle { font-family: 'Nunito', sans-serif; color: var(--ak-text-light); font-size: 1rem; }
.section-divider {
    width: 60px; height: 3px;
    background: linear-gradient(90deg, var(--ak-accent), var(--ak-primary));
    border-radius: 2px; margin-top: 0.75rem;
}
.section-divider.center { margin-left: auto; margin-right: auto; }

/* ======== QUICK LINKS ======== */
.quick-link-card {
    text-align: center; padding: 2.5rem 1.5rem; border-radius: var(--ak-radius-lg);
    background: #fff; box-shadow: var(--ak-shadow); transition: var(--ak-transition);
    position: relative; overflow: hidden;
}
.quick-link-card::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0;
    height: 4px; background: linear-gradient(90deg, var(--ak-primary), var(--ak-accent));
    transform: scaleX(0); transition: transform 0.3s;
}
.quick-link-card:hover::before { transform: scaleX(1); }
.quick-link-card:hover { transform: translateY(-6px); box-shadow: var(--ak-shadow-xl); }
.quick-link-card .ql-icon {
    width: 64px; height: 64px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.5rem; margin-bottom: 1rem; transition: var(--ak-transition);
}
.quick-link-card:hover .ql-icon { transform: scale(1.1); }
.quick-link-card h5 { font-family: 'Nunito', sans-serif; font-weight: 800; font-size: 1rem; margin-bottom: 0.25rem; }
.quick-link-card p { font-size: 0.85rem; color: var(--ak-text-light); margin: 0; }
.ql-icon.history { background: #dbeafe; color: #2563eb; }
.ql-icon.tourism { background: #dcfce7; color: #16a34a; }
.ql-icon.culture { background: #fef3c7; color: #d97706; }
.ql-icon.events  { background: #fce7f3; color: #db2777; }

/* ======== GALLERY ======== */
.gallery-grid .gallery-item {
    position: relative; overflow: hidden; border-radius: var(--ak-radius-lg); cursor: pointer;
}
.gallery-grid .gallery-item img {
    width: 100%; height: 240px; object-fit: cover;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
.gallery-grid .gallery-item:hover img { transform: scale(1.08); }
.gallery-grid .gallery-item .overlay {
    position: absolute; inset: 0;
    background: linear-gradient(0deg, rgba(0,0,0,0.6) 0%, transparent 60%);
    opacity: 0; transition: opacity 0.3s;
    display: flex; align-items: flex-end; padding: 1rem;
}
.gallery-grid .gallery-item:hover .overlay { opacity: 1; }
.lightbox-modal .modal-content { background: transparent; border: none; }
.lightbox-modal .modal-body { padding: 0; }
.lightbox-modal img { max-height: 90vh; max-width: 100%; margin: auto; display: block; border-radius: var(--ak-radius); }

/* ======== BREADCRUMB ======== */
.breadcrumb-item + .breadcrumb-item::before { content: "›"; }
.breadcrumb { background: transparent; padding: 0; font-size: 0.9rem; font-family: 'Nunito', sans-serif; }

/* ======== TAGS ======== */
.tag-badge {
    display: inline-block; padding: 0.35rem 0.9rem; border-radius: 2rem;
    font-size: 0.8rem; font-family: 'Nunito', sans-serif; font-weight: 600;
    background: #f1f5f9; color: var(--ak-text); transition: var(--ak-transition);
}
.tag-badge:hover { background: var(--ak-primary); color: #fff; }

/* ======== FILTER PILLS ======== */
.filter-pills { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 2rem; }
.filter-pill {
    display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 0.45rem 1.1rem; border-radius: 2rem; font-size: 0.85rem;
    font-weight: 700; font-family: 'Nunito', sans-serif;
    background: #fff; color: var(--ak-text); border: 1px solid var(--ak-border);
    transition: var(--ak-transition); text-decoration: none;
}
.filter-pill:hover { border-color: var(--ak-primary); color: var(--ak-primary); background: rgba(var(--ak-primary-rgb), 0.05); }
.filter-pill.active { background: var(--ak-primary); color: #fff; border-color: var(--ak-primary); }

/* ======== FOOTER ======== */
.footer {
    background: var(--ak-dark); color: #a8c4d8; padding: 4rem 0 1.5rem; margin-top: 0;
}
.footer h5 { font-family: 'Nunito', sans-serif; color: #fff; font-weight: 800; font-size: 1rem; margin-bottom: 1.25rem; }
.footer a { color: #a8c4d8; font-size: 0.9rem; }
.footer a:hover { color: var(--ak-accent); }
.footer-brand { display: flex; align-items: center; }
.footer-brand img { height: 44px; width: auto; }

.footer-bottom {
    border-top: 1px solid #1e3a52; margin-top: 2.5rem;
    padding-top: 1.5rem; font-size: 0.85rem; font-family: 'Nunito', sans-serif;
}

/* ======== PAGINATION ======== */
.pagination .page-link {
    color: var(--ak-primary); border-color: var(--ak-border);
    border-radius: var(--ak-radius) !important; margin: 0 3px;
    font-weight: 500; font-family: 'Inter', sans-serif;
}
.pagination .page-item.active .page-link {
    background-color: var(--ak-primary); border-color: var(--ak-primary);
    color: #fff;
    box-shadow: 0 2px 6px rgba(var(--ak-primary-rgb), 0.3);
}

/* ======== FORM STYLES ======== */
.form-control, .form-select {
    border-radius: var(--ak-radius); border-color: var(--ak-border);
    font-family: 'Nunito', sans-serif; padding: 0.65rem 1rem;
}
.form-control:focus, .form-select:focus {
    border-color: var(--ak-primary); box-shadow: 0 0 0 3px rgba(var(--ak-primary-rgb), 0.12);
}
.form-label { font-family: 'Nunito', sans-serif; font-weight: 700; font-size: 0.9rem; color: var(--ak-dark); }

/* ======== AUTH / CONTACT ======== */
.contact-card { background: #fff; border-radius: var(--ak-radius-lg); padding: 2.5rem; box-shadow: var(--ak-shadow-lg); }
.auth-card { max-width: 440px; margin: 3rem auto; }
.auth-card .card-body { padding: 2.5rem; }
.alert-dismissible { border: none; border-radius: var(--ak-radius); font-family: 'Nunito', sans-serif; font-weight: 600; }

/* ======== BUSINESS DETAIL ======== */
.business-carousel .carousel-item img { height: 420px; object-fit: cover; border-radius: var(--ak-radius-lg); }
.business-sidebar .info-item {
    padding: 0.85rem 0; border-bottom: 1px solid var(--ak-border);
    display: flex; align-items: flex-start; gap: 0.75rem;
}
.business-sidebar .info-item:last-child { border: none; }
.business-sidebar .info-icon {
    width: 36px; height: 36px; border-radius: 50%;
    background: rgba(var(--ak-primary-rgb), 0.1); color: var(--ak-primary);
    display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}

/* ======== CTA SECTION ======== */
.cta-section {
    background: linear-gradient(135deg, #0c3c5c 0%, var(--ak-primary) 60%, #5bbde8 100%);
    color: #fff; padding: 4rem 0; border-radius: var(--ak-radius-lg);
    position: relative; overflow: hidden;
}
.cta-section::before {
    content: ''; position: absolute; inset: 0;
    background: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Ccircle cx='20' cy='20' r='3'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.cta-section .container { position: relative; z-index: 1; }
.cta-section h2 { color: #fff; font-weight: 800; }

/* ======== EMPTY STATE ======== */
.empty-state { text-align: center; padding: 4rem 1rem; }
.empty-state i { font-size: 4rem; color: var(--ak-muted); margin-bottom: 1rem; }
.empty-state h4 { font-family: 'Nunito', sans-serif; color: var(--ak-text-light); font-weight: 700; }

/* ======== BACK TO TOP ======== */
#backToTop {
    position: fixed; bottom: 2rem; right: 2rem; width: 44px; height: 44px;
    border-radius: 50%; background: var(--ak-primary); color: #fff;
    border: none; display: none; align-items: center; justify-content: center;
    font-size: 1.2rem; box-shadow: var(--ak-shadow-lg); z-index: 999; cursor: pointer;
}
#backToTop:hover { background: var(--ak-primary-dark); transform: translateY(-3px); }

/* ======== RESPONSIVE ======== */
@media (max-width: 992px) {
    .hero-section { padding: 4rem 0 3rem; }
    .hero-section h1 { font-size: 2.4rem; }
    .hero-stats { gap: 2rem; }
}
@media (max-width: 768px) {
    .hero-section { padding: 3rem 0 2.5rem; }
    .hero-section h1 { font-size: 2rem; }
    .hero-section .hero-subtitle { font-size: 1rem; }
    .hero-stats { gap: 1.5rem; flex-wrap: wrap; }
    .hero-stats .stat-number { font-size: 1.5rem; }
    .card-img-top { height: 180px; }
    .gallery-grid .gallery-item img { height: 180px; }
    .business-carousel .carousel-item img { height: 280px; }
    .section-title { font-size: 1.5rem; }
    .quick-link-card { padding: 1.5rem 1rem; }
}
@media (max-width: 576px) {
    .hero-section h1 { font-size: 1.6rem; }
    .hero-section { padding: 2.5rem 0 2rem; }
    .quick-link-card .ql-icon { width: 48px; height: 48px; font-size: 1.2rem; }
    .filter-pills { gap: 0.3rem; }
    .filter-pill { padding: 0.35rem 0.8rem; font-size: 0.8rem; }
}