/*
Theme Name: Gamtos Slėnis
Theme URI: https://example.com/gamtos-slenis
Author: Edgaras
Author URI: https://example.com
Description: Web made for family business
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gamtos-slenis
Tags: one-column, custom-logo, accessibility-ready
*/

/* Minimal theme CSS — Tailwind handles most styling via CDN */
body { margin: 0; }

/* Hero background (SVG inline, similar to original) */
.hero-bg {
	background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.3)), url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 600"><defs><linearGradient id="skyGrad" x1="0%" y1="0%" x2="0%" y2="100%"><stop offset="0%" style="stop-color:%23e8f4f8;stop-opacity:1" /><stop offset="100%" style="stop-color:%23d1e7dd;stop-opacity:1" /></linearGradient><linearGradient id="mountainGrad" x1="0%" y1="0%" x2="0%" y2="100%"><stop offset="0%" style="stop-color:%234a7c59;stop-opacity:1" /><stop offset="100%" style="stop-color:%232d5016;stop-opacity:1" /></linearGradient></defs><rect fill="url(%23skyGrad)" width="1200" height="600"/><path fill="url(%23mountainGrad)" d="M0 350c150-30 300-80 450-60s300 50 450 30s300-20 300 0v270H0z"/><path fill="%232d5016" opacity="0.8" d="M0 400c200-40 400-20 600-10s400 20 600 10v200H0z"/><rect fill="%23654321" x="100" y="380" width="8" height="40"/><rect fill="%23654321" x="200" y="370" width="6" height="50"/><rect fill="%23654321" x="950" y="375" width="10" height="45"/><circle fill="%23228B22" cx="105" cy="375" r="15"/><circle fill="%23228B22" cx="203" cy="365" r="12"/><circle fill="%23228B22" cx="955" cy="370" r="18"/></svg>');
	background-size: cover;
	background-position: center;
}

.fade-in { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease, transform 0.6s ease; }
.fade-in.visible { opacity: 1; transform: translateY(0); }

/* Keep colors consistent if Tailwind isn't available yet */
.text-nature-green { color: #2d5016; }
.bg-nature-green { background-color: #2d5016; }
.bg-light-green { background-color: #4a7c59; }
.bg-earth-brown { background-color: #8b4513; }

/* Google Maps container sizing */
#siteMapInner { width: 100%; height: 16rem; position: relative; }
@media (min-width: 768px) {
	#siteMapInner { height: 24rem; }
}

/* Typography & layout polish */
:root{
	--base-font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
	--heading-color: #123017;
}
body { font-family: var(--base-font); color: #223; -webkit-font-smoothing:antialiased; }
h1,h2,h3 { color: var(--heading-color); }

/* Hero tweaks: darker overlay, subtle vignette */
.hero-bg::after{
	content: '';
	position: absolute; left:0; right:0; top:0; bottom:0;
	background: linear-gradient(180deg, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.25) 60%, rgba(0,0,0,0.35) 100%);
	pointer-events: none;
}

/* Section spacing and subtle separators */
section { padding-top: 3.5rem; padding-bottom: 3.5rem; }
@media (min-width: 768px){ section { padding-top: 5rem; padding-bottom: 5rem; } }

/* Section divider line (optional utility) */
.section-divider{ height:1px; background: linear-gradient(90deg, rgba(0,0,0,0), rgba(34,83,62,.18), rgba(0,0,0,0)); margin: 2rem 0; }

/* Card polish */
.rounded-xl{ border-radius: 0.75rem; }
.shadow-lg{ box-shadow: 0 10px 25px rgba(0,0,0,.08); }
.shadow-lg:hover{ transform: translateY(-6px); transition: transform .28s ease; }
.bg-warm-beige{ background:#f5f5dc; }
.text-earth-brown{ color:#8b4513; }

/* Buttons refinement */
.btn-cta{ background: linear-gradient(90deg, #4a7c59, #2d5016); color: #fff; padding: .75rem 1.25rem; border-radius: .5rem; font-weight:600; display:inline-block; text-align:center; }
.btn-outline{ border:2px solid #2d5016; color: #2d5016; padding: .75rem 1.25rem; border-radius:.5rem; font-weight:600; background:#fff; display:inline-block; text-align:center; }
.btn-outline:hover{ background:#2d5016; color:#fff; }

/* Small responsive fixes */
@media (max-width: 640px){
	.hero-bg { min-height: 60vh; }
	.text-5xl { font-size: 2.25rem; }
}

/* Slight card lift for hover */
.shadow-lg:hover{ transform: translateY(-6px); transition: transform .28s ease; }

/* Improved Rooms Section Styles */
#rooms {
    background-color: #f9f9f9;
    padding: 4rem 0;
}
#rooms h2 {
    font-size: 2.5rem;
    margin-bottom: 2rem;
    color: #2c3e50;
}
.room-card {
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.room-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}
.room-card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}
.room-card .content {
    padding: 1.5rem;
    text-align: center;
}
.room-card .content h3 {
    font-size: 1.5rem;
    margin-bottom: 1rem;
    color: #34495e;
}
.room-card .content p {
    font-size: 1rem;
    line-height: 1.6;
    color: #7f8c8d;
    margin-bottom: 1.5rem;
}
.room-card .content .price {
    font-size: 1.25rem;
    font-weight: bold;
    color: #27ae60;
}
.room-card .content .btn {
    display: inline-block;
    margin-top: 1rem;
    padding: 0.75rem 1.5rem;
    font-size: 1rem;
    color: #ffffff;
    background-color: #27ae60;
    border-radius: 4px;
    text-decoration: none;
    transition: background-color 0.3s ease;
}
.room-card .content .btn:hover {
    background-color: #2ecc71;
}

/* Why Choose Us Section */
#why-choose-us {
    background: linear-gradient(to right, #38b2ac, #4299e1);
    color: white;
    padding: 5rem 0;
    text-align: center;
}
#why-choose-us h2 {
    font-size: 2.5rem;
    font-weight: bold;
    margin-bottom: 2rem;
}
#why-choose-us .grid div {
    background: white;
    color: #2d3748;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
}

/* Testimonials Section */
#testimonials {
    background: #f7fafc;
    padding: 5rem 0;
    text-align: center;
}
#testimonials h2 {
    font-size: 2.5rem;
    font-weight: bold;
    margin-bottom: 2rem;
}
#testimonials .grid div {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
}
#testimonials .grid div p {
    font-style: italic;
}
#testimonials .grid div h4 {
    margin-top: 1rem;
    font-weight: bold;
}

