/* Custom CSS per iTicket Landing Page */

:root {
    --primary-color: #ff161f;
    --primary-dark: #d10e1a;
    --gray-100: #f8f9fa;
    --gray-800: #343a40;
    --gray-900: #212529;
}

/* Override Bootstrap primary color */
:root {
    --bs-primary: var(--primary-color) !important;
    --bs-primary-rgb: 255, 22, 31 !important;
}

.landing .container {
    max-width: 1320px;
}

.landing .btn-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn-primary:hover {
    background-color: var(--primary-dark);
    border-color: var(--primary-dark);
}

.text-primary {
    color: var(--primary-color) !important;
}

.bg-primary {
    background-color: var(--primary-color) !important;
}

header.img-container {
    background-image: url("../1.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: scroll;

}

section.img2-container {
    background-image: url("../33.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: scroll;
}

header.img-container .bg-img {
    width: 100%;
    min-height: 70vh;
    display: flex;
    align-items: center;
    background:linear-gradient(rgba(232, 232, 238, 0.56), rgba(0, 0, 0, 0.57), rgba(197, 197, 202, 0.55))
}

section.img2-container .bg-img {
    width: 100%;
    min-height: 60vh;
    display: flex;
    align-items: center;
    background:linear-gradient(rgba(232, 232, 238, 0.56), rgba(0, 0, 0, 0.57), rgba(197, 197, 202, 0.55))
}


.head-text {

}

/* Hero Section */
.hero-section {
   background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    min-height: 55vh;
    display: flex;
    align-items: center;
  /*  background: url("../1.jpg");
    background-size: cover;
    color: red !important;*/
}

/* Icon circles */
.icon-circle {
    width: 80px;
    height: 80px;
}

/* Hover effects */
.hover-scale {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-scale:hover {
    transform: scale(1.05);
}

.hover-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 1rem 3rem rgba(0,0,0,.175) !important;
}

/* Stats section backdrop blur effect */
.backdrop-blur {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

/* Stat cards animation */
.stat-card {
    transition: transform 0.3s ease;
}

.stat-card:hover {
    transform: translateY(-4px);
}

/* Counter animation */
.counter {
    display: inline-block;
    font-weight: bold;
}

/* Carousel custom styling */
.carousel-control-prev-icon,
.carousel-control-next-icon {
    filter: invert(1);
}

.carousel-indicators button {
    background-color: var(--primary-color);
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in-up {
    animation: fadeInUp 0.8s ease-out;
}

/* Contact Form Styles */
.form-control:focus,
.form-select:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 0.25rem rgba(255, 22, 31, 0.25);
}

.form-check-input:checked {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.form-check-input:focus {
    box-shadow: 0 0 0 0.25rem rgba(255, 22, 31, 0.25);
}

.form-label {
    color: var(--gray-800);
    margin-bottom: 0.75rem;
}

/* Toast positioning */
.toast {
    min-width: 300px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
   /* header.img-container .bg-img {
        min-height: 50vh;
    }*/
    .display-3 {
        font-size: 2.5rem;
    }

    .display-4 {
        font-size: 2rem;
    }

    .hero-section {
        min-height: 70vh;
    }

    .icon-circle {
        width: 60px;
        height: 60px;
    }
}

/* Button focus states */
.btn:focus {
    box-shadow: 0 0 0 0.25rem rgba(255, 22, 31, 0.25);
}

/* Card shadow enhancement */
.card {
    border: none;
}

.shadow-sm {
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
}

.shadow-lg {
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
}

.code-input {
    width: 2.8rem;
    font-size: 1.4rem;
}
.loader {
    width: 32px;
    height: 32px;
    border: 3px solid #D9D9D9;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}
.loader::after {
    content: '';
    box-sizing: border-box;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 3px solid;
    border-color: #FF3D00 transparent;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}