/* βασικές μεταβλητές για τα χρώματα και τις διαστάσεις */
:root{
  --backgroundColor: #fbf8f2;
  --cardColor: #fff;
  --textColorMuted: #6b6b6b;
  --accentWarm: #b76b49;
  --pineGreen: #1f4d3d;
  --accentRed: #9b1b1b;
  --maxWidth: 1100px;
  --borderRadius: 14px;
  --shadowEffect: 0 8px 24px rgba(20,20,20,0.06);
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
}

/* Όλα τα βασικά κείμενα */
body, p, h2, h3, h4, h5, h6, label, li, span, a {
  font-family: 'Garamond', serif;
}

/* Ονόματα στην αρχή (Hero) */
.hero-names {
  font-family: 'Brush Script MT', cursive;
}

#scedule{
  text-align: justify;
  text-justify: inter-word;
}
/* Βασικό reset */
*{box-sizing:border-box}
html,body{height:100%}
body {
  text-align: justify;
  text-justify: inter-word;
  margin: 0;
  background-color: var(--backgroundColor); /* #fbf8f2 */

  background-image:
    /* Radial πιο αχνό και μεγαλύτερο */
    radial-gradient(circle at 50% -20%, rgba(255, 255, 255, 0.7) 0%, transparent 90%),
    /* απαλές μεταβάσεις */
    linear-gradient(160deg, var(--backgroundColor) 0%, #f9f5f0 70%, #f6eee9 100%);

  background-attachment: fixed; 
  color: #222;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  line-height: 1.6;
  font-size: 16px;
}

.flower {
  position: fixed;
  width: 20vw;
  height: 20vw;
  background: url("background-remove.png") no-repeat center;
  background-size: contain;
  opacity: 0.4;
  pointer-events: none;
  z-index: 0;
}

.flower-top-left {
  top: 0;
  left: 0;
}

.flower-bottom-right {
  bottom: 0;
  right: 0;
}


* {box-sizing:border-box}
/* Slideshow container */
.slideshow-container {
  max-width: 300px;
  position: relative;
  margin: auto;
}

/* Hide the images by default */
.mySlides {
  display: none;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

/* Απόκρυψη σελίδας μέχρι να μπει ο κωδικός */
.hidden{display:block}
#page.hidden{display:none}

/* Στυλ για την οθόνη κωδικού */
.overlay{
  position:fixed; inset:0; display:flex; align-items:center; justify-content:center;
  background: linear-gradient(180deg, rgba(8,8,8,0.6), rgba(8,8,8,0.65));
  z-index:9999;
  padding:24px;
}
.overlay.hidden{display:none}

/* --- ΒΕΛΤΙΩΜΕΝΟ ΠΛΑΙΣΙΟ ΚΩΔΙΚΟΥ --- */
.overlay-card{
  width:100%; max-width:480px;
  background: rgba(251, 248, 242, 0.85); /* Ημιδιάφανο φόντο */
  backdrop-filter: blur(10px); /* Εφέ "παγωμένου τζαμιού" */
  padding:32px; border-radius:12px; box-shadow: var(--shadowEffect);
  text-align:center;
  font-family: 'Playfair Display', serif;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.overlay-card h2{margin:0 0 8px; font-size:24px;}
.overlay-card p{margin:4px 0 16px; color:var(--textColorMuted)}
#pwInput{
  width:100%; padding:10px 12px; border-radius:8px; border:1px solid #e6e0d6; font-size:16px;
}
#pwInput.error{border-color:#d44}
.overlay-actions{margin-top:12px}
#pwBtn{
  padding:10px 20px; border-radius:8px; border:0; background:var(--pineGreen); color:white; cursor:pointer;
}
.pw-hint{margin-top:16px; color:#8b8b8b; font-size:13px}

/* Το βασικό container */
.container{width:90%; max-width:var(--maxWidth); margin:0 auto}

/* Header & Navigation */
.site-header{
  position:sticky; top:0; z-index:40;
  backdrop-filter: blur(6px); /* θολό εφέ */
  background: rgba(255,255,255,0.5);
  border-bottom:1px solid rgba(20,20,20,0.035);
}
.header-grid{display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:14px 0}
.logo{font-family:'Playfair Display', serif; font-size:20px; color:var(--pineGreen); text-decoration:none}
.main-nav a{margin-left:16px; color:var(--textColorMuted); text-decoration:none; font-weight:600; font-size:14px}

/* Κεντρική ενότητα (Hero) */
.hero-section{padding:48px 0 84px; position:relative; overflow:hidden}
.hero-content{display:grid; grid-template-columns:1fr; gap:28px; align-items:center} /* Αλλαγή σε 1fr */
.hero-names{font-family:'Playfair Display',serif; font-size:52px; margin:0 0 8px; color:var(--pineGreen); line-height: 1.2;}
.hero-subtitle{font-size: 20px; margin: 0 0 12px; color:var(--textColorMuted)}
.date{font-weight:600; color:var(--accentWarm); margin-bottom:24px}
.cta-button{display:inline-block; padding:12px 24px; border-radius:999px; background:var(--accentWarm); color:white; text-decoration:none; font-weight:600; box-shadow:0 6px 18px rgba(183,107,73,0.18)}

/* Γενικό στυλ για κάθε ενότητα */
.section-layout{padding:64px 0}
.alt-background{background: linear-gradient(180deg, rgba(246,242,237,0.6), rgba(255,255,255,0.6));}

/* Διάταξη με κείμενο και φωτογραφία (Η ιστορία μας) */
.split-layout{display:flex; gap:32px; align-items:center}
.split-layout .text-content{flex:1}
.split-layout .photo-container{width:240px; flex-shrink:0}
.split-layout img{width:100%; height:auto; display:block; border-radius:12px; box-shadow:var(--shadowEffect); object-fit:cover; border:6px solid rgba(255,255,255,0.6)}

/* Πλαίσιο με κεντραρισμένο περιεχόμενο (Πληροφορίες, Λίστα Γάμου) */
.focus-box{max-width:820px; margin:0 auto; text-align:center; padding:32px; border-radius:12px; background:var(--cardColor); box-shadow:var(--shadowEffect); position: relative;}
.date-highlight {font-weight: 700; color: var(--pineGreen); margin-top: 20px;}

.details-columns {display: flex; justify-content: center; gap: 40px; margin-top: 20px;}
.details-columns .details-group {flex: 1; max-width: 250px;}
.ceremony-details {margin-bottom: 10px;}
.details-group h3 {font-family: 'Playfair Display', serif; font-size: 20px; color: var(--accentWarm); margin-top: 20px; margin-bottom: 5px;}
.details-group p {margin: 5px 0; color: var(--textColorMuted);}
.details-group a {color: var(--accentRed); text-decoration: underline;}

/* Στυλ για το Timeline */
.section-title{text-align:center; font-family:'Playfair Display',serif; font-size:32px; margin-bottom:40px; color:var(--pineGreen);}
.timeline{position:relative; padding-left:60px; margin:0 auto; max-width:700px;}
.timeline::before{content:""; position:absolute; top:0; left:25px; width:2px; height:100%; background:var(--pineGreen);}
.timeline-date{font-weight:700; margin-bottom:20px; color:var(--accentWarm);}
.event{position:relative; margin-bottom:40px;}
.event::before{content:""; position:absolute; left:-36px; top:6px; width:12px; height:12px; background:var(--pineGreen); border-radius:50%;}
.event .time{font-weight:700; color:var(--pineGreen); margin-bottom:8px;}
.event .content h3{margin:0 0 6px; font-size:18px; color:#222; display: flex; align-items: center; gap: 8px;}
.event .content p{margin:0 0 8px; font-size:15px; color:var(--textColorMuted);}

/* Ενότητα FAQ */
.faq-container {margin-top: 30px; display: grid; gap: 20px;}
.faq-item {background: var(--cardColor); padding: 25px; border-radius: var(--borderRadius); box-shadow: var(--shadowEffect);}
.faq-item h3 {font-size: 18px; color: var(--pineGreen); margin: 0 0 10px;}
.faq-item p {font-size: 15px; color: var(--textColorMuted); margin-bottom: 8px;}
.faq-item a {color: var(--accentRed); font-weight: bold;}

/* Ενότητα RSVP */
.rsvp-section{text-align:center}
.rsvp-actions{margin-top:24px}
.outline-button{display:inline-block; padding:12px 24px; border-radius:999px; border:2px solid var(--pineGreen); color:var(--pineGreen); text-decoration:none; font-weight:700}

/* Αντίστροφη Μέτρηση */
.countdown-container{text-align:center}
.countdown-grid{display:flex; gap:18px; justify-content:center; margin-top:18px; flex-wrap:wrap}
.count-box{background:var(--cardColor); padding:18px 22px; border-radius:10px; min-width:110px; box-shadow:var(--shadowEffect)}
.count-box span{display:block; font-size:28px; font-weight:700; color:var(--pineGreen)}
.count-box small{display:block; color:var(--textColorMuted); margin-top:6px}

/* Footer (Επικοινωνία) */
.site-footer{padding:40px 0}
.footer-grid{display:flex; justify-content:space-between; align-items:center}
.contact-info h3{font-family:'Playfair Display', serif; font-size:22px; color: var(--accentWarm); margin:0 0 10px}
.contact-info p{margin:4px 0}

/* Responsive για μικρότερες οθόνες */
@media (max-width:900px){
  .hero-content{grid-template-columns:1fr; text-align:center}
  .split-layout{flex-direction:column-reverse}
  .split-layout .photo-container{width:60%}
  .main-nav{display:none}
  .header-grid{padding:10px 0}
  .details-columns {flex-direction: column; align-items: center; gap: 10px;}
}

/* Βοηθητικές κλάσες */
.muted{color:var(--textColorMuted)}
.small{font-size:13px}