/* Modern UI overrides (scoped) - Applies only when has `app-modern` - LuxeVerify: premium dark palette + glass accents */ @import url("https://api.fontshare.com/v2/css?f[]=satoshi@400,500,600,700&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap"); body.app-modern { --bg: #000000; --surface: #0a0a0a; --surface-2: #141414; --surface-3: #1c1c1c; --text: #ffffff; --muted: #a1a1a1; --primary: #d4af37; --success: #00d4aa; --danger: #dc2626; --border: #2a2a2a; --shadow-sm: 0 10px 30px rgba(0, 0, 0, 0.55); --shadow-md: 0 22px 60px rgba(0, 0, 0, 0.65); --glow-gold: 0 0 40px rgba(212, 175, 55, 0.15); --glow-mint: 0 0 40px rgba(0, 212, 170, 0.16); --radius: 16px; --radius-sm: 12px; --ring: 0 0 0 4px rgba(212, 175, 55, 0.28); /* Compatibility with existing theme variables */ --app-bg: var(--bg); --app-surface: var(--surface); --app-surface-2: var(--surface-2); --app-text: var(--text); --app-border: var(--border); --app-shadow: var(--shadow-md); --app-radius-sm: var(--radius-sm); --app-radius-md: var(--radius); color-scheme: dark; background-color: var(--bg) !important; background-image: radial-gradient(1200px circle at 20% -10%, rgba(212, 175, 55, 0.10), transparent 45%), radial-gradient(900px circle at 85% 5%, rgba(0, 212, 170, 0.10), transparent 40%), radial-gradient(800px circle at 60% 95%, rgba(255, 255, 255, 0.05), transparent 50%); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Apple Color Emoji", "Segoe UI Emoji"; font-size: 16px; line-height: 1.6; font-variant-numeric: tabular-nums; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body.app-modern.bg-light { background-color: var(--bg) !important; } body.app-modern::before { content: ""; position: fixed; inset: 0; background-image: url("../img/noise.svg"); background-repeat: repeat; opacity: 0.05; pointer-events: none; } body.app-modern ::selection { background: rgba(212, 175, 55, 0.35); color: #000; } body.app-modern a { color: var(--primary); text-decoration: none; } body.app-modern a:hover { color: #f0d47a; text-decoration: none; } body.app-modern h1, body.app-modern h2, body.app-modern h3, body.app-modern h4, body.app-modern h5, body.app-modern h6 { color: var(--text); font-family: Satoshi, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Inter, Roboto, "Helvetica Neue", Arial; letter-spacing: 0.02em; } body.app-modern .display-3, body.app-modern .display-4 { letter-spacing: 0.03em; } body.app-modern :where(a, button, input, select, textarea, [tabindex]):focus-visible { outline: none; box-shadow: var(--ring); border-radius: 12px; } /* Scrollbars */ body.app-modern * { scrollbar-width: thin; scrollbar-color: rgba(212, 175, 55, 0.45) transparent; } body.app-modern ::-webkit-scrollbar { width: 10px; height: 10px; } body.app-modern ::-webkit-scrollbar-track { background: transparent; } body.app-modern ::-webkit-scrollbar-thumb { background: linear-gradient(180deg, rgba(212, 175, 55, 0.35), rgba(0, 212, 170, 0.25)); border: 2px solid rgba(0, 0, 0, 0.9); border-radius: 999px; } /* Text + utility mapping */ body.app-modern .text-muted, body.app-modern .text-secondary { color: var(--muted) !important; } body.app-modern .text-primary, body.app-modern .text-warning { color: var(--primary) !important; } body.app-modern .text-success { color: var(--success) !important; } body.app-modern .text-danger { color: #ff6b6b !important; } body.app-modern .text-white-50 { color: rgba(255, 255, 255, 0.62) !important; } body.app-modern .bg-white, body.app-modern .bg-light, body.app-modern .bg-secondary { background-color: var(--surface) !important; } body.app-modern .bg-primary { background-color: rgba(0, 0, 0, 0.75) !important; } body.app-modern hr { border-top-color: var(--border); } /* Alerts */ body.app-modern .alert { background: rgba(255, 255, 255, 0.03) !important; border: 1px solid var(--border) !important; color: rgba(255, 255, 255, 0.84) !important; } body.app-modern .alert-success { border-color: rgba(0, 212, 170, 0.30) !important; } body.app-modern .alert-danger { border-color: rgba(220, 38, 38, 0.40) !important; } body.app-modern .alert-warning, body.app-modern .alert-info { border-color: rgba(212, 175, 55, 0.30) !important; } body.app-modern .wrapper, body.app-modern .section, body.app-modern .section-shaped { background: transparent !important; } /* Navbar (fixed + blur) */ body.app-modern .navbar-area, body.app-modern .navbar { border-bottom: 1px solid var(--border); } body.app-modern .navbar { position: sticky; top: 0; z-index: 1030; background: rgba(0, 0, 0, 0.75) !important; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); box-shadow: none; } body.app-modern .navbar.navbar-transparent { background: rgba(0, 0, 0, 0.35) !important; } body.app-modern .navbar.navbar-dark.bg-primary, body.app-modern .navbar.navbar-main.bg-primary { background: rgba(0, 0, 0, 0.82) !important; } body.app-modern .navbar-light .navbar-nav .nav-link, body.app-modern .navbar-area.navbar-one .navbar-nav .nav-item a, body.app-modern .navbar-dark .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.90) !important; font-weight: 600; letter-spacing: 0.02em; } body.app-modern .navbar-light .navbar-nav .nav-link.active, body.app-modern .navbar-dark .navbar-nav .nav-link.active, body.app-modern .navbar-area.navbar-one .navbar-nav .nav-item a.active { color: var(--primary) !important; } body.app-modern .navbar-light .navbar-toggler-icon { filter: invert(1); } body.app-modern .navbar-toggler { border-color: var(--border) !important; } /* Bootstrap utilities */ body.app-modern .border, body.app-modern .border-top, body.app-modern .border-right, body.app-modern .border-bottom, body.app-modern .border-left, body.app-modern .border-white { border-color: var(--border) !important; } body.app-modern .rounded, body.app-modern .rounded-lg, body.app-modern .rounded-sm { border-radius: var(--radius) !important; } body.app-modern .shadow-sm { box-shadow: var(--shadow-sm) !important; } body.app-modern .shadow, body.app-modern .shadow-lg { box-shadow: var(--shadow-md) !important; } /* Buttons */ body.app-modern .btn, body.app-modern .main-btn, body.app-modern .navbar-btn a { border-radius: 14px !important; font-weight: 600; letter-spacing: 0.01em; transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), border-color 300ms cubic-bezier(0.4, 0, 0.2, 1), color 300ms cubic-bezier(0.4, 0, 0.2, 1); } body.app-modern .btn-link { color: rgba(255, 255, 255, 0.88) !important; text-decoration: none !important; } body.app-modern .btn-link:hover { color: var(--primary) !important; text-decoration: none !important; } body.app-modern .btn:hover, body.app-modern .main-btn:hover, body.app-modern .navbar-btn a:hover { transform: translateY(-1px); } body.app-modern .btn:active, body.app-modern .main-btn:active, body.app-modern .navbar-btn a:active { transform: translateY(0); } /* Primary / Warning => gold outline, hover fill */ body.app-modern .btn-primary, body.app-modern .btn-warning, body.app-modern .navbar-btn a.solid { color: var(--primary) !important; background: transparent !important; border: 1px solid rgba(212, 175, 55, 0.75) !important; } body.app-modern .btn-primary:hover, body.app-modern .btn-warning:hover, body.app-modern .navbar-btn a.solid:hover { color: #000 !important; background: var(--primary) !important; border-color: var(--primary) !important; box-shadow: var(--glow-gold); } /* Success => mint fill */ body.app-modern .btn-success { color: #00110d !important; background: var(--success) !important; border-color: var(--success) !important; box-shadow: var(--glow-mint); } body.app-modern .btn-success:hover { filter: brightness(1.02) saturate(1.05); } body.app-modern .btn-danger { color: #ff6b6b !important; background: transparent !important; border: 1px solid rgba(220, 38, 38, 0.65) !important; } body.app-modern .btn-danger:hover { color: #ffffff !important; background: var(--danger) !important; border-color: var(--danger) !important; box-shadow: 0 0 40px rgba(220, 38, 38, 0.18); } /* Neutral / Outline */ body.app-modern .btn-neutral, body.app-modern .btn-outline-primary, body.app-modern .navbar-btn a.light { color: rgba(255, 255, 255, 0.90) !important; background: rgba(255, 255, 255, 0.03) !important; border: 1px solid var(--border) !important; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); } body.app-modern .btn-neutral:hover, body.app-modern .btn-outline-primary:hover, body.app-modern .navbar-btn a.light:hover { border-color: rgba(212, 175, 55, 0.35) !important; box-shadow: var(--glow-gold); } /* Feature icon pills (argon) */ body.app-modern .icon.icon-shape { background: rgba(255, 255, 255, 0.03) !important; border: 1px solid var(--border); box-shadow: var(--shadow-sm); } body.app-modern .icon-shape-primary { background: rgba(212, 175, 55, 0.14) !important; border-color: rgba(212, 175, 55, 0.30) !important; color: var(--primary) !important; } body.app-modern .icon-shape-warning, body.app-modern .icon-shape-success { background: rgba(0, 212, 170, 0.14) !important; border-color: rgba(0, 212, 170, 0.30) !important; color: var(--success) !important; } /* Cards / surfaces */ body.app-modern .card, body.app-modern .coming-soon-content-wrapper, body.app-modern .single-testimonial, body.app-modern .service div, body.app-modern .bg-white { border-radius: var(--radius) !important; border: 1px solid transparent !important; background: linear-gradient(var(--surface-2), var(--surface-2)) padding-box, linear-gradient(135deg, rgba(212, 175, 55, 0.25), rgba(0, 212, 170, 0.18)) border-box; box-shadow: var(--shadow-sm); } @supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) { body.app-modern .card, body.app-modern .coming-soon-content-wrapper, body.app-modern .single-testimonial, body.app-modern .service div, body.app-modern .btn-neutral, body.app-modern .btn-outline-primary, body.app-modern .navbar { backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); } } body.app-modern .service div:hover, body.app-modern .card:hover { box-shadow: var(--shadow-md), var(--glow-gold); } body.app-modern .card-header { background: transparent !important; border-bottom: 1px solid var(--border) !important; } body.app-modern .card-body { color: rgba(255, 255, 255, 0.82); } /* Forms */ body.app-modern .form-control, body.app-modern .custom-select, body.app-modern .ayro-select, body.app-modern .input-items.default input, body.app-modern .input-items input { background-color: rgba(255, 255, 255, 0.03) !important; border: 1px solid var(--border) !important; border-radius: 14px !important; color: var(--text) !important; } body.app-modern .form-control::placeholder, body.app-modern input::placeholder, body.app-modern textarea::placeholder { color: rgba(255, 255, 255, 0.45) !important; } body.app-modern .form-control:focus, body.app-modern .custom-select:focus, body.app-modern .ayro-select:focus, body.app-modern .input-items.default input:focus, body.app-modern .input-items input:focus { border-color: rgba(212, 175, 55, 0.85) !important; box-shadow: var(--ring) !important; background-color: rgba(255, 255, 255, 0.04) !important; } body.app-modern .input-group-text { background-color: rgba(255, 255, 255, 0.03) !important; border-color: var(--border) !important; color: rgba(255, 255, 255, 0.75) !important; } /* Tables */ body.app-modern .table { color: var(--text); } body.app-modern .table thead th { border-bottom-color: var(--border) !important; color: rgba(255, 255, 255, 0.85); font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; font-size: 12px; } body.app-modern .table td, body.app-modern .table th { border-top-color: var(--border) !important; } body.app-modern .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(255, 255, 255, 0.02); } body.app-modern .table-hover tbody tr:hover { background-color: rgba(212, 175, 55, 0.06); } body.app-modern .page-link { background-color: rgba(255, 255, 255, 0.03) !important; border-color: var(--border) !important; color: rgba(255, 255, 255, 0.88) !important; } body.app-modern .page-link:hover { border-color: rgba(212, 175, 55, 0.35) !important; } body.app-modern .page-item.active .page-link { background-color: rgba(212, 175, 55, 0.14) !important; border-color: rgba(212, 175, 55, 0.55) !important; color: var(--primary) !important; box-shadow: var(--glow-gold); } body.app-modern .modal-content, body.app-modern .dropdown-menu { border-radius: var(--radius) !important; border: 1px solid transparent !important; background: linear-gradient(var(--surface-2), var(--surface-2)) padding-box, linear-gradient(135deg, rgba(212, 175, 55, 0.22), rgba(0, 212, 170, 0.16)) border-box; box-shadow: var(--shadow-md); } body.app-modern .dropdown-item { color: rgba(255, 255, 255, 0.88) !important; } body.app-modern .dropdown-item:hover, body.app-modern .dropdown-item:focus { background: rgba(212, 175, 55, 0.10) !important; } /* SweetAlert2 */ body.app-modern .swal2-popup { background: var(--surface-2) !important; color: var(--text) !important; border: 1px solid var(--border) !important; box-shadow: var(--shadow-md), var(--glow-gold); } body.app-modern .swal2-title { color: var(--text) !important; } body.app-modern .swal2-html-container { color: rgba(255, 255, 255, 0.82) !important; } body.app-modern .swal2-styled.swal2-confirm { background: var(--primary) !important; color: #000 !important; border: 1px solid var(--primary) !important; box-shadow: var(--glow-gold); } body.app-modern .swal2-styled.swal2-cancel { background: transparent !important; color: rgba(255, 255, 255, 0.90) !important; border: 1px solid var(--border) !important; } /* Argon shapes + separators */ body.app-modern .bg-gradient-default, body.app-modern .shape-default, body.app-modern .shape-style-1, body.app-modern .shape-style-3 { background: transparent !important; } body.app-modern .shape span { opacity: 0.12; background: rgba(255, 255, 255, 0.06) !important; } body.app-modern .separator .fill-white { fill: var(--bg) !important; } /* Monospace areas */ body.app-modern code, body.app-modern pre, body.app-modern .text-monospace { font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; } /* Auth pages */ body.app-modern.lv-auth .lv-auth-shell { width: 100%; max-width: 860px; } body.app-modern.lv-auth .lv-auth-card { border-radius: 20px !important; } body.app-modern.lv-auth .lv-auth-head { margin-bottom: 1.5rem; } body.app-modern.lv-auth .lv-auth-kicker { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.35rem 0.75rem; border-radius: 999px; border: 1px solid rgba(212, 175, 55, 0.28); background: rgba(212, 175, 55, 0.08); color: rgba(255, 255, 255, 0.86); font-weight: 600; letter-spacing: 0.03em; } body.app-modern.lv-auth .lv-auth-title { font-size: 34px; line-height: 1.15; margin-top: 0.85rem; margin-bottom: 0.35rem; } body.app-modern.lv-auth .lv-auth-subtitle { color: rgba(255, 255, 255, 0.62); margin-bottom: 0; } body.app-modern.lv-auth .lv-auth-trust { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.25rem; } body.app-modern.lv-auth .lv-auth-trust .lv-badge { border-radius: 999px; font-size: 12px; } body.app-modern.lv-auth .input-group { border-radius: 16px; } body.app-modern.lv-auth .input-group .form-control { min-height: 52px; font-size: 16px; } body.app-modern.lv-auth .input-group-text { min-height: 52px; width: 54px; justify-content: center; } body.app-modern.lv-auth .input-items.default input { min-height: 52px; font-size: 16px; padding-left: 3.25rem !important; } body.app-modern.lv-auth .lv-auth-card .btn.btn-primary, body.app-modern.lv-auth .lv-auth-card .btn.btn-warning { padding: 0.95rem 1.15rem; width: 100%; } @media (min-width: 992px) { body.app-modern.lv-auth .lv-auth-shell { max-width: 920px; } } /* Footer */ body.app-modern .lv-footer { margin-top: 4.25rem; border-top: 1px solid var(--border); } body.app-modern .lv-footer__cta { position: relative; background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.92), rgba(0, 0, 0, 0.55)), url("../img/office.jpg"); background-size: cover; background-position: center; border-bottom: 1px solid var(--border); } body.app-modern .lv-footer__cta::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(900px circle at 20% 30%, rgba(212, 175, 55, 0.12), transparent 55%), radial-gradient(700px circle at 80% 20%, rgba(0, 212, 170, 0.12), transparent 55%); pointer-events: none; } body.app-modern .lv-footer__cta > .container { position: relative; z-index: 1; } body.app-modern .lv-footer__main { background: rgba(0, 0, 0, 0.92); } body.app-modern .lv-footer__title { color: rgba(255, 255, 255, 0.88); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; font-size: 12px; margin-bottom: 0.9rem; } body.app-modern .lv-footer__links a { display: inline-flex; padding: 0.35rem 0; color: rgba(255, 255, 255, 0.70); } body.app-modern .lv-footer__links a:hover { color: var(--primary); } body.app-modern .lv-footer__badges { display: flex; flex-wrap: wrap; gap: 0.5rem; } body.app-modern .lv-badge { display: inline-flex; align-items: center; padding: 0.45rem 0.7rem; border-radius: 14px; border: 1px solid rgba(255, 255, 255, 0.10); background: rgba(255, 255, 255, 0.03); color: rgba(255, 255, 255, 0.80); font-weight: 600; } body.app-modern .lv-payments { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; } body.app-modern .lv-payments img { height: 28px; width: auto; opacity: 0.85; filter: grayscale(0.15) contrast(1.05); } body.app-modern .lv-footer__meta .lv-meta { display: inline-flex; align-items: center; padding: 0.35rem 0.65rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.10); background: rgba(255, 255, 255, 0.03); } /* Home (LuxeVerify) */ body.app-modern.lv-home .navbar .nav-link { border-radius: 12px; padding: 0.45rem 0.75rem; color: rgba(255, 255, 255, 0.78) !important; } body.app-modern.lv-home .navbar .nav-link:hover { background: rgba(255, 255, 255, 0.03); color: rgba(255, 255, 255, 0.92) !important; } body.app-modern.lv-home .lv-main { overflow: hidden; } body.app-modern.lv-home .lv-hero { position: relative; padding: 5.25rem 0 3.5rem; } body.app-modern.lv-home .lv-hero::before { content: ""; position: absolute; inset: -18% -18% auto -18%; height: 560px; background: radial-gradient(700px circle at 22% 45%, rgba(212, 175, 55, 0.16), transparent 58%), radial-gradient(620px circle at 82% 20%, rgba(0, 212, 170, 0.14), transparent 56%); pointer-events: none; } body.app-modern.lv-home .lv-kicker { display: inline-flex; align-items: center; gap: 0.55rem; padding: 0.45rem 0.85rem; border-radius: 999px; border: 1px solid rgba(212, 175, 55, 0.28); background: rgba(212, 175, 55, 0.08); color: rgba(255, 255, 255, 0.86); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; font-size: 11px; } body.app-modern.lv-home .lv-hero__title { font-size: clamp(42px, 4.6vw, 72px); line-height: 1.06; margin-top: 1.2rem; margin-bottom: 1rem; } body.app-modern.lv-home .lv-hero__text { color: rgba(255, 255, 255, 0.68); font-size: 18px; max-width: 56ch; } body.app-modern.lv-home .btn.btn-lg { padding: 0.95rem 1.15rem; } body.app-modern.lv-home .lv-hero__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.65rem; } body.app-modern.lv-home .lv-hero__trust { display: flex; flex-wrap: wrap; gap: 0.55rem; margin-top: 1.35rem; } body.app-modern.lv-home .lv-search-card { background: rgba(255, 255, 255, 0.02); } body.app-modern.lv-home .lv-label { display: block; margin-bottom: 0.35rem; color: rgba(255, 255, 255, 0.70); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; } body.app-modern.lv-home .lv-search { display: grid; grid-template-columns: 1fr 1fr auto; gap: 0.75rem; align-items: end; } body.app-modern.lv-home .lv-search__submit { white-space: nowrap; } @media (max-width: 767.98px) { body.app-modern.lv-home .lv-hero { padding-top: 4.25rem; } body.app-modern.lv-home .lv-search { grid-template-columns: 1fr; } } body.app-modern.lv-home .lv-hero__aside { border-radius: 20px; border: 1px solid rgba(255, 255, 255, 0.10); background: rgba(255, 255, 255, 0.02); padding: 1rem; } body.app-modern.lv-home .lv-stat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; } body.app-modern.lv-home .lv-stat { border-radius: 16px; border: 1px solid rgba(255, 255, 255, 0.10); background: rgba(0, 0, 0, 0.35); padding: 0.95rem 1rem; } body.app-modern.lv-home .lv-stat__label { color: rgba(255, 255, 255, 0.62); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; } body.app-modern.lv-home .lv-stat__value { margin-top: 0.35rem; font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 28px; line-height: 1.1; letter-spacing: 0.01em; } body.app-modern.lv-home .lv-device { position: relative; overflow: hidden; border-radius: 20px; border: 1px solid rgba(255, 255, 255, 0.10); background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01)); padding: 1.25rem; } body.app-modern.lv-home .lv-device::after { content: ""; position: absolute; inset: 0; background: radial-gradient(520px circle at 25% 25%, rgba(212, 175, 55, 0.12), transparent 60%); pointer-events: none; } body.app-modern.lv-home .lv-device img { width: 100%; height: auto; display: block; filter: drop-shadow(0 30px 65px rgba(0, 0, 0, 0.85)); } body.app-modern.lv-home .lv-section { position: relative; padding: 4.75rem 0; } body.app-modern.lv-home .lv-section-head { max-width: 820px; margin: 0 auto; } body.app-modern.lv-home .lv-section__kicker { display: inline-flex; align-items: center; gap: 0.55rem; padding: 0.4rem 0.8rem; border-radius: 999px; border: 1px solid rgba(0, 212, 170, 0.20); background: rgba(0, 212, 170, 0.08); color: rgba(255, 255, 255, 0.84); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; font-size: 11px; margin-bottom: 1rem; } body.app-modern.lv-home .lv-section__title { font-size: clamp(30px, 3.2vw, 42px); line-height: 1.12; margin-bottom: 0.9rem; } body.app-modern.lv-home .lv-section__text { color: rgba(255, 255, 255, 0.66); margin-bottom: 0; } body.app-modern.lv-home .lv-media { border-radius: 20px; border: 1px solid rgba(255, 255, 255, 0.10); background: rgba(255, 255, 255, 0.02); padding: 1rem; } body.app-modern.lv-home .lv-media--plain { padding: 1.25rem; } body.app-modern.lv-home .lv-media img { width: 100%; height: auto; display: block; filter: drop-shadow(0 26px 60px rgba(0, 0, 0, 0.8)); } body.app-modern.lv-home .lv-feature__icon { width: 56px; height: 56px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(255, 255, 255, 0.10); background: rgba(255, 255, 255, 0.03); margin-bottom: 1.1rem; font-size: 18px; } body.app-modern.lv-home .lv-feature__icon--gold { border-color: rgba(212, 175, 55, 0.30); background: rgba(212, 175, 55, 0.12); color: var(--primary); } body.app-modern.lv-home .lv-feature__icon--mint { border-color: rgba(0, 212, 170, 0.30); background: rgba(0, 212, 170, 0.12); color: var(--success); } body.app-modern.lv-home .lv-feature__title { color: rgba(255, 255, 255, 0.86); font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; font-size: 12px; margin-bottom: 0.5rem; } body.app-modern.lv-home .lv-feature__text { color: rgba(255, 255, 255, 0.64); } body.app-modern.lv-home .lv-service-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; margin-top: 1.35rem; } @media (min-width: 992px) { body.app-modern.lv-home .lv-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } body.app-modern.lv-home .lv-service { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.85rem 0.95rem; border-radius: 16px; border: 1px solid rgba(255, 255, 255, 0.10); background: rgba(255, 255, 255, 0.03); color: rgba(255, 255, 255, 0.88); transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1), box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1), border-color 300ms cubic-bezier(0.4, 0, 0.2, 1); } body.app-modern.lv-home .lv-service:hover { transform: translateY(-2px); border-color: rgba(212, 175, 55, 0.35); box-shadow: var(--shadow-sm), var(--glow-gold); } body.app-modern.lv-home .lv-service__left { display: inline-flex; align-items: center; gap: 0.65rem; min-width: 0; } body.app-modern.lv-home .lv-service__left i { font-size: 18px; } body.app-modern.lv-home .lv-service__name { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } body.app-modern.lv-home .lv-service__pill { font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; padding: 0.25rem 0.5rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.12); background: rgba(0, 0, 0, 0.35); color: rgba(255, 255, 255, 0.72); } body.app-modern.lv-home .lv-accordion .card { margin-bottom: 0.85rem; } body.app-modern.lv-home .lv-accordion__btn { width: 100%; display: flex; align-items: center; justify-content: space-between; text-align: left; padding: 0.95rem 1rem; font-weight: 800; letter-spacing: 0.02em; } body.app-modern.lv-home .lv-accordion__btn::after { content: ""; width: 10px; height: 10px; border-right: 2px solid rgba(255, 255, 255, 0.55); border-bottom: 2px solid rgba(255, 255, 255, 0.55); transform: rotate(45deg); transition: transform 200ms ease, border-color 200ms ease; flex: 0 0 auto; margin-left: 1rem; } body.app-modern.lv-home .lv-accordion__btn[aria-expanded="true"]::after { transform: rotate(-135deg); border-color: rgba(212, 175, 55, 0.85); } /* Reduced motion */ @media (prefers-reduced-motion: reduce) { body.app-modern *, body.app-modern *::before, body.app-modern *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; } } /* Mobil Menü (Hamburger) - Koyu Tema Kesin Çözüm */ @media (max-width: 991.98px) { /* Açılır menü çerçevesi ve koyu cam arka plan */ body.app-modern .navbar-collapse, body.app-modern .navbar-collapse.show, body.app-modern .navbar-collapse.collapsing { background: rgba(10, 10, 10, 0.98) !important; /* Temanın --surface rengi */ backdrop-filter: blur(20px) !important; -webkit-backdrop-filter: blur(20px) !important; border: 1px solid var(--border) !important; border-radius: var(--radius) !important; padding: 1.5rem 1rem !important; margin-top: 0.5rem !important; box-shadow: var(--shadow-md) !important; /* Menü açıldığında sayfa içeriğini itmesini engellemek için absolute yapıyoruz */ position: absolute !important; top: 100% !important; left: 15px !important; right: 15px !important; width: auto !important; z-index: 1050 !important; } /* Eski temalardan gelen sahte okları veya eklemeleri gizle */ body.app-modern .navbar-collapse::before, body.app-modern .navbar-collapse::after { display: none !important; } /* Menü içindeki linklerin metin rengi ve konumu */ body.app-modern .navbar-collapse .navbar-nav .nav-link { color: rgba(255, 255, 255, 0.85) !important; padding: 0.85rem 1.25rem !important; border-radius: 12px !important; margin-bottom: 0.25rem !important; transition: all 0.2s ease !important; } /* Linklerin üzerine gelince / seçiliyken oluşan altın sarısı efekti */ body.app-modern .navbar-collapse .navbar-nav .nav-link:hover, body.app-modern .navbar-collapse .navbar-nav .nav-link.active { background: rgba(212, 175, 55, 0.12) !important; color: var(--primary) !important; } /* Hamburger butonunun (çizgili buton) kutusu */ body.app-modern .navbar-toggler { background-color: rgba(255, 255, 255, 0.05) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 12px !important; padding: 0.5rem 0.6rem !important; outline: none !important; box-shadow: none !important; } /* Hamburger butonuna tıklanınca oluşan çirkin mavi çerçeveyi altın rengiyle değiştirme */ body.app-modern .navbar-toggler:focus { box-shadow: var(--ring) !important; } /* Hamburger ikonunun çizgilerini kesin olarak beyaz yap */ body.app-modern .navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(255, 255, 255, 0.9)' stroke-width='2.25' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important; } }