/* Hero Section */
#hero {
    position: relative;
    height: 100vh;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    text-align: center;
}
#hero .btn-cta {
    background-color: #38b2ac;
    color: white;
    padding: 0.75rem 1.5rem;
    border-radius: 0.375rem;
    text-transform: uppercase;
    font-weight: bold;
    transition: background-color 0.3s;
}
#hero .btn-cta:hover {
    background-color: #2c7a7b;
}
#hero .btn-outline {
    border: 2px solid white;
    color: white;
    padding: 0.75rem 1.5rem;
    border-radius: 0.375rem;
    text-transform: uppercase;
    font-weight: bold;
    transition: background-color 0.3s, color 0.3s;
}
#hero .btn-outline:hover {
    background-color: white;
    color: #2c7a7b;
}

/* Ensure Hero Text is White */
#hero h1 {
    color: white !important; /* Force hero text color to white */
}

/* Hero Slider */
.hero-slider{ position:relative; }
.hero-slider .hero-slide{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition: opacity .8s ease; }
.hero-slider .hero-slide.active{ opacity:1; }
.hero-arrow{ position:absolute; top:50%; transform:translateY(-50%); background:rgba(0,0,0,.35); color:#fff; border:none; width:44px; height:44px; border-radius:999px; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:20; }
.hero-arrow:hover{ background:rgba(0,0,0,.5); }
.hero-arrow.prev{ left:16px; }
.hero-arrow.next{ right:16px; }
.hero-dots{ position:absolute; bottom:18px; left:50%; transform:translateX(-50%); display:flex; gap:8px; z-index:20; }
.hero-dot{ width:10px; height:10px; border-radius:999px; background:rgba(255,255,255,.6); border:1px solid rgba(0,0,0,.15); }
.hero-dot.active{ background:#fff; }

/* Rooms – Booking style */
#rooms{ background:#f9fafb; }
#rooms h2{ color:#123017; }
.rooms-list .room-item{ border:1px solid #e5e7eb; }
.room-badges .badge{ font-size:.75rem; padding:.25rem .5rem; border-radius:.375rem; }
.price-panel .rating-badge{ display:inline-flex; align-items:center; justify-content:center; width:2.25rem; height:2.25rem; border-radius:.5rem; background:#2d5016; color:#fff; font-weight:700; }
.price-panel .btn-cta{ width:100%; }
.price-panel .btn-outline{ width:100%; }

/* Modal polish */
.chip{ display:inline-flex; align-items:center; gap:.375rem; padding:.35rem .6rem; border-radius:999px; background:#f1f5f9; color:#0f172a; font-size:.8125rem; }
.dot{ width:.4rem; height:.4rem; background:#16a34a; border-radius:999px; display:inline-block; }
.policy-card{ background:#f9fafb; border:1px solid #eef2f7; border-radius:.75rem; padding:1rem; }
.rating-badge{ display:inline-flex; align-items:center; justify-content:center; width:2.25rem; height:2.25rem; border-radius:.5rem; background:#2d5016; color:#fff; font-weight:700; }

/* Contact Section with Preferred Format */
#contact {
    background-color: #22543d; /* Dark green background */
    color: white;
    padding: 5rem 0;
}
#contact h2 {
    font-size: 2rem; /* Adjusted heading size */
    font-weight: bold;
    margin-bottom: 1.5rem;
}
#contact h3 {
    color: white; /* Changed text color to white */
}
#contact ul {
    list-style: none;
    padding: 0;
}
#contact ul li {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}
#contact ul li .material-icons {
    font-size: 1.5rem; /* Reduced icon size */
    color: #f6e05e;
}
#contact ul li p {
    font-size: 1rem; /* Reduced text size */
    margin: 0;
}
#contact .flex a {
    font-size: 1.5rem; /* Reduced social media icon size */
    color: #f6e05e;
    transition: color 0.3s;
}
#contact .flex a:hover {
    color: #ecc94b;
}
#siteMap { position: relative; overflow: hidden; z-index: 0; }
#siteMapInner {
    width: 100%;
    height: 16rem;
    position: relative; /* ensure Google Map children (absolute) are scoped */
    overflow: hidden; /* prevent map overlays from spilling and blocking clicks */
    background-color: #e2e8f0;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Make sure social links remain clickable above nearby content */
