/* ==========================================================================
   GLOBALNE FORMULARZE (contact.css)
   Obsługuje:
   1. Formularz statyczny (index.php, kontakt.php)
   2. Formularz "znikający" / Modal (Lumi, Orto, Materiały)
   ========================================================================== */

/* --------------------------------------------------------------------------
   CZĘŚĆ 1: FORMULARZ STATYCZNY (używa klas z index.php)
   -------------------------------------------------------------------------- */
   /* ==========================================================================
      MASTER CONTACT STYLES - Wersja Architektoniczna
      ========================================================================== */

   /* --- 1. FORMULARZ STATYCZNY (index.php, kontakt.php) --- */

   /* ==========================================================================
      MASTER CONTACT STYLES - WERSJA PRESTIŻOWA (SOLID PREMIUM)
      ========================================================================== */

   /* --- 1. FORMULARZ STATYCZNY (index.php, kontakt.php) --- */

   .contact-section:not(.as-modal) {
       padding: 100px 0;
      /* background-color: #fcfcfc; /* Bardzo delikatny odcień bieli dla kontrastu */
   }

   .contact-section:not(.as-modal) .container {
       max-width: 850px;
       margin: 0 auto;
       padding: 40px;
       background: #ffffff;
       box-shadow: 0 30px 60px rgba(0,0,0,0.05); /* Subtelna rama bez ramy */
   }

   .contact-main-title {
       font-size: 2.2rem;
       font-weight: 700; /* Mocniejszy nagłówek */
       text-transform: uppercase;
       letter-spacing: 1px;
       color: #060912;
       text-align: center;
       margin-bottom: 10px;
   }

   .contact-subtitle {
       font-size: 1rem;
       color: #64748b;
       text-align: center;
       margin-bottom: 50px;
       font-weight: 400;
   }

   /* Siatka pól */
   .contact-form .form-grid {
       display: grid;
       grid-template-columns: repeat(2, 1fr);
       gap: 20px;
   }

   @media (max-width: 768px) {
       .contact-form .form-grid {
           grid-template-columns: 1fr;
       }
   }

   .form-group.full-width {
       grid-column: 1 / -1;
   }

   /* Wygląd pól - Solidny i konkretny */
   .contact-form input[type="text"],
   .contact-form input[type="email"],
   .contact-form input[type="tel"],
   .contact-form textarea {
       width: 100%;
       padding: 18px 20px;
       background-color: #f8fafc; /* Subtelne tło pola */
       border: 1px solid #e2e8f0;
       font-family: 'Montserrat', sans-serif;
       font-size: 0.95rem;
       color: #060912;
       outline: none;
       transition: all 0.3s ease;
   }

   .contact-form input:focus,
   .contact-form textarea:focus {
       background-color: #ffffff;
       border-color: #a10510; /* Twój czerwony akcent */
       box-shadow: 0 0 0 4px rgba(161, 5, 16, 0.05);
   }

   /* Załącznik */
   .file-input-wrapper {
       margin-top: 5px;
   }

   #file-upload { display: none; }

   .custom-file-upload {
       display: inline-block;
       padding: 10px 0;
       color: #a10510;
       font-weight: 700;
       font-size: 0.8rem;
       text-transform: uppercase;
       cursor: pointer;
   }

   /* --- 4. Przycisk wysyłki - PRESTIŻ I LEKKOŚĆ --- */

 .submit-btn {
     width: 100%;
     margin-top: 40px;
     padding: 18px 30px;         /* Niższy profil dla lepszej elegancji */
     background-color: #060912;  /* Głęboka czerń jako fundament */
     color: #ffffff;
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: 5px;        /* Duży odstęp między literami to klucz do stylu premium */
     font-size: 0.75rem;         /* Nieco mniejszy font przy dużym rozstrzeleniu wygląda szlachetniej */
     border: 1px solid #060912;
     cursor: pointer;
     transition: all 0.5s cubic-bezier(0.2, 1, 0.3, 1);
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 15px;
 }

 .submit-btn:hover {
     background-color: transparent;
     color: #a10510;             /* Twój czerwony akcent pojawia się dopiero przy akcji */
     border-color: #a10510;
     letter-spacing: 7px;        /* Efekt "oddechu" przy najechaniu */
 }

 .submit-btn i {
     font-size: 0.9rem;
     transition: transform 0.4s ease;
 }

 .submit-btn:hover i {
     transform: translateX(5px); /* Subtelny ruch ikony dodaje dynamiki */
 }

   /* --- 2. FORMULARZ ZNIKAJĄCY / MODAL (Lumi, Orto) --- */

   .contact-section.as-modal {
       display: none;
       position: fixed;
       inset: 0;
       width: 100%;
       height: 100%;
       background-color: rgba(6, 9, 18, 0.95);
       z-index: 10000;
       justify-content: center;
       align-items: center;
       padding: 20px;
       opacity: 0;
       transition: opacity 0.4s ease;
   }

   .contact-section.as-modal.active {
       display: flex !important;
       opacity: 1;
   }

   .contact-section.as-modal .contact-container {
       background: #ffffff;
       padding: 50px;
       max-width: 600px;
       width: 100%;
       position: relative;
       box-shadow: 0 40px 100px rgba(0,0,0,0.5);
       text-align: center;
   }

   .close-form-modal {
       position: absolute;
       top: 20px;
       right: 20px;
       font-size: 2rem;
       cursor: pointer;
       color: #94a3b8;
   }

   .refined-input {
       width: 100%;
       padding: 15px;
       background-color: #f8fafc;
       border: 1px solid #e2e8f0;
       margin-bottom: 15px;
       outline: none;
   }

   .refined-input:focus {
       border-color: #a10510;
   }

   .btn-send-modern {
       width: 100%;
       padding: 20px;
       background-color: #a10510;
       color: #fff;
       font-weight: 700;
       text-transform: uppercase;
       border: none;
       cursor: pointer;
   }

   /* --- 2. FORMULARZ ZNIKAJĄCY / MODAL (Lumi, Orto) --- */

   .contact-section.as-modal {
       display: none;
       position: fixed;
       inset: 0;
       width: 100%;
       height: 100%;
       background-color: rgba(6, 9, 18, 0.96);
       z-index: 10000;
       justify-content: center;
       align-items: center;
       padding: 20px;
       opacity: 0;
       transition: opacity 0.4s ease;
   }

   .contact-section.as-modal.active {
       display: flex !important;
       opacity: 1;
   }

   .contact-section.as-modal .contact-container {
       background: #ffffff;
       padding: clamp(2.5rem, 6vw, 60px);
       max-width: 650px;
       width: 100%;
       position: relative;
       max-height: 95vh;
       overflow-y: auto;
       box-shadow: 0 50px 120px rgba(0,0,0,0.5);
       text-align: center;
   }

   .close-form-modal {
       position: absolute;
       top: 30px;
       right: 35px;
       font-size: 2.5rem;
       cursor: pointer;
       line-height: 1;
       color: #94a3b8;
       transition: color 0.3s ease, transform 0.3s ease;
   }

   .close-form-modal:hover {
       color: #1a1a1a;
       transform: rotate(90deg);
   }

   .refined-input {
       width: 100%;
       padding: 15px 0;
       border: none;
       border-bottom: 1px solid #e2e8f0;
       background: transparent;
       font-size: 1.1rem;
       outline: none;
       transition: border-color 0.4s ease;
       margin-bottom: 25px;
   }

   .refined-input:focus { border-bottom-color: var(--clr-accent, #c9a77c); }

   .btn-send-modern {
       width: 100%;
       margin-top: 30px;
       padding: 22px;
       background-color: #1a1a1a;
       color: #ffffff;
       font-weight: 700;
       text-transform: uppercase;
       letter-spacing: 4px;
       border: none;
       cursor: pointer;
       transition: all 0.4s ease;
   }

   .btn-send-modern:hover { background-color: var(--clr-accent, #c9a77c); }

   /* Statusy */
   .form-status {
       display: none;
       padding: 18px;
       margin-top: 25px;
       font-size: 0.9rem;
       text-align: center;
   }

   .form-status.success { display: block; background: #f0fdf4; color: #166534; border: 1px solid #bbf7d0; }
   .form-status.error { display: block; background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
   /* Tutaj był wcześniej błąd nadmiarowej klamry - został usunięty */


/* --------------------------------------------------------------------------
   CZĘŚĆ 2: FORMULARZ ZNIKAJĄCY / MODAL (używa klas z list.php i starych stylów)
   -------------------------------------------------------------------------- */
.contact-section.as-modal {
    display: none;
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(6, 9, 18, 0.94);
    z-index: 10000;
    justify-content: center;
    align-items: center;
    padding: 20px;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.contact-section.as-modal.active {
    display: flex !important;
    opacity: 1;
}

.contact-section.as-modal .contact-container {
    background: #ffffff;
    padding: clamp(2.5rem, 6vw, 50px);
    max-width: 600px;
    width: 100%;
    position: relative;
    max-height: 95vh;
    overflow-y: auto;
    border-radius: 2px;
    box-shadow: 0 40px 100px rgba(0,0,0,0.5);
    text-align: center;
}

.close-form-modal {
    position: absolute;
    top: 25px;
    right: 25px;
    font-size: 2.2rem;
    cursor: pointer;
    line-height: 1;
    color: #94a3b8;
    transition: color 0.3s ease;
}

.close-form-modal:hover {
    color: var(--clr-accent, #c9a77c);
}

/* Pola tekstowe w modalu */
.refined-input {
    width: 100%;
    padding: 14px 0;
    border: none;
    border-bottom: 1px solid #e2e8f0;
    background: transparent;
    font-family: inherit;
    font-size: 1.05rem;
    color: var(--clr-primary, #060912);
    outline: none;
    transition: border-color 0.4s ease;
    margin-bottom: 20px;
}

.refined-input:focus {
    border-bottom-color: var(--clr-accent, #c9a77c);
}

/* Załącznik w modalu */
#modal-file-upload {
    display: none;
}

.custom-file-upload-refined {
    display: block;
    padding: 20px 0;
    text-align: center;
    cursor: pointer;
    border: 1px dashed #cbd5e1;
    border-radius: 2px;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #94a3b8;
    transition: all 0.4s ease;
    margin-top: 10px;
}

.custom-file-upload-refined:hover {
    border-color: var(--clr-accent, #c9a77c);
    color: var(--clr-accent, #c9a77c);
}

/* Przycisk wysyłania w modalu */
.btn-send-modern {
    width: 100%;
    margin-top: 25px;
    padding: 22px;
    background-color: var(--clr-primary, #060912);
    color: #ffffff;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 4px;
    border-radius: 2px;
    transition: all 0.4s ease;
    cursor: pointer;
    border: none;
}

.btn-send-modern:hover {
    background-color: var(--clr-accent, #c9a77c);
    letter-spacing: 5px;
}

/* Status wiadomości */
.form-status {
    display: none;
    padding: 15px;
    margin-top: 20px;
    font-size: 0.85rem;
    text-align: center;
    border-radius: 2px;
}

.form-status.success {
    display: block;
    background-color: #f0fdf4;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.form-status.error {
    display: block;
    background-color: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}
/* Tutaj był wcześniej błąd nadmiarowej klamry - został usunięty */
/* Sekcja informacyjna o prywatności */
.privacy-info-section {
    background-color: #fafafa;
    padding-top: 60px;
    padding-bottom: 60px;
    border-top: 1px solid #eaeaea;
}

/* Kontener centrujący treść */
.privacy-container {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
}

/* Tytuł sekcji */
.privacy-title {
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight: 300;
    margin-bottom: 2rem;
    color: #1a1a1a;
}

/* Główny tekst informacji */
.privacy-text {
    font-size: 0.9rem;
    line-height: 1.8;
    color: #64748b;
    font-weight: 300;
}

/* Responsywność dla mobile */
@media (max-width: 768px) {
    .privacy-info-section {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .privacy-title {
        font-size: 1.1rem;
        letter-spacing: 2px;
    }
}