/* Dark Premium & AI-Driven Theme - Frontend */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Poppins:wght@400;500;600;700;800&display=swap');

:root {
  /* Core Palette */
  --afk-bg: #0a0510;
  --afk-primary: #8c0fe6;
  --afk-primary-dark: #5a0994;
  --afk-primary-darker: #3a0670;
  --afk-gradient-primary: linear-gradient(135deg, #8c0fe6 0%, #5a0994 100%);
  --afk-glass: rgba(25, 10, 40, 0.6);
  --afk-glass-header: rgba(14, 8, 24, 0.8);
  --afk-border: rgba(255, 255, 255, 0.05);
  --afk-text: #ffffff;
  --afk-text-muted: #b3b3b3;
  --afk-success: #00ffa3;
  --afk-info: #00d4ff;
  --afk-warning: #f59e0b;
  --afk-danger: #f5365c;
    --afk-font: "Inter", "Poppins", system-ui, sans-serif;

  /* Overriding Theme Variables */
  --tp-ff-body: var(--afk-font);
  --tp-ff-heading: var(--afk-font);
  --tp-common-white: #ffffff;
  --tp-common-black: #0a0510;
  --tp-heading-primary: #ffffff;
  --tp-text-body: #b3b3b3;
  --tp-theme-1: #8c0fe6;
  --tp-theme-2: #5a0994;
  --tp-theme-3: #8c0fe6;
  --tp-border-1: rgba(255, 255, 255, 0.05);
  --tp-border-2: rgba(255, 255, 255, 0.05);
  --tp-border-3: rgba(140, 15, 230, 0.5);
  --tp-grey-1: #1a1a2e;
  --tp-grey-2: #0e0818;
}

body {
    background-color: var(--afk-bg);
    color: var(--afk-text-muted);
    font-family: var(--afk-font);
    position: relative;
    overflow-x: hidden;
}

body::before,
body::after {
    content: '';
    position: fixed;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    z-index: -1;
    filter: blur(100px);
    opacity: 0.15;
    pointer-events: none;
}

body::before {
    top: -100px;
    left: -100px;
    background: radial-gradient(circle, #8c0fe6, transparent 70%);
}

body::after {
    bottom: -100px;
    right: -100px;
    background: radial-gradient(circle, #00d4ff, transparent 70%);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--afk-text);
    font-family: var(--afk-font);
    letter-spacing: -0.02em;
}

p {
    color: var(--afk-text-muted);
}

a {
    transition: all 0.3s ease;
}

/* Glassmorphism Cards & Sections */
.tp-hero-area, .tp-feature-area, .tp-service-area, 
.tp-project-area, .tp-team-area, .tp-blog-area,
.tp-footer-area, .tp-about-area, .tp-choose-area,
.tp-price-area, .tp-testimonial-area-2 {
    background: transparent !important;
}

.tp-white-bg {
    background-color: transparent !important;
}

.tp-grey-bg {
    background-color: rgba(255, 255, 255, 0.02) !important;
}

/* Cards (Services, Features, Pricing) */
.tp-service-item, .tp-feature-item, .tp-price-item, 
.tp-project-item, .tp-team-item, .tp-blog-item,
.tp-choose-content, .tp-about-content {
    background: var(--afk-glass) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border: 1px solid var(--afk-border) !important;
    border-radius: 16px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3) !important;
}

.tp-service-item:hover, .tp-feature-item:hover, 
.tp-price-item:hover, .tp-project-item:hover {
    transform: translateY(-5px);
    border-color: var(--afk-primary) !important;
    box-shadow: 0 15px 40px rgba(140, 15, 230, 0.2) !important;
}

/* Header */
.tp-header-area {
    background: rgba(10, 5, 16, 0.8) !important;
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--afk-border);
}

.tp-main-menu ul li a {
    color: var(--afk-text-muted);
}

.tp-main-menu ul li a:hover,
.tp-main-menu ul li.active a {
    color: var(--afk-primary);
}

/* Buttons */
.tp-btn, .btn, .tp-btn-2, .tp-btn-3, 
.tp-slider-btn, .tp-header-btn {
    border-radius: 50px !important; /* Pill style */
    background: var(--afk-gradient-primary) !important;
    color: #fff !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(140, 15, 230, 0.3);
    font-weight: 600;
    transition: all 0.3s ease;
}

.tp-btn:hover, .btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(140, 15, 230, 0.5);
    filter: brightness(1.1);
}

.tp-btn-white {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid var(--afk-border) !important;
    backdrop-filter: blur(5px);
}

.tp-btn-white:hover {
    background: rgba(255, 255, 255, 0.15) !important;
    border-color: var(--afk-primary) !important;
}

/* Inputs */
input, select, textarea, .form-control {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid var(--afk-border) !important;
    color: var(--afk-text) !important;
    border-radius: 10px !important;
}

input:focus, select:focus, textarea:focus, .form-control:focus {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: var(--afk-primary) !important;
    box-shadow: 0 0 0 3px rgba(140, 15, 230, 0.2) !important;
    outline: none;
}

input::placeholder, textarea::placeholder {
    color: rgba(255, 255, 255, 0.4) !important;
}

/* Auth Pages Specifics */
.auth-card {
    background: var(--afk-glass) !important;
    backdrop-filter: blur(12px);
    border: 1px solid var(--afk-border);
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    padding: 2rem;
}

.auth-title {
    color: var(--afk-text);
    font-weight: 700;
    text-align: center;
    margin-bottom: 1.5rem;
}

.auth-subtitle {
    color: var(--afk-text-muted);
    text-align: center;
    font-size: 0.9rem;
    margin-bottom: 2rem;
}

.auth-divider {
    border-top: 1px solid var(--afk-border);
    margin: 1.5rem 0;
}

/* Footer */
.tp-footer-area {
    border-top: 1px solid var(--afk-border);
    background: #050208 !important;
}

.tp-footer-widget-title {
    color: var(--afk-text);
}

.tp-footer-widget-content ul li a {
    color: var(--afk-text-muted);
}

.tp-footer-widget-content ul li a:hover {
    color: var(--afk-primary);
}

.tp-copyright-text p {
    color: var(--afk-text-muted);
}

/* Sections Specifics */
.tp-section-title {
    color: var(--afk-text);
}

.tp-section-subtitle {
    color: var(--afk-primary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Scroll Top */
.scroll-top {
    background: var(--afk-gradient-primary) !important;
    box-shadow: 0 4px 15px rgba(140, 15, 230, 0.3);
}

/* OTP Input */
.otp-input {
    letter-spacing: 0.5em;
    text-align: center;
    font-size: 1.5rem;
    font-weight: 700;
}

/* Mobile Menu */
.mean-container .mean-bar {
    background: transparent;
}

.mean-container .mean-nav {
    background: var(--afk-bg);
}