.social-links{ position: relative; z-index: 60; }
.social-links a{ position: relative; z-index: 70; pointer-events: auto; cursor: pointer; }

/* Ensure the whole contact info column sits above map or other positioned elements */
.contact-info-col{ position: relative; z-index: 50; }

/* Contact grid fallback in case Tailwind classes aren’t loaded on production */
.contact-grid{ display:grid; grid-template-columns: 1fr; gap: 3rem; }
@media (min-width: 768px){ .contact-grid{ grid-template-columns: 1fr 1fr; } }

/* Ensure All Contact Section Headings Are White */
#contact h2, #contact h3 {
    color: white !important; /* Force text color to white */
}

/* Services – Professional Cards */
.services-section .service-card{ position:relative; background:#fff; border-radius:1rem; overflow:hidden; box-shadow:0 10px 25px rgba(0,0,0,.08); transition: transform .28s ease, box-shadow .28s ease; display:flex; flex-direction:column; }
.services-section .service-card:hover{ transform: translateY(-6px); box-shadow:0 16px 32px rgba(0,0,0,.12); }
.services-section .service-media{ position:relative; width:100%; height:220px; background:#e8eef0; }
.services-section .service-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.services-section .service-media-placeholder{ width:100%; height:100%; background:linear-gradient(135deg, #e8f0eb, #dfe7e2); }
.services-section .service-media-fallback-icon{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.services-section .service-media-fallback-icon svg{ width:56px; height:56px; color:#fff; }
.services-section .service-media-overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0.0) 35%, rgba(0,0,0,0.35) 100%); pointer-events:none; }
.services-section .service-body{ padding:1.25rem 1.25rem 1.5rem; display:flex; flex-direction:column; gap:.5rem; }
.services-section .service-title{ font-size:1.25rem; font-weight:800; color:#123017; }
.services-section .service-title a{ color:inherit; text-decoration:none; }
.services-section .service-title a:hover{ text-decoration:underline; }
.services-section .service-desc{ color:#4b5563; line-height:1.6; min-height:3.5rem; }
.services-section .service-cta{ margin-top:.5rem; }

/* Trust strip styles */
#trust{ background:#fff; }
#trust .trust-item{ transition: transform .25s ease, box-shadow .25s ease; }
#trust .trust-item:hover{ transform: translateY(-4px); box-shadow:0 12px 24px rgba(0,0,0,.10); }
#trust .trust-title{ font-size:1.05rem; }
#trust .trust-desc{ line-height:1.5; }
/* Fallback grid for trust if Tailwind absent */
#trust .grid{ display:grid; grid-template-columns: 1fr; gap:1rem; }
@media (min-width: 640px){ #trust .grid{ grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px){ #trust .grid{ grid-template-columns: 1fr 1fr 1fr 1fr; } }