html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
    font-family: Arial, sans-serif;
    background-color: #f9f9f9;
    background-image: url('../img/mk.jpg'); /* Ścieżka do obrazu */
    background-attachment: fixed; /* Tło pozostaje nieruchome */
    background-size: cover; /* Dopasowanie obrazu do całej strony */
    background-position: center; /* Wyśrodkowanie obrazu */
    background-repeat: no-repeat; /* Zapobiega powtarzaniu obrazu */
    margin: 0;
    padding: 0;
    min-height: 100vh; /* Zapewnia pokrycie całej wysokości ekranu */
    z-index: -1; /* Tło za innymi elementami */
}

header .navbar {
    margin-bottom: 1rem;
}

footer {
    margin-top: 2rem;
    background-color: #343a40;
    color: #fff;
    padding: 1rem;
}

.video-container {
    position: relative;
    width: 100%;
    height: 100vh; /* Pełna wysokość ekranu */
    overflow: hidden; /* Ukrycie nadmiaru wideo */
    border-radius: 20px; /* Zaokrąglenie rogów */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.5); /* Subtelny cień */
}
    .video-container::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background-color: rgba(0, 0, 0, 0.6); /* Przyciemnienie wideo (czarna nakładka) */
        z-index: 0; /* Umieszczenie nakładki za treścią */
    }


    .video-container video {
        position: absolute; /* Pozycjonowanie wideo w kontenerze */
        top: 50%;
        left: 50%;
        min-width: 100%;
        min-height: 100%;
        width: auto;
        height: auto;
        transform: translate(-50%, -50%); /* Wyśrodkowanie wideo */
        z-index: -1; /* Wideo za treścią */
        border-radius: 20px; /* Zaokrąglenie rogów */
    }

    .video-container .content {
        position: relative; /* Umieszcza treść w kontekście nad wideo */
        z-index: 1; /* Treść jest na wierzchu */
        color: white; /* Tekst widoczny na tle */
        padding: 20px;
        text-align: center; /* Wyśrodkowanie tekstu */
        padding: 20px;
        top: 50%;
        transform: translateY(-50%);
    }

/* Główny nagłówek */
.main-heading {
    font-size: 2rem;
    font-weight: 200;
    text-transform: uppercase;
    margin: 0;
    color: white; /* Złoty kolor dla głównego tekstu */
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8); /* Wyrazisty cień */
}

/* Podtytuł */
.sub-heading {
    font-size: 4rem;
    margin: 0;
    color: #85ad76;
    text-transform: uppercase;
    font-weight: 1000;
    text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.7); /* Subtelny cień */
}

/* Informacje kontaktowe */
.contact-info {
    font-size: 1.5rem;
    margin-top: 10px;
    color: #d1d1d1; /* Szarawy odcień dla mniej ważnego tekstu */
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); /* Lżejszy cień */
}

.main-heading, .sub-heading, .contact-info {
    text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.7);
}

.content p {
    font-size: 1.2rem; /* Styl podtytułu */
    margin-top: 10px;
    text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5); /* Cień dla tekstu */
}

@media (max-width: 768px) {
    .video-container video {
        display: none; /* Ukryj wideo na urządzeniach mobilnych */
    }

    .video-container {
        background-image: url('/img/arsenal-bg.jpg'); /* Dodaj obraz zapasowy */
        background-size: cover;
        background-position: center;
    }
}

.image-background h1,
.image-background p {
        position: absolute;
        color: white; /* Kolor tekstu */
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
    }


.pricing-section {
    margin: 20px auto;
    max-width: 1200px;
    padding: 20px;
    background-color: #222; /* Ciemniejsze tło sekcji */
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); /* Wyrazisty cień */
    color: #fff; /* Jasny tekst w sekcji */
}

.pricing-heading {
    text-align: center;
    margin-bottom: 20px;
    font-size: 2rem;
    color: #f1c40f; /* Akcent w kolorze złotym */
}

.pricing-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 30px;
    background-color: #333; /* Ciemne tło tabeli */
    color: #fff; /* Jasny tekst */
    border: 1px solid #555; /* Obramowanie tabeli w ciemniejszym odcieniu */
}

    .pricing-table th,
    .pricing-table td {
        padding: 15px; /* Odstęp wewnętrzny */
        text-align: left;
        border: 1px solid #555; /* Obramowanie komórek */
    }

    .pricing-table th {
        background-color: #444; /* Ciemniejsze tło dla nagłówków */
        color: #f1c40f; /* Złoty kolor tekstu nagłówków */
        font-weight: bold;
        text-transform: uppercase;
    }

    .pricing-table tr:nth-child(even) {
        background-color: #3b3b3b; /* Lekko ciemniejsze tło dla parzystych wierszy */
    }

    .pricing-table tr:hover {
        background-color: #555; /* Kolor wiersza przy najechaniu */
    }

.gift-card {
    background-color: #495057;
    color: #f8f9fa;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .gift-card:hover {
        transform: scale(1.05);
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    }

.card-img-top {
    height: 200px;
    object-fit: cover;
}

.btn-primary {
    background-color: #007bff;
    border-color: #007bff;
}

    .btn-primary:hover {
        background-color: #0056b3;
    }
.container-bony {
    background-color: #212529;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

h2-bright {
    color: #ffc107;
}

.contact-section {
    background-color: #333;
    border-radius: 15px; /* Zaokrąglenie rogów całej sekcji */
    color: #fff;
}

    .contact-section h2 {
        font-size: 2rem;
        font-weight: 700;
    }

    .contact-section .form-control {
        background-color: #444;
        color: #fff;
        border: none;
    }

        .contact-section .form-control:focus {
            background-color: #555;
            color: #fff;
            border-color: #007bff;
            box-shadow: none;
        }

text-left {
    text-align: left;
}

text-right {
    text-align: right;
}

.about-section {
    width: 100%;
    padding: 40px 20px;
    margin: 40px 0; /* Dodanie odstępu od innych elementów powyżej i poniżej */
    background-color: #1e1e1e;
    border-radius: 15px; /* Zaokrąglone rogi */
    box-sizing: border-box;
    line-height: 1.6;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
}

    .about-section h1 {
        text-align: center;
        margin-bottom: 20px;
        font-size: 2rem;
        color: #f1c40f; /* Akcent w kolorze złotym */
    }

    .about-section h2 {
        text-align: center;
        margin-top: 40px; /* Większy odstęp nad nagłówkiem */
        margin-bottom: 20px; /* Większy odstęp pod nagłówkiem */
        font-size: 2rem;
        color: #f1c40f; /* Akcent w kolorze złotym */
    }

    .about-section h3 {
        text-align: center;
        margin-top: 40px; /* Większy odstęp nad nagłówkiem */
        margin-bottom: 20px; /* Większy odstęp pod nagłówkiem */
        font-size: 2rem;
        color: #f1c40f; /* Akcent w kolorze złotym */
    }

    .about-section p {
        margin-bottom: 20px;
        color: #cccccc;
    }

.shooting-lanes {
    margin: 20px 0;
    list-style: disc;
    padding-left: 40px;
    color: #b0b0b0;
}

.opening-hours {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
}

    .opening-hours th, .opening-hours td {
        border: 1px solid #444;
        padding: 10px;
        text-align: left;
    }

    .opening-hours th {
        background-color: #333;
        color: #ffffff;
    }

    .opening-hours td {
        background-color: #1e1e1e;
        color: #cccccc;
    }

a {
    color: #6fa8dc;
    text-decoration: none;
}

    a:hover {
        text-decoration: underline;
    }

em {
    color: #aaaaaa;
}

/* Styl dla wrappera */
.custom-wrapper {
    background-color: #121212; /* Tło całego widoku */
    color: #ffffff; /* Jasny kolor tekstu */
    padding: 20px;
    border-radius: 10px;
    font-family: Arial, sans-serif;
}

/* Nagłówek */
.custom-header {
    color: #ffffff;
    text-align: center;
    margin-bottom: 20px;
}

/* Przycisk "Create New" */
.custom-button {
    background-color: #4caf50; /* Zielony kolor przycisku */
    color: #ffffff;
    padding: 10px 15px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

    .custom-button:hover {
        background-color: #81c784; /* Jaśniejszy zielony na hover */
    }

/* Styl tabeli */
.custom-table-container {
    margin-top: 20px;
    overflow-x: auto; /* Obsługa przewijania w poziomie */
}

.custom-table {
    width: 100%;
    border-collapse: collapse;
    background-color: #1e1e1e; /* Kolor tła tabeli */
    border-radius: 8px; /* Zaokrąglone rogi */
    overflow: hidden;
}

    .custom-table thead {
        background-color: #333333; /* Tło nagłówka tabeli */
    }

    .custom-table th {
        color: #ffffff; /* Kolor tekstu w nagłówkach */
        padding: 12px;
        text-align: left;
    }

    .custom-table tbody tr {
        border-bottom: 1px solid #444444; /* Linia pomiędzy wierszami */
    }

        .custom-table tbody tr:nth-child(even) {
            background-color: #242424; /* Kolor dla parzystych wierszy */
        }

        .custom-table tbody tr:hover {
            background-color: #383838; /* Kolor wiersza na hover */
        }

    .custom-table td {
        padding: 12px;
        color: #e0e0e0; /* Kolor tekstu w komórkach */
    }

/* Linki w tabeli */
.custom-link {
    color: #4caf50; /* Zielony kolor linków */
    text-decoration: none;
    font-weight: bold;
}

    .custom-link:hover {
        color: #81c784; /* Jaśniejszy zielony na hover */
        text-decoration: underline;
    }


/* Wrapper dla całej strony Create */
.create-page-wrapper {
    background-color: #1a1a1a; /* Ciemne tło */
    color: #f5f5f5; /* Jasny tekst */
    padding: 20px;
    border-radius: 8px;
    font-family: Arial, sans-serif;
}

/* Nagłówki */
.create-page-header {
    text-align: center;
    color: #ffffff;
    margin-bottom: 15px;
}

.create-page-subheader {
    font-size: 1.2rem;
    color: #b3b3b3;
    margin-bottom: 10px;
}

.create-page-divider {
    border: 1px solid #333333;
    margin-bottom: 20px;
}

/* Styl formularza */
.create-form-container {
    max-width: 600px;
    margin: 0 auto;
    background-color: #252525;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
}

.create-form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.create-form-group {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.create-label {
    font-weight: bold;
    color: #e0e0e0;
}

.create-input {
    padding: 10px;
    border: 1px solid #444444;
    border-radius: 5px;
    background-color: #303030;
    color: #f5f5f5;
}

    .create-input:focus {
        outline: none;
        border-color: #00bcd4;
        box-shadow: 0 0 5px #00bcd4;
    }

/* Walidacja */
.create-validation-summary {
    color: #f44336; /* Czerwony kolor dla błędów */
    font-weight: bold;
    margin-bottom: 15px;
}

.create-validation-message {
    color: #f44336;
    font-size: 0.9rem;
}

/* Przycisk */
.create-button {
    background-color: #2196f3; /* Niebieski przycisk */
    color: #ffffff;
    padding: 10px 15px;
    border: none;
    border-radius: 5px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

    .create-button:hover {
        background-color: #64b5f6; /* Jaśniejszy niebieski */
    }

/*
/* Wrapper dla całej strony Delete */
.delete-page-wrapper {
    background-color: #1a1a1a; /* Ciemne tło */
    color: #f5f5f5; /* Jasny tekst */
    padding: 20px;
    border-radius: 8px;
    font-family: Arial, sans-serif;
}

/* Nagłówki */
.delete-page-header {
    text-align: center;
    color: #ffffff;
    margin-bottom: 15px;
}

.delete-confirmation-text {
    text-align: center;
    font-size: 1.2rem;
    color: #e57373; /* Jasny czerwony */
    margin-bottom: 20px;
}

.delete-subheader {
    font-size: 1.1rem;
    color: #b3b3b3;
    margin-bottom: 10px;
}

.delete-divider {
    border: 1px solid #333333;
    margin-bottom: 20px;
}

/* Szczegóły rekordu */
.delete-details-container {
    background-color: #252525;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 20px;
}

.delete-details {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.delete-label {
    font-weight: bold;
    color: #e0e0e0;
    flex-basis: 20%;
}

.delete-value {
    color: #f5f5f5;
    flex-basis: 75%;
}

/* Formularz */
.delete-form {
    text-align: center;
}

.delete-form-buttons {
    display: flex;
    justify-content: center;
    gap: 15px;
}

.delete-button-danger {
    background-color: #f44336; /* Czerwony przycisk */
    color: #ffffff;
    padding: 10px 15px;
    border: none;
    border-radius: 5px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

    .delete-button-danger:hover {
        background-color: #e57373; /* Jaśniejszy czerwony */
    }

/* Link powrotu */
.delete-link {
    background-color: #2196f3; /* Niebieski przycisk */
    color: #ffffff;
    padding: 10px 15px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

    .delete-link:hover {
        background-color: #64b5f6; /* Jaśniejszy niebieski */
    }
/* Wrapper dla całej strony Details */
.details-page-wrapper {
    background-color: #121212; /* Ciemne tło */
    color: #ffffff; /* Jasny tekst */
    padding: 20px;
    border-radius: 8px;
    font-family: Arial, sans-serif;
}

/* Nagłówki */
.details-page-header {
    text-align: center;
    color: #ffffff;
    margin-bottom: 15px;
}

.details-subheader {
    font-size: 1.2rem;
    color: #b3b3b3;
    margin-bottom: 10px;
}

.details-divider {
    border: 1px solid #333333;
    margin-bottom: 20px;
}

/* Lista szczegółów */
.details-container {
    background-color: #1e1e1e;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 20px;
}

.details-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.details-label {
    font-weight: bold;
    color: #e0e0e0;
    flex-basis: 20%;
}

.details-value {
    color: #f5f5f5;
    flex-basis: 75%;
}

/* Przyciski */
.details-actions {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 20px;
}

.details-button {
    background-color: #4caf50; /* Zielony przycisk */
    color: #ffffff;
    padding: 10px 15px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

    .details-button:hover {
        background-color: #81c784; /* Jaśniejszy zielony */
    }

.details-link {
    background-color: #2196f3; /* Niebieski przycisk */
    color: #ffffff;
    padding: 10px 15px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

    .details-link:hover {
        background-color: #64b5f6; /* Jaśniejszy niebieski */
    }
/* Wrapper dla strony Edit */
.edit-page-wrapper {
    background-color: #1a1a1a; /* Ciemne tło */
    color: #ffffff; /* Jasny tekst */
    padding: 20px;
    border-radius: 8px;
    font-family: Arial, sans-serif;
}

/* Nagłówki */
.edit-page-header {
    text-align: center;
    color: #ffffff;
    margin-bottom: 15px;
}

.edit-subheader {
    font-size: 1.2rem;
    color: #b3b3b3;
    margin-bottom: 10px;
}

.edit-divider {
    border: 1px solid #333333;
    margin-bottom: 20px;
}

/* Formularz */
.edit-form-container {
    max-width: 600px;
    margin: 0 auto;
    background-color: #252525;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
}

.edit-form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.edit-form-group {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.edit-label {
    font-weight: bold;
    color: #e0e0e0;
}

.edit-input {
    padding: 10px;
    border: 1px solid #444444;
    border-radius: 5px;
    background-color: #303030;
    color: #f5f5f5;
}

    .edit-input:focus {
        outline: none;
        border-color: #4caf50;
        box-shadow: 0 0 5px #4caf50;
    }

/* Walidacja */
.edit-validation-summary {
    color: #f44336; /* Czerwony kolor dla błędów */
    font-weight: bold;
    margin-bottom: 15px;
}

.edit-validation-message {
    color: #f44336;
    font-size: 0.9rem;
}

/* Przyciski */
.edit-form-actions {
    display: flex;
    justify-content: space-between;
    gap: 15px;
}

.edit-button-save {
    background-color: #4caf50; /* Zielony przycisk */
    color: #ffffff;
    padding: 10px 15px;
    border-radius: 5px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s ease;
    border: none;
}

    .edit-button-save:hover {
        background-color: #81c784; /* Jaśniejszy zielony */
    }

.edit-link {
    background-color: #2196f3; /* Niebieski przycisk */
    color: #ffffff;
    padding: 10px 15px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: background-color 0.3s ease;
}

    .edit-link:hover {
        background-color: #64b5f6; /* Jaśniejszy niebieski */
    }
/* Ogólne ustawienia */
.body-strzelnica {
    background-color: #181818;
    color: #e0e0e0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 0;
    padding: 20px;
}

.header-strzelnica {
    text-align: center;
    font-size: 2.8rem;
    margin-bottom: 25px;
    color: #ffa726;
}

/* Ogólne ustawienia */
.body-strzelnica {
    background-color: #181818;
    color: #e0e0e0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 0;
    padding: 20px;
}

.header-strzelnica {
    text-align: center;
    font-size: 2.8rem;
    margin-bottom: 30px;
    color: #ffa726;
}

/* Kontener szczegółów broni */
.weapon-details-container {
    max-width: 900px;
    margin: 20px auto;
    padding: 25px;
    background-color: #242424;
    border-radius: 15px;
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.7);
    color: #e0e0e0;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .weapon-details-container:hover {
        transform: scale(1.02);
        box-shadow: 0 12px 18px rgba(0, 0, 0, 0.9);
    }


/* Nagłówek szczegółów broni */
.weapon-header {
    text-align: center;
    margin-bottom: 25px;
}

.weapon-details-title {
    font-size: 2.8rem;
    color: #ffa726;
    margin-bottom: 10px;
    text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
}

.weapon-details-type,
.weapon-details-caliber {
    font-size: 1.4rem;
    margin: 5px 0;
    color: #dcdcdc;
}


/* Opis broni */
.weapon-description {
    margin-top: 25px;
    border-top: 2px solid #333333;
    padding-top: 20px;
}

.weapon-description-title {
    font-size: 2rem;
    color: #ffa726;
    margin-bottom: 15px;
}

.weapon-description-content {
    font-size: 1.2rem;
    line-height: 1.8;
    color: #cccccc;
    text-align: justify;
}


/* Galeria zdjęć */
.weapon-images-section {
    margin-top: 40px;
    border-top: 2px solid #333333;
    padding-top: 20px;
}

.weapon-images-title {
    font-size: 2rem;
    color: #ffa726;
    margin-bottom: 15px;
}

.weapon-images-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    margin-top: 20px;
}

.weapon-image-container {
    background-color: #1e1e1e;
    padding: 15px;
    border-radius: 12px;
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.7);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .weapon-image-container:hover {
        transform: scale(1.05);
        box-shadow: 0 8px 12px rgba(0, 0, 0, 0.9);
    }

.weapon-gallery-image {
    max-width: 200px;
    border-radius: 10px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .weapon-gallery-image:hover {
        transform: scale(1.15);
        box-shadow: 0 6px 10px rgba(0, 0, 0, 0.9);
    }


/* Przyciski */
.weapon-buttons {
    margin-top: 40px;
    text-align: center;
}

.weapon-back-button {
    display: inline-block;
    background-color: #ffa726;
    color: #181818;
    padding: 14px 30px;
    text-decoration: none;
    border-radius: 10px;
    font-size: 1.3rem;
    font-weight: bold;
    transition: background-color 0.3s ease, transform 0.3s ease;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.5);
}

    .weapon-back-button:hover {
        background-color: #e68a00;
        transform: scale(1.05);
        box-shadow: 0 6px 8px rgba(0, 0, 0, 0.7);
    }

/* Siatka kart */
.weapon-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 30px;
    padding: 0 20px;
}

/* Styl pojedynczej karty */
.weapon-card {
    background-color: #242424;
    border: 1px solid #333333;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.7);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .weapon-card:hover {
        transform: scale(1.05);
        box-shadow: 0 12px 18px rgba(0, 0, 0, 0.9);
    }


/* Obraz w karcie */
.weapon-card-image-container {
    width: 100%;
    aspect-ratio: 16 / 9; /* Zapewnia proporcje obrazu */
    overflow: hidden;
    position: relative;
    background-color: #1e1e1e;
}

.weapon-card-image {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Obraz dopasowany do kontenera */
    display: block;
    transition: transform 0.3s ease;
}

.weapon-card:hover .weapon-card-image {
    transform: scale(1.1);
}


/* Zawartość karty */
.weapon-card-content {
    padding: 20px;
    text-align: center;
}

.weapon-card-title {
    font-size: 2rem;
    color: #ffa726;
    margin-bottom: 15px;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
}

.weapon-card-type,
.weapon-card-caliber {
    font-size: 1.4rem;
    margin: 5px 0;
    color: #dcdcdc;
}

.weapon-card-description {
    font-size: 1.1rem;
    color: #b0b0b0;
    margin: 10px 0;
    height: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
}


/* Przycisk szczegółów */
.weapon-card-button {
    display: inline-block;
    background-color: #ffa726;
    color: #181818;
    padding: 14px 28px;
    margin-top: 15px;
    text-decoration: none;
    border-radius: 10px;
    font-size: 1.2rem;
    font-weight: bold;
    transition: background-color 0.3s ease, transform 0.3s ease;
}

    .weapon-card-button:hover {
        background-color: #e68a00;
        transform: translateY(-2px);
    }


/* Stylizacja unikalna dla Index */
.index-dark-container {
    background-color: #151515;
    color: #f1f1f1;
    padding: 20px;
    border-radius: 16px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

.index-dark-table {
    width: 100%;
    border-collapse: collapse;
    background-color: #1a1a2e;
    border-radius: 12px;
    overflow: hidden;
}

    .index-dark-table th {
        background-color: #23233a;
        color: #e4e4e4;
        padding: 12px;
        text-align: left;
    }

    .index-dark-table td {
        padding: 12px;
        border-bottom: 1px solid #333344;
        color: #d6d6d6;
    }

    .index-dark-table tr:nth-child(even) {
        background-color: #29293d;
    }

    .index-dark-table tr:hover {
        background-color: #35354f;
    }

.index-dark-btn {
    background-color: #2196f3;
    color: #ffffff;
    border: none;
    padding: 8px 16px;
    border-radius: 8px;
    text-decoration: none;
    transition: background-color 0.3s;
}

    .index-dark-btn:hover {
        background-color: #0b79d0;
    }

/* Stylizacja unikalna dla Szczegoly */
.details-dark-container {
    background-color: #141414;
    color: #f0f0f0;
    padding: 20px;
    border-radius: 16px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

.details-dark-header {
    color: #42a5f5;
    margin-bottom: 20px;
}

.details-dark-table {
    width: 100%;
    border-collapse: collapse;
    background-color: #1d1d2f;
    border-radius: 12px;
    overflow: hidden;
}

    .details-dark-table th {
        background-color: #26263d;
        color: #ffffff;
        padding: 12px;
        text-align: left;
    }

    .details-dark-table td {
        padding: 12px;
        border-bottom: 1px solid #3a3a4d;
        color: #e8e8e8;
    }

    .details-dark-table tr:nth-child(even) {
        background-color: #2e2e40;
    }

    .details-dark-table tr:hover {
        background-color: #39395a;
    }


.fade-out {
    opacity: 0;
    transition: opacity 0.5s ease-out;
}