/* Custom Styles for Enhanced Features */

/* --- Global Dark Theme & Cool Effects --- */
body {
    background: linear-gradient(135deg, #0f0c29 0%, #302b63 50%, #24243e 100%);
    color: #e0e0e0;
    font-family: 'Lato', sans-serif;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
    color: #fff;
    text-shadow: 0 0 10px rgba(0, 168, 255, 0.5);
}

p {
    color: #b0b0b0;
}

/* Navbar Enhancements */
.navbar-fixed-top {
    background: rgba(15, 12, 41, 0.9) !important;
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.navbar-brand {
    color: #fff !important;
    text-shadow: 0 0 15px #00a8ff;
    font-weight: bold;
}

.navbar-nav > li > a {
    color: #e0e0e0 !important;
    transition: all 0.3s;
}

.navbar-nav > li > a:hover {
    color: #00a8ff !important;
    text-shadow: 0 0 10px #00a8ff;
}

/* Navbar adjustment for switcher */
.navbar-nav > li.lang-item {
    display: flex;
    align-items: center;
    height: 80px; /* Approximate navbar height */
}

@media (max-width: 767px) {
    .navbar-nav > li.lang-item {
        height: auto;
        padding: 10px 15px;
        display: block;
    }
    .lang-switcher {
        margin-left: 0;
    }
}

/* Hero Section Enhancements */
.home {
    background: transparent; /* Let body gradient show */
}

.home .overlay {
    background: radial-gradient(circle at center, rgba(0, 168, 255, 0.1) 0%, rgba(0, 0, 0, 0.6) 100%);
}

.home h1 {
    font-size: 4.5em;
    background: linear-gradient(to right, #fff, #00a8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: glow 3s infinite alternate;
}

@keyframes glow {
    from { text-shadow: 0 0 10px rgba(0, 168, 255, 0.5); }
    to { text-shadow: 0 0 20px rgba(0, 168, 255, 0.8), 0 0 30px rgba(0, 168, 255, 0.6); }
}

/* Service/Feature Cards Glassmorphism */
.service-item {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 15px;
    padding: 30px;
    transition: transform 0.3s, box-shadow 0.3s;
}

.service-item:hover {
    transform: translateY(-10px);
    box-shadow: 0 10px 30px rgba(0, 168, 255, 0.2);
    border-color: rgba(0, 168, 255, 0.5);
}

.service-item i {
    color: #00a8ff;
    text-shadow: 0 0 15px #00a8ff;
}

/* --- Pricing Section --- */
.pricing-section {
    padding: 100px 0;
    background: transparent; /* Use body gradient */
    position: relative;
    z-index: 10;
}

.pricing-table {
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
    margin-top: 60px;
    perspective: 1000px;
}

@keyframes float-card {
    0% { top: 0px; }
    50% { top: -15px; }
    100% { top: 0px; }
}

@keyframes border-pulse {
    0% { border-color: rgba(0, 168, 255, 0.3); box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2); }
    50% { border-color: rgba(0, 168, 255, 0.8); box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2), 0 0 20px rgba(0, 168, 255, 0.2); }
    100% { border-color: rgba(0, 168, 255, 0.3); box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2); }
}

.pricing-card {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(15px);
    border-radius: 20px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
    padding: 50px 40px;
    width: 320px;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
    z-index: 1;
    top: 0;
    animation: float-card 6s ease-in-out infinite;
}

.pricing-card:nth-child(2) {
    animation-delay: 1s;
}

.pricing-card:nth-child(3) {
    animation-delay: 2s;
}

.pricing-card h3 {
    color: #fff;
    font-size: 2.5em;
    margin-bottom: 10px;
}

.pricing-card .price {
    font-size: 1.2em;
    font-weight: bold;
    margin-bottom: 20px;
    background: linear-gradient(45deg, #00a8ff, #00ff88);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: none;
}

.pricing-card .features {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}

.pricing-card .features li {
    color: #ccc;
    padding: 8px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.pricing-card .features li:last-child {
    border-bottom: none;
}

.pricing-card.featured {
    background: rgba(255, 255, 255, 0.08);
    border: 2px solid #00a8ff;
    animation: float-card 6s ease-in-out infinite 1s, border-pulse 3s infinite;
}

.pricing-card:hover {
    transform: scale(1.05) translateY(-5px);
    box-shadow: 0 30px 60px rgba(0, 168, 255, 0.3);
    border-color: #00a8ff;
    z-index: 2;
    background: rgba(255, 255, 255, 0.1);
}

.pricing-card .badge {
    position: absolute;
    top: 20px;
    right: -30px;
    background: #00a8ff;
    color: #fff;
    padding: 5px 30px;
    transform: rotate(45deg);
    font-size: 12px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
}

.btn-pricing {
    display: inline-block;
    padding: 12px 35px;
    background: linear-gradient(45deg, #00a8ff, #0077b5);
    color: #fff;
    border-radius: 30px;
    text-decoration: none;
    margin-top: 20px;
    transition: all 0.3s;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    font-weight: bold;
    letter-spacing: 1px;
}

.btn-pricing:hover {
    transform: scale(1.05);
    box-shadow: 0 0 20px rgba(0, 168, 255, 0.6);
    color: #fff;
    text-decoration: none;
    background: linear-gradient(45deg, #00c3ff, #0088cc);
}

/* --- Cookie Banner --- */
.cookie-banner {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    max-width: 600px;
    background: rgba(15, 12, 41, 0.95);
    backdrop-filter: blur(10px);
    color: #fff;
    padding: 20px 30px;
    z-index: 9999;
    display: none;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5);
    border-radius: 50px;
    border: 1px solid rgba(0, 168, 255, 0.3);
    animation: slideUp 0.5s ease-out;
}

/* --- Enhanced Footer --- */
.footer-enhanced {
    background-color: rgba(0, 0, 0, 0.3);
    color: #aaa;
    padding: 80px 0 30px;
    font-size: 14px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* --- Language Switcher --- */
.lang-switcher {
    margin-left: 20px;
    display: inline-flex;
    align-items: center;
    background: rgba(0, 168, 255, 0.2);
    padding: 5px 15px;
    border-radius: 20px;
    border: 1px solid rgba(0, 168, 255, 0.4);
    backdrop-filter: blur(5px);
    box-shadow: 0 0 10px rgba(0, 168, 255, 0.2);
}

.lang-switcher .lang-btn {
    color: rgba(255, 255, 255, 0.8) !important;
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
    transition: all 0.3s;
    padding: 2px 5px;
}

.lang-switcher .lang-btn:hover,
.lang-switcher .lang-btn.active {
    color: #fff !important;
    text-shadow: 0 0 10px #00a8ff;
}

/* Button Enhancements */
.btn-base {
    background: linear-gradient(45deg, #00a8ff, #0077b5);
    border: none;
    color: #fff;
    box-shadow: 0 5px 15px rgba(0, 168, 255, 0.3);
}

.btn-base:hover {
    background: linear-gradient(45deg, #008ecc, #005f99);
    box-shadow: 0 8px 25px rgba(0, 168, 255, 0.5);
    color: #fff;
}

/* Section Headings */
.section-heading .title-text {
    color: #fff;
    position: relative;
    display: inline-block;
    padding-bottom: 15px;
}

.section-heading .title-text::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 3px;
    background: #00a8ff;
    box-shadow: 0 0 10px #00a8ff;
}

.section-heading .sub-title {
    color: #a0a0a0;
}

/* Screenshots Carousel */
.owl-theme .owl-controls .owl-page span {
    background: rgba(255, 255, 255, 0.2);
}

.owl-theme .owl-controls .owl-page.active span {
    background: #00a8ff;
    box-shadow: 0 0 10px #00a8ff;
}

/* App Description */
.app-description p {
    color: #ccc;
}

/* Download Section */
.download {
    background: transparent;
}

/* License Page Specifics */
.white-bg {
    background-color: transparent; /* Override white background */
}

/* Force remove white backgrounds */
.white-bg, 
.section-bg, 
.pricing-table, 
.single-table,
.nivo-lightbox-theme-default .nivo-lightbox-content {
    background: transparent !important;
    background-color: transparent !important;
}

/* Fix for text visibility on dark background */
.pricing-card .features li::before {
    color: #00ff88;
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #0f0c29;
}

::-webkit-scrollbar-thumb {
    background: #00a8ff;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #0077b5;
}

/* --- Section Background Overrides --- */
.service,
.app-description,
.app-feature,
.screenshots,
.companies,
.download,
.purchase-book,
.contact,
.testimonials-1,
.testimonial,
.pricing-table-2 {
    background-color: transparent !important;
}

/* Ensure text visibility in these sections */
.service h1, .service h2, .service h3, .service h4, .service h5, .service h6,
.app-description h1, .app-description h2, .app-description h3, .app-description h4, .app-description h5, .app-description h6,
.app-feature h1, .app-feature h2, .app-feature h3, .app-feature h4, .app-feature h5, .app-feature h6,
.screenshots h1, .screenshots h2, .screenshots h3, .screenshots h4, .screenshots h5, .screenshots h6,
.download h1, .download h2, .download h3, .download h4, .download h5, .download h6,
.contact h1, .contact h2, .contact h3, .contact h4, .contact h5, .contact h6,
.testimonial p, .testimonial cite {
    color: #fff !important;
}

.service p, .app-description p, .app-feature p, .screenshots p, .download p, .contact p {
    color: #ccc !important;
}

/* Fix specific elements */
.service-item .icon {
    border-color: rgba(255, 255, 255, 0.2);
}

.contact-form input, .contact-form textarea {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: #fff;
}

.contact-form input:focus, .contact-form textarea:focus {
    border-color: #00a8ff;
    background: rgba(255, 255, 255, 0.15);
}

/* Override solid/gradient colors from theme */
.solid-color .overlay,
.solid-color.gradient-color .overlay {
    background: transparent !important;
    background-image: none !important;
}

/* Ensure input fields are visible */
input, textarea {
    color: #fff !important;
}

/* --- App Description Cool Effects --- */
.app-description img {
    animation: float 6s ease-in-out infinite;
    filter: drop-shadow(0 10px 20px rgba(0, 168, 255, 0.3));
}

@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-20px); }
    100% { transform: translateY(0px); }
}

.app-description .icon {
    color: #00a8ff;
    text-shadow: 0 0 20px #00a8ff;
    font-size: 60px;
    margin-bottom: 20px;
    display: inline-block;
    animation: pulse-glow 3s infinite;
}

@keyframes pulse-glow {
    0% { text-shadow: 0 0 20px #00a8ff; transform: scale(1); }
    50% { text-shadow: 0 0 40px #00a8ff, 0 0 20px #fff; transform: scale(1.1); }
    100% { text-shadow: 0 0 20px #00a8ff; transform: scale(1); }
}

.app-description h2 {
    background: linear-gradient(to right, #fff, #00a8ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: bold;
    letter-spacing: 2px;
}


