/* ============================================ İyiWeb 3D Dark Navy/Orange Theme for WiseCP Version: 3.0 - Comprehensive Override Loaded LAST in to override all defaults ============================================ */ /* ---- CSS Variables ---- */ :root { --iw-bg-primary: #0a0e27; --iw-bg-secondary: #0d1135; --iw-bg-card: rgba(20, 27, 51, 0.9); --iw-bg-card-hover: rgba(28, 36, 68, 0.95); --iw-bg-card-solid: #141b33; --iw-bg-input: rgba(15, 20, 45, 0.8); --iw-bg-footer: #080c20; --iw-bg-overlay: rgba(10, 14, 39, 0.95); --iw-accent: #ff6b35; --iw-accent-light: #ff8c5a; --iw-accent-dark: #e55a28; --iw-accent-3d-shadow: #cc4f20; --iw-accent-gradient: linear-gradient(135deg, #ff6b35 0%, #ff8c5a 100%); --iw-blue: #4f9cf7; --iw-blue-gradient: linear-gradient(135deg, #4f9cf7 0%, #7cb8ff 100%); --iw-text-primary: #ccd6f6; --iw-text-secondary: #8892b0; --iw-text-muted: #5a6380; --iw-border: rgba(255, 255, 255, 0.06); --iw-border-hover: rgba(255, 255, 255, 0.12); --iw-glow-orange: 0 0 30px rgba(255, 107, 53, 0.3); --iw-glow-blue: 0 0 30px rgba(79, 156, 247, 0.3); --iw-shadow-card: 0 8px 32px rgba(0, 0, 0, 0.3); --iw-shadow-card-hover: 0 20px 60px rgba(0, 0, 0, 0.5); --iw-radius: 12px; --iw-radius-lg: 20px; --iw-radius-sm: 8px; --iw-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); } /* ============================================ 0. LOADING OVERLAY ============================================ */ #wisecp { background: #0a0e27 !important; } #wisecp .spinner, #wisecp .loading-text, #wisecp span, #wisecp a { color: #ccd6f6 !important; } /* ============================================ 1. BODY & GLOBAL ============================================ */ body { background: var(--iw-bg-primary) !important; color: var(--iw-text-primary) !important; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body.iw-dark-theme { background: var(--iw-bg-primary) !important; color: var(--iw-text-primary) !important; } a { color: var(--iw-accent) !important; transition: var(--iw-transition); } a:hover { color: var(--iw-accent-light) !important; } h1, h2, h3, h4, h5, h6 { color: var(--iw-text-primary) !important; } p, span, div { color: var(--iw-text-secondary); } strong, b { color: var(--iw-text-primary); } small { color: var(--iw-text-muted); } hr { border-color: var(--iw-border) !important; } ::selection { background: rgba(255, 107, 53, 0.3) !important; color: #fff !important; } img { transition: var(--iw-transition); } /* ============================================ 2. CUSTOM SCROLLBAR ============================================ */ ::-webkit-scrollbar { width: 8px; } ::-webkit-scrollbar-track { background: var(--iw-bg-primary); } ::-webkit-scrollbar-thumb { background: rgba(255, 107, 53, 0.3); border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: rgba(255, 107, 53, 0.5); } /* ============================================ 3. UTILITY / 3D EFFECT CLASSES ============================================ */ /* ---- 3D Buttons ---- */ .btn-3d { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; color: #fff !important; border: none !important; border-radius: 10px !important; padding: 12px 28px !important; font-weight: 600 !important; font-size: 14px !important; cursor: pointer; transition: var(--iw-transition); box-shadow: 0 4px 0 #cc4f20, 0 6px 10px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important; transform: translateY(0); position: relative; overflow: hidden; text-transform: none !important; letter-spacing: 0.3px; text-decoration: none !important; display: inline-block; text-align: center; } .btn-3d:hover { transform: translateY(-2px) !important; box-shadow: 0 6px 0 #cc4f20, 0 10px 20px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.15) !important; color: #fff !important; } .btn-3d:active { transform: translateY(3px) !important; box-shadow: 0 1px 0 #cc4f20, 0 2px 4px rgba(0, 0, 0, 0.2) !important; } .btn-3d-secondary { background: rgba(255, 255, 255, 0.05) !important; color: var(--iw-text-primary) !important; border: 1px solid var(--iw-border-hover) !important; border-radius: 10px !important; padding: 12px 28px !important; font-weight: 600 !important; font-size: 14px !important; cursor: pointer; transition: var(--iw-transition); box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); backdrop-filter: blur(10px); text-decoration: none !important; display: inline-block; } .btn-3d-secondary:hover { background: rgba(255, 255, 255, 0.1) !important; border-color: var(--iw-accent) !important; color: var(--iw-accent) !important; transform: translateY(-2px) !important; box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important; } /* ---- 3D Cards ---- */ .card-3d { background: var(--iw-bg-card); border: 1px solid var(--iw-border); border-radius: var(--iw-radius-lg); padding: 32px; transition: var(--iw-transition); box-shadow: var(--iw-shadow-card); position: relative; overflow: hidden; } .card-3d::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255, 107, 53, 0.3), transparent); opacity: 0; transition: var(--iw-transition); } .card-3d:hover { transform: translateY(-8px); box-shadow: var(--iw-shadow-card-hover); border-color: var(--iw-border-hover); background: var(--iw-bg-card-hover); } .card-3d:hover::before { opacity: 1; } .card-3d-pricing { background: var(--iw-bg-card); border: 1px solid var(--iw-border); border-radius: var(--iw-radius-lg); padding: 36px 28px; transition: var(--iw-transition); box-shadow: var(--iw-shadow-card); text-align: center; position: relative; overflow: hidden; display: flex; flex-direction: column; } .card-3d-pricing:hover { transform: translateY(-12px) scale(1.02); box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5); border-color: rgba(255, 107, 53, 0.2); } .card-3d-pricing.popular { border-color: rgba(255, 107, 53, 0.4); box-shadow: 0 0 30px rgba(255, 107, 53, 0.1), var(--iw-shadow-card); } .card-3d-pricing.popular::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--iw-accent-gradient); } /* ---- 3D Badges ---- */ .badge-3d { background: var(--iw-accent-gradient); color: #fff; border-radius: 20px; padding: 4px 14px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3); display: inline-block; } /* ---- Gradient Text ---- */ .gradient-text { background: var(--iw-accent-gradient) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; } /* ---- Glass Morphism ---- */ .glass { background: rgba(10, 14, 39, 0.6) !important; backdrop-filter: blur(20px) !important; -webkit-backdrop-filter: blur(20px) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius) !important; } .glass-strong { background: rgba(10, 14, 39, 0.85) !important; backdrop-filter: blur(30px) !important; -webkit-backdrop-filter: blur(30px) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius) !important; } /* ---- Mesh Gradient Background ---- */ .mesh-gradient { background: radial-gradient(at 20% 20%, rgba(255, 107, 53, 0.08) 0%, transparent 50%), radial-gradient(at 80% 80%, rgba(79, 156, 247, 0.06) 0%, transparent 50%), radial-gradient(at 50% 50%, rgba(255, 107, 53, 0.04) 0%, transparent 60%), var(--iw-bg-primary) !important; } /* ---- Grid Pattern ---- */ .grid-pattern { background-image: linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px); background-size: 60px 60px; } /* ---- 3D Icon Container ---- */ .icon-3d { width: 56px; height: 56px; border-radius: var(--iw-radius); background: var(--iw-accent-gradient); display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 8px 20px rgba(255, 107, 53, 0.25); transition: var(--iw-transition); color: #fff; font-size: 22px; } .icon-3d:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgba(255, 107, 53, 0.4); } .icon-3d-blue { background: var(--iw-blue-gradient); box-shadow: 0 8px 20px rgba(79, 156, 247, 0.25); } .icon-3d-blue:hover { box-shadow: 0 12px 30px rgba(79, 156, 247, 0.4); } /* ---- Glow Effects ---- */ .glow-orange { box-shadow: var(--iw-glow-orange) !important; } .glow-blue { box-shadow: var(--iw-glow-blue) !important; } /* ---- Animations ---- */ @keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } } @keyframes float-slow { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } } @keyframes pulse-glow { 0%, 100% { box-shadow: 0 0 20px rgba(255, 107, 53, 0.2); } 50% { box-shadow: 0 0 40px rgba(255, 107, 53, 0.5); } } @keyframes counter-up { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } @keyframes slide-in-up { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } @keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } } @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .animate-float { animation: float 6s ease-in-out infinite; } .animate-float-slow { animation: float-slow 8s ease-in-out infinite; } .animate-pulse-glow { animation: pulse-glow 3s ease-in-out infinite; } /* ---- Section Headers ---- */ .section-header { text-align: center; margin-bottom: 48px; } .section-header h2 { font-size: 2.2rem; font-weight: 700; margin-bottom: 12px; } .section-header p { font-size: 1.1rem; color: var(--iw-text-secondary) !important; max-width: 600px; margin: 0 auto; } /* ---- Popular Badge ---- */ .popular-badge { position: absolute; top: 0; left: 50%; transform: translateX(-50%); background: linear-gradient(135deg, #ff6b35, #ff8c5a); color: #fff; border-radius: 0 0 12px 12px; padding: 6px 20px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3); z-index: 2; white-space: nowrap; } /* ---- GDPR Badge ---- */ .gdpr-badge { background: rgba(255, 255, 255, 0.05); border: 1px solid var(--iw-border); border-radius: var(--iw-radius-sm); padding: 6px 14px; display: inline-flex; align-items: center; gap: 6px; color: var(--iw-text-secondary); font-size: 12px; } /* ---- IW Utility Classes ---- */ .iw-bg-primary { background-color: var(--iw-bg-primary) !important; } .iw-bg-secondary { background-color: var(--iw-bg-secondary) !important; } .iw-bg-card { background-color: var(--iw-bg-card) !important; } .iw-text-primary { color: var(--iw-text-primary) !important; } .iw-text-secondary { color: var(--iw-text-secondary) !important; } .iw-text-accent { color: var(--iw-accent) !important; } .iw-border { border: 1px solid var(--iw-border) !important; } .iw-rounded { border-radius: var(--iw-radius) !important; } .iw-rounded-lg { border-radius: var(--iw-radius-lg) !important; } .iw-shadow { box-shadow: var(--iw-shadow-card) !important; } .iw-divider { height: 1px; background: linear-gradient(90deg, transparent, var(--iw-border), transparent); margin: 48px 0; } .page-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; } .counter-value { font-variant-numeric: tabular-nums; } /* ============================================ 4. HEADER (.header) ============================================ */ .header, .main-header, #header { background: transparent !important; border-bottom: 1px solid var(--iw-border) !important; transition: var(--iw-transition); } .header.scrolled, .main-header.scrolled { background: rgba(10, 14, 39, 0.95) !important; backdrop-filter: blur(20px) !important; -webkit-backdrop-filter: blur(20px) !important; box-shadow: 0 4px 30px rgba(0, 0, 0, 0.3) !important; } .header .head { max-width: 1200px !important; margin: 0 auto !important; display: flex !important; align-items: center !important; justify-content: space-between !important; } .headerwhite { background: var(--iw-bg-primary) !important; } .sayfabaslik { background: transparent !important; padding: 24px 0 !important; } .sayfabaslik h1 { font-size: 2rem !important; font-weight: 800 !important; background: var(--iw-accent-gradient) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; margin: 0 0 6px !important; } .sayfabaslik a, .sayfabaslik span { color: var(--iw-text-secondary) !important; font-size: 14px !important; } /* ============================================ 5. MENU / NAVIGATION ============================================ */ .menu, nav, .navbar { background: transparent !important; border: none !important; } .menu ul { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; gap: 4px !important; } .menu ul li { position: relative !important; } .menu ul li a { color: #ccd6f6 !important; font-weight: 500 !important; padding: 10px 18px !important; border-radius: 8px !important; transition: var(--iw-transition) !important; display: block !important; text-decoration: none !important; white-space: nowrap !important; } .menu ul li a:hover { color: #ff6b35 !important; background: rgba(255, 107, 53, 0.08) !important; } .menu ul li.active > a { color: var(--iw-accent) !important; } /* Dropdown menus */ .menu ul li:hover > ul, .menu ul li ul:hover { background: #0d1135 !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; border-radius: 12px !important; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4) !important; } .menu ul li ul { background: #0d1135 !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; border-radius: 12px !important; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4) !important; padding: 8px !important; } .menu ul li ul li a { color: #8892b0 !important; padding: 10px 16px !important; font-size: 13px !important; border-radius: 8px !important; } .menu ul li ul li a:hover { color: #ff6b35 !important; background: rgba(255, 107, 53, 0.1) !important; } /* Mobile menu */ #mobmenu, .mobile-menu, .mobile-nav { background: var(--iw-bg-secondary) !important; border-left: 1px solid var(--iw-border) !important; } #mobmenu a, .mobile-menu a, .mobile-nav a { color: var(--iw-text-primary) !important; padding: 14px 20px !important; display: block !important; border-bottom: 1px solid var(--iw-border); transition: var(--iw-transition); } #mobmenu a:hover, .mobile-menu a:hover, .mobile-nav a:hover { color: var(--iw-accent) !important; background: rgba(255, 107, 53, 0.08); } .mobmenuclose { background: rgba(255, 255, 255, 0.05) !important; border-radius: 50% !important; } /* ============================================ 6. HEAD BUTTONS & SOCIAL ============================================ */ .headbutonlar { display: flex !important; align-items: center !important; gap: 10px !important; } .headbutonlar a { color: #ccd6f6 !important; padding: 8px 14px !important; border-radius: 8px !important; transition: var(--iw-transition); font-weight: 500 !important; font-size: 14px !important; background: rgba(255, 255, 255, 0.04) !important; text-decoration: none !important; } .headbutonlar a:hover { color: #ff6b35 !important; background: rgba(255, 107, 53, 0.1) !important; } .sosyalbtns { display: flex !important; align-items: center !important; gap: 8px !important; } .sosyalbtns a, .sosyalbtns .lbtn { color: #8892b0 !important; width: 36px !important; height: 36px !important; border-radius: 50% !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; transition: var(--iw-transition); background: rgba(255, 255, 255, 0.05) !important; border: 1px solid var(--iw-border) !important; text-decoration: none !important; } .sosyalbtns a:hover, .sosyalbtns .lbtn:hover { color: #ff6b35 !important; background: rgba(255, 107, 53, 0.15) !important; border-color: var(--iw-accent) !important; transform: translateY(-2px); } .footsosyal { display: flex !important; align-items: center !important; gap: 8px !important; margin-top: 16px !important; } .footsosyal a, .footsosyal .lbtn { color: #8892b0 !important; width: 36px !important; height: 36px !important; border-radius: 50% !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; transition: var(--iw-transition); background: rgba(255, 255, 255, 0.05) !important; border: 1px solid var(--iw-border) !important; text-decoration: none !important; } .footsosyal a:hover, .footsosyal .lbtn:hover { color: #ff6b35 !important; background: rgba(255, 107, 53, 0.15) !important; border-color: var(--iw-accent) !important; transform: translateY(-2px); } /* ============================================ 7. LBTN (Link Buttons) - Dark Styled ============================================ */ .lbtn { color: var(--iw-text-secondary) !important; background: rgba(255, 255, 255, 0.05) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius-sm) !important; padding: 8px 16px !important; font-size: 13px !important; font-weight: 500 !important; transition: var(--iw-transition); display: inline-block !important; text-decoration: none !important; cursor: pointer; } .lbtn:hover { color: var(--iw-accent) !important; border-color: rgba(255, 107, 53, 0.3) !important; background: rgba(255, 107, 53, 0.08) !important; } .lbtn.green, .lbtn.green:hover, .green.lbtn, .green.lbtn:hover { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; color: #fff !important; border: none !important; border-radius: 10px !important; box-shadow: 0 4px 0 #cc4f20, 0 6px 10px rgba(0, 0, 0, 0.3) !important; padding: 10px 24px !important; font-weight: 600 !important; } .lbtn.green:hover, .green.lbtn:hover { transform: translateY(-2px) !important; box-shadow: 0 6px 0 #cc4f20, 0 10px 20px rgba(0, 0, 0, 0.4) !important; } /* ============================================ 8. GONDERBTN - Orange 3D Button ============================================ */ .gonderbtn, .btn-primary, input[type="submit"] { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; color: #fff !important; border: none !important; border-radius: 10px !important; padding: 12px 28px !important; font-weight: 600 !important; font-size: 14px !important; cursor: pointer !important; transition: var(--iw-transition) !important; box-shadow: 0 4px 0 #cc4f20, 0 6px 10px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important; text-decoration: none !important; display: inline-block !important; text-align: center !important; } .gonderbtn:hover, .btn-primary:hover, input[type="submit"]:hover { transform: translateY(-2px) !important; box-shadow: 0 6px 0 #cc4f20, 0 10px 20px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.15) !important; color: #fff !important; } .gonderbtn:active, .btn-primary:active, input[type="submit"]:active { transform: translateY(3px) !important; box-shadow: 0 1px 0 #cc4f20, 0 2px 4px rgba(0, 0, 0, 0.2) !important; } /* Tab-specific gonderbtn styling */ .miotab-labels .gonderbtn { background: rgba(255, 255, 255, 0.04) !important; color: #8892b0 !important; border: 1px solid var(--iw-border) !important; border-radius: 30px !important; padding: 10px 24px !important; font-weight: 500 !important; box-shadow: none !important; } .miotab-labels .gonderbtn.active { background: var(--iw-accent-gradient) !important; color: #fff !important; border-color: transparent !important; box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3) !important; } .miotab-labels .gonderbtn:hover { color: #ff6b35 !important; background: rgba(255, 107, 53, 0.1) !important; border-color: rgba(255, 107, 53, 0.3) !important; box-shadow: none !important; transform: none !important; } /* ============================================ 9. FORM INPUTS (Global) ============================================ */ input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="tel"], input[type="url"], input[type="search"], input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"], input[type="week"], select, textarea { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 10px !important; color: #ccd6f6 !important; padding: 12px 16px !important; font-size: 14px !important; transition: var(--iw-transition); width: 100%; font-family: inherit !important; } input:focus, select:focus, textarea:focus { border-color: #ff6b35 !important; box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.1) !important; outline: none !important; } input::placeholder, textarea::placeholder { color: #5a6380 !important; } input:disabled, select:disabled, textarea:disabled { opacity: 0.5 !important; cursor: not-allowed !important; } select { -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%238892b0' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 12px center !important; padding-right: 36px !important; } select option { background: var(--iw-bg-secondary) !important; color: var(--iw-text-primary) !important; } /* Checkbox / Radio */ input[type="checkbox"], input[type="radio"] { accent-color: var(--iw-accent) !important; } /* Form groups */ .form-group { margin-bottom: 20px !important; } .form-group label, label { color: var(--iw-text-primary) !important; font-weight: 500 !important; font-size: 14px !important; margin-bottom: 6px !important; } .form-control { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 10px !important; color: #ccd6f6 !important; } .form-control:focus { border-color: #ff6b35 !important; box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.1) !important; } /* ============================================ 10. DOMAIN CHECK (.homedomainarea) ============================================ */ .homedomainarea, .domain-check-area, .domain-search { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-radius: 16px !important; padding: 40px !important; box-shadow: var(--iw-shadow-card) !important; } .homedomainarea h1, .homedomainarea h2 { background: var(--iw-accent-gradient) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; } .homedomainarea input[type="text"], .domain-search input[type="text"], .homedomainarea input { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 10px !important; color: #ccd6f6 !important; padding: 14px 20px !important; font-size: 16px !important; transition: var(--iw-transition); } .homedomainarea input:focus, .domain-search input:focus { border-color: #ff6b35 !important; box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.15) !important; outline: none !important; } .homedomainarea select { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 10px !important; color: #ccd6f6 !important; padding: 14px 16px !important; } .homedomainarea .gonderbtn, .domain-search .gonderbtn, .domain-search button { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; color: #fff !important; border: none !important; border-radius: 10px !important; padding: 14px 32px !important; font-weight: 600 !important; font-size: 16px !important; cursor: pointer !important; transition: var(--iw-transition); box-shadow: 0 4px 0 #cc4f20, 0 6px 10px rgba(0, 0, 0, 0.3) !important; } .homedomainarea .gonderbtn:hover, .domain-search .gonderbtn:hover, .domain-search button:hover { transform: translateY(-2px) !important; box-shadow: 0 6px 0 #cc4f20, 0 10px 20px rgba(0, 0, 0, 0.4) !important; } /* Spot TLDs */ .spottlds { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius-sm) !important; padding: 12px 16px !important; text-align: center !important; transition: var(--iw-transition); } .spottlds:hover { border-color: rgba(255, 107, 53, 0.2) !important; } .spottlds h5, .spottlds .price { color: #ff6b35 !important; font-weight: 700 !important; } .spottlds span { color: var(--iw-text-secondary) !important; } /* ============================================ 11. PRODUCT / PRICING CARDS (.tablopaketler, .tablepaket) ============================================ */ .tablopaketler, .miotab-labels { display: flex !important; gap: 8px !important; flex-wrap: wrap !important; justify-content: center !important; margin-bottom: 32px !important; border: none !important; background: transparent !important; } .miotab-labels a, .miotab-labels li a, .tablopaketler a { background: rgba(255, 255, 255, 0.04) !important; color: #8892b0 !important; border: 1px solid var(--iw-border) !important; border-radius: 30px !important; padding: 10px 24px !important; font-weight: 500 !important; font-size: 14px !important; transition: var(--iw-transition) !important; cursor: pointer !important; text-decoration: none !important; display: inline-block !important; } .miotab-labels a:hover, .miotab-labels li a:hover, .tablopaketler a:hover { background: rgba(255, 107, 53, 0.1) !important; color: #ff6b35 !important; border-color: rgba(255, 107, 53, 0.3) !important; } .miotab-labels a.active, .miotab-labels li.active a, .miotab-labels a[style*="background"], .tablopaketler a.active { background: var(--iw-accent-gradient) !important; color: #fff !important; border-color: transparent !important; box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3) !important; } .miotab-content { background: transparent !important; border: none !important; } /* Pricing cards */ .tablepaket, .pricing-card, .product-card { background: rgba(20, 27, 51, 0.9) !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; border-radius: 16px !important; padding: 32px 24px !important; transition: var(--iw-transition) !important; box-shadow: var(--iw-shadow-card) !important; text-align: center !important; position: relative !important; overflow: hidden !important; } .tablepaket:hover, .pricing-card:hover, .product-card:hover { transform: translateY(-12px) scale(1.02) !important; box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5) !important; border-color: rgba(255, 107, 53, 0.2) !important; } .tablepaket.active, .tablepaket.popular, .pricing-card.popular { border-color: rgba(255, 107, 53, 0.4) !important; box-shadow: 0 0 30px rgba(255, 107, 53, 0.1), var(--iw-shadow-card) !important; } .tablepaket.active::before, .tablepaket.popular::before, .pricing-card.popular::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--iw-accent-gradient); } /* Popular badge */ .tablepopular { background: linear-gradient(135deg, #ff6b35, #ff8c5a) !important; color: #fff !important; border-radius: 0 0 12px 12px !important; padding: 6px 20px !important; font-size: 11px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 1px !important; text-align: center !important; } /* Package title */ .pakettitle, .tpakettitle, .tablepaket .title, .tablepaket h3, .pricing-card .title { color: #ccd6f6 !important; font-weight: 700 !important; font-size: 1.3rem !important; margin-bottom: 8px !important; } /* Package price */ .tablepaket h3, .pricing-card h3 { background: var(--iw-accent-gradient) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; font-size: 2.4rem !important; font-weight: 800 !important; } .tablepaket h4, .pricing-card h4 { color: #8892b0 !important; font-size: 0.9rem !important; font-weight: 400 !important; } .tablepaket .price, .pricing-card .price, .tablepaket .ucret { color: #ff6b35 !important; font-size: 2.4rem !important; font-weight: 800 !important; } .tablepaket .price .currency, .pricing-card .price .currency { font-size: 1.2rem !important; vertical-align: super !important; color: #ff8c5a !important; } .tablepaket .price .period, .pricing-card .price .period { font-size: 0.85rem !important; color: #5a6380 !important; font-weight: 400 !important; } /* Package line separator */ .paketline { border-color: rgba(255, 255, 255, 0.06) !important; } /* Features list */ .products_features, .tablepaket ul, .pricing-card ul, .tablepaket .ozellikler { color: #8892b0 !important; list-style: none !important; padding: 0 !important; margin: 20px 0 !important; } .tablepaket ul li, .pricing-card ul li, .tablepaket .ozellikler li, .products_features li { color: #8892b0 !important; padding: 8px 0 !important; border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important; font-size: 14px !important; display: flex !important; align-items: center !important; gap: 8px !important; } .tablepaket ul li::before, .pricing-card ul li::before { content: '\2713' !important; color: #ff6b35 !important; font-weight: 700 !important; font-size: 12px !important; width: 20px !important; height: 20px !important; border-radius: 50% !important; background: rgba(255, 107, 53, 0.15) !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0; } /* Table slogan */ .tableslogan { color: #8892b0 !important; font-size: 14px !important; } /* Package title section */ .pakettitle h1 { background: var(--iw-accent-gradient) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; font-weight: 800 !important; } .pakettitle h2 { color: #8892b0 !important; font-size: 1rem !important; font-weight: 400 !important; } /* ============================================ 12. ABOUT US (.anatanitim) ============================================ */ .anatanitim, .about-section { background: transparent !important; color: var(--iw-text-primary) !important; position: relative !important; } .anatanitim::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(180deg, rgba(10, 14, 39, 0.5) 0%, transparent 100%); pointer-events: none; } .anatanitim h1, .anatanitim h2, .anatanitim h3 { color: var(--iw-text-primary) !important; } .anatanitim h2 { background: var(--iw-accent-gradient) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; } .anatanitim p { color: #8892b0 !important; } .anatanitim .gonderbtn { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; color: #fff !important; border: none !important; border-radius: 10px !important; box-shadow: 0 4px 0 #cc4f20, 0 6px 10px rgba(0, 0, 0, 0.3) !important; padding: 12px 28px !important; font-weight: 600 !important; } /* ============================================ 13. STATISTICS / COUNTERS ============================================ */ .istatistik, .statistics-section, .stat-card { background: var(--iw-bg-card) !important; } .istatistik .sayi, .istatistik .number, .stat-card .stat-number { background: var(--iw-accent-gradient) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; font-weight: 800 !important; } .istatistik span, .stat-card .stat-label { color: var(--iw-text-secondary) !important; } .stat-card { border: 1px solid var(--iw-border); border-radius: var(--iw-radius-lg); padding: 32px; text-align: center; transition: var(--iw-transition); } .stat-card:hover { transform: translateY(-6px); border-color: rgba(255, 107, 53, 0.2); box-shadow: var(--iw-shadow-card-hover); } .stat-card .stat-number { font-size: 2.8rem; line-height: 1.2; } .stat-card .stat-label { font-size: 14px; margin-top: 8px; } /* ============================================ 14. CUSTOMER FEEDBACK (.musteriyorumlari) ============================================ */ .musteriyorumlari { background: transparent !important; } .musteriyorumlari .yorumbaslik { color: #ccd6f6 !important; font-weight: 600 !important; } .musteriyorumlari .yorumbaslik span { color: #ff6b35 !important; } .musteriyorumlari .yorum, .musteriyorumlari p { color: #8892b0 !important; } .testimonial-card { background: var(--iw-bg-card); border: 1px solid var(--iw-border); border-radius: var(--iw-radius-lg); padding: 32px; transition: var(--iw-transition); box-shadow: var(--iw-shadow-card); } .testimonial-card:hover { transform: translateY(-6px); box-shadow: var(--iw-shadow-card-hover); } .testimonial-card .quote { color: var(--iw-text-secondary); font-style: italic; line-height: 1.7; margin-bottom: 20px; } .testimonial-card .author-name { color: var(--iw-text-primary); font-weight: 600; } .testimonial-card .author-title { color: var(--iw-text-muted); font-size: 13px; } /* ============================================ 15. SOFTWARE (.anascript) ============================================ */ .anascript { background: transparent !important; } .anascriptlist { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius) !important; padding: 20px !important; transition: var(--iw-transition); } .anascriptlist:hover { border-color: rgba(255, 107, 53, 0.2) !important; transform: translateY(-4px); box-shadow: var(--iw-shadow-card-hover); } .scripthoverinfo { color: #ff6b35 !important; } .scripthoverinfo a { color: #ff6b35 !important; font-weight: 600 !important; } .scripthoverinfo a:hover { color: #ff8c5a !important; } /* ============================================ 16. FEATURES SECTION ============================================ */ .feature-card { background: var(--iw-bg-card); border: 1px solid var(--iw-border); border-radius: var(--iw-radius-lg); padding: 32px; transition: var(--iw-transition); box-shadow: var(--iw-shadow-card); } .feature-card:hover { transform: translateY(-8px); box-shadow: var(--iw-shadow-card-hover); border-color: var(--iw-border-hover); } .feature-card .feature-icon { width: 48px; height: 48px; border-radius: var(--iw-radius); background: rgba(255, 107, 53, 0.1); display: flex; align-items: center; justify-content: center; margin-bottom: 16px; color: #ff6b35; font-size: 22px; } .feature-card h4 { color: var(--iw-text-primary) !important; font-weight: 600; margin-bottom: 8px; } .feature-card p { color: var(--iw-text-secondary) !important; font-size: 14px; line-height: 1.6; margin: 0; } /* ============================================ 17. NEWS CARDS ============================================ */ .news-card { background: var(--iw-bg-card); border: 1px solid var(--iw-border); border-radius: var(--iw-radius-lg); overflow: hidden; transition: var(--iw-transition); box-shadow: var(--iw-shadow-card); } .news-card:hover { transform: translateY(-8px); box-shadow: var(--iw-shadow-card-hover); } .news-card .news-image { width: 100%; height: 200px; object-fit: cover; opacity: 0.8; transition: var(--iw-transition); } .news-card:hover .news-image { opacity: 1; } .news-card .news-content { padding: 24px; } .news-card .news-date { color: #ff6b35; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; } .news-card .news-title { color: var(--iw-text-primary) !important; font-weight: 600; margin: 8px 0; font-size: 16px; } .news-card .news-title a { color: var(--iw-text-primary) !important; text-decoration: none; transition: var(--iw-transition); } .news-card .news-title a:hover { color: #ff6b35 !important; } .news-card .news-excerpt { color: var(--iw-text-secondary) !important; font-size: 14px; line-height: 1.6; } /* ============================================ 18. SERVER LIST TABLE (.horizontal-list) ============================================ */ .horizontal-list { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius) !important; overflow: hidden !important; } .horizontal-list thead { background: rgba(255, 255, 255, 0.04) !important; } .horizontal-list th { color: #8892b0 !important; border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important; padding: 14px 16px !important; font-weight: 600 !important; font-size: 13px !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; } .horizontal-list td { color: #ccd6f6 !important; border-bottom: 1px solid rgba(255, 255, 255, 0.04) !important; padding: 12px 16px !important; } .horizontal-list tr:hover td { background: rgba(255, 107, 53, 0.04) !important; } /* Out of stock */ .sunucustok { background: rgba(220, 53, 69, 0.15) !important; color: #ff6b7a !important; border-radius: 20px !important; padding: 4px 12px !important; font-size: 12px !important; font-weight: 600 !important; display: inline-block !important; } /* ============================================ 19. FOOTER (.footer) ============================================ */ .footer, .main-footer, #footer { background: #080c20 !important; border-top: 1px solid rgba(255, 255, 255, 0.06) !important; color: #8892b0 !important; } .footer a, .main-footer a, #footer a { color: #8892b0 !important; transition: var(--iw-transition); } .footer a:hover, .main-footer a:hover, #footer a:hover { color: #ff6b35 !important; } .footslogan { color: #5a6380 !important; font-size: 13px !important; } .footslogan h4 { color: #ccd6f6 !important; } .footslogan h2 { background: var(--iw-accent-gradient) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; background-clip: text !important; } .footslogan h2 a { color: #ff6b35 !important; -webkit-text-fill-color: #ff6b35 !important; } .footcopyright { background: transparent !important; border-top: 1px solid var(--iw-border) !important; padding: 16px 0 !important; } .footcopyright span, .footcopyright p { color: #8892b0 !important; font-size: 13px !important; } .footblok { color: #8892b0 !important; } .footblok h3, .footblok h4, .footblok .title { color: #ccd6f6 !important; font-weight: 600 !important; margin-bottom: 16px !important; font-size: 16px !important; } .footblok a { color: #8892b0 !important; display: block; padding: 4px 0; transition: var(--iw-transition); } .footblok a:hover { color: #ff6b35 !important; padding-left: 4px; } .footlogos { border-top: 1px solid var(--iw-border) !important; padding: 24px 0 !important; background: transparent !important; } .footlogos img { opacity: 0.35; filter: brightness(0) invert(1); transition: var(--iw-transition); } .footlogos img:hover { opacity: 0.7; } .line { border-color: rgba(255, 255, 255, 0.06) !important; background: rgba(255, 255, 255, 0.06) !important; } /* ============================================ 20. NEWSLETTER (.ebulten) ============================================ */ .ebulten, .newsletter { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius-lg) !important; padding: 48px !important; margin: 40px 0 !important; } .ebulten input[type="text"], .ebulten input[type="email"], .ebulten input[name="email"], .newsletter input[type="text"], .newsletter input[type="email"] { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 10px !important; color: #ccd6f6 !important; padding: 14px 20px !important; font-size: 15px !important; width: 100% !important; transition: var(--iw-transition); } .ebulten input:focus, .newsletter input:focus { border-color: #ff6b35 !important; box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.15) !important; outline: none !important; } .ebulten .gonderbtn, .ebulten .aboneolbtn, .newsletter .gonderbtn, .newsletter button { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; color: #fff !important; border: none !important; border-radius: 10px !important; padding: 14px 28px !important; font-weight: 600 !important; cursor: pointer !important; transition: var(--iw-transition); box-shadow: 0 4px 0 #cc4f20, 0 6px 10px rgba(0, 0, 0, 0.3) !important; } .ebulten .gonderbtn:hover, .ebulten .aboneolbtn:hover, .newsletter .gonderbtn:hover, .newsletter button:hover { transform: translateY(-2px) !important; box-shadow: 0 6px 0 #cc4f20, 0 10px 20px rgba(0, 0, 0, 0.4) !important; } /* ============================================ 21. TABLES (General) ============================================ */ table { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius) !important; overflow: hidden; } table thead { background: rgba(255, 107, 53, 0.08) !important; } table th { color: var(--iw-text-primary) !important; border-bottom: 1px solid var(--iw-border) !important; font-weight: 600 !important; padding: 14px 16px !important; } table td { color: var(--iw-text-secondary) !important; border-bottom: 1px solid var(--iw-border) !important; padding: 12px 16px !important; } table tr:hover td { background: rgba(255, 255, 255, 0.02) !important; } table tfoot td { border-top: 1px solid var(--iw-border) !important; } /* ============================================ 22. DATATABLES OVERRIDE ============================================ */ .dataTables_wrapper { color: var(--iw-text-primary) !important; } table.dataTable { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-collapse: collapse !important; } table.dataTable thead th { background: rgba(255, 107, 53, 0.08) !important; color: var(--iw-text-primary) !important; border-bottom: 2px solid rgba(255, 107, 53, 0.15) !important; padding: 12px 16px !important; } table.dataTable tbody td { color: var(--iw-text-secondary) !important; border-bottom: 1px solid var(--iw-border) !important; padding: 10px 16px !important; } table.dataTable tbody tr:hover td { background: rgba(255, 107, 53, 0.04) !important; } table.dataTable tbody tr.odd { background: rgba(255, 255, 255, 0.01) !important; } table.dataTable tbody tr.even { background: transparent !important; } .dataTables_length, .dataTables_filter, .dataTables_info, .dataTables_paginate { color: var(--iw-text-secondary) !important; padding: 8px 0 !important; } .dataTables_length select { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid var(--iw-border) !important; color: var(--iw-text-primary) !important; border-radius: var(--iw-radius-sm) !important; padding: 4px 8px !important; } .dataTables_filter input { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid var(--iw-border) !important; color: var(--iw-text-primary) !important; border-radius: var(--iw-radius-sm) !important; padding: 6px 12px !important; } .dataTables_filter input:focus { border-color: #ff6b35 !important; } .dataTables_paginate .paginate_button { background: rgba(255, 255, 255, 0.05) !important; border: 1px solid var(--iw-border) !important; color: var(--iw-text-secondary) !important; border-radius: var(--iw-radius-sm) !important; margin: 0 2px !important; padding: 4px 12px !important; } .dataTables_paginate .paginate_button:hover { background: rgba(255, 107, 53, 0.1) !important; border-color: var(--iw-accent) !important; color: #ff6b35 !important; } .dataTables_paginate .paginate_button.current { background: var(--iw-accent-gradient) !important; border-color: transparent !important; color: #fff !important; } .dataTables_paginate .paginate_button.disabled { opacity: 0.3 !important; cursor: not-allowed !important; } /* ============================================ 23. SIGN-IN / SIGN-UP PAGES ============================================ */ .girisgonder, .giriskayit { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius-lg) !important; padding: 40px !important; box-shadow: var(--iw-shadow-card) !important; } .girisgonder input[type="text"], .girisgonder input[type="email"], .girisgonder input[type="password"], .giriskayit input[type="text"], .giriskayit input[type="email"], .giriskayit input[type="password"] { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 10px !important; color: #ccd6f6 !important; padding: 12px 16px !important; } .girisgonder h1, .girisgonder h2, .girisgonder h3, .giriskayit h1, .giriskayit h2, .giriskayit h3 { color: #ccd6f6 !important; } .girisgonder .gonderbtn, .giriskayit .gonderbtn { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; color: #fff !important; border: none !important; border-radius: 10px !important; box-shadow: 0 4px 0 #cc4f20, 0 6px 10px rgba(0, 0, 0, 0.3) !important; padding: 12px 28px !important; font-weight: 600 !important; width: 100% !important; } .girisgonder a, .giriskayit a { color: #ff6b35 !important; } /* ============================================ 24. CONTACT PAGE (.iletisim) ============================================ */ .iletisim { background: transparent !important; } .iletisim input, .iletisim textarea { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 10px !important; color: #ccd6f6 !important; padding: 12px 16px !important; } .iletisim input:focus, .iletisim textarea:focus { border-color: #ff6b35 !important; box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.1) !important; } .iletisim .gonderbtn { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; color: #fff !important; border: none !important; border-radius: 10px !important; box-shadow: 0 4px 0 #cc4f20, 0 6px 10px rgba(0, 0, 0, 0.3) !important; } /* ============================================ 25. KNOWLEDGE BASE (.bilgibankasi) ============================================ */ .bilgibankasi { background: transparent !important; color: var(--iw-text-primary) !important; } .bbkategori { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius) !important; padding: 24px !important; transition: var(--iw-transition); } .bbkategori:hover { border-color: rgba(255, 107, 53, 0.2) !important; transform: translateY(-4px); box-shadow: var(--iw-shadow-card); } .bbkategori h3, .bbkategori h4 { color: #ccd6f6 !important; } .bbkategori a { color: #8892b0 !important; } .bbkategori a:hover { color: #ff6b35 !important; } /* ============================================ 26. GDPR (.kinfo) ============================================ */ .kinfo { color: #8892b0 !important; font-size: 13px !important; line-height: 1.6 !important; } .kinfo a { color: #ff6b35 !important; text-decoration: underline !important; } .kinfo a:hover { color: #ff8c5a !important; } /* ============================================ 27. SWEETALERT OVERRIDE ============================================ */ .swal-overlay { background-color: rgba(10, 14, 39, 0.85) !important; } .swal-modal { background: #0d1135 !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; border-radius: var(--iw-radius-lg) !important; box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5) !important; } .swal-title { color: #ccd6f6 !important; font-weight: 700 !important; } .swal-text { color: #8892b0 !important; } .swal-button { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; border: none !important; border-radius: 10px !important; box-shadow: 0 4px 0 #cc4f20, 0 4px 8px rgba(0, 0, 0, 0.2) !important; font-weight: 600 !important; transition: var(--iw-transition); } .swal-button:hover { transform: translateY(-2px) !important; box-shadow: 0 6px 0 #cc4f20, 0 8px 16px rgba(0, 0, 0, 0.3) !important; } .swal-button--cancel { background: rgba(255, 255, 255, 0.05) !important; color: #8892b0 !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; box-shadow: none !important; } .swal-button--cancel:hover { background: rgba(255, 255, 255, 0.1) !important; color: #ccd6f6 !important; } .swal-button--danger { background: linear-gradient(to bottom, #dc3545, #c82333) !important; box-shadow: 0 4px 0 #a71d2a, 0 4px 8px rgba(0, 0, 0, 0.2) !important; } /* Swal2 (newer version) */ .swal2-popup { background: #0d1135 !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; border-radius: var(--iw-radius-lg) !important; color: var(--iw-text-primary) !important; } .swal2-title { color: #ccd6f6 !important; } .swal2-content, .swal2-html-container { color: #8892b0 !important; } .swal2-confirm { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; border: none !important; border-radius: 10px !important; box-shadow: 0 4px 0 #cc4f20 !important; } .swal2-cancel { background: rgba(255, 255, 255, 0.05) !important; color: #8892b0 !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 10px !important; } .swal2-input { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; color: #ccd6f6 !important; border-radius: 10px !important; } /* ============================================ 28. SELECT2 OVERRIDE ============================================ */ .select2-container--default .select2-selection--single, .select2-container--default .select2-selection--multiple { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 10px !important; color: #ccd6f6 !important; min-height: 42px !important; } .select2-container--default .select2-selection--single .select2-selection__rendered { color: #ccd6f6 !important; line-height: 42px !important; padding-left: 12px !important; } .select2-container--default .select2-selection--single .select2-selection__arrow { height: 42px !important; } .select2-container--default .select2-selection--single .select2-selection__arrow b { border-color: #8892b0 transparent transparent transparent !important; } .select2-container--default .select2-selection--multiple .select2-selection__rendered { color: #ccd6f6 !important; } .select2-container--default .select2-selection--multiple .select2-selection__choice { background: rgba(255, 107, 53, 0.15) !important; border: 1px solid rgba(255, 107, 53, 0.3) !important; color: #ff8c5a !important; border-radius: 6px !important; } .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #ff6b35 !important; } .select2-container--default .select2-search--inline .select2-search__field { color: #ccd6f6 !important; } .select2-dropdown { background: #0d1135 !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; border-radius: 10px !important; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4) !important; } .select2-container--default .select2-results__option { color: #8892b0 !important; padding: 10px 16px !important; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background: rgba(255, 107, 53, 0.1) !important; color: #ff6b35 !important; } .select2-container--default .select2-results__option[aria-selected=true] { background: rgba(255, 107, 53, 0.2) !important; color: #ff6b35 !important; } .select2-search--dropdown .select2-search__field { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; color: #ccd6f6 !important; border-radius: 8px !important; padding: 8px 12px !important; } /* ============================================ 29. PANELS, WELLS, ALERTS, LABELS ============================================ */ .panel, .well { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius) !important; color: var(--iw-text-primary) !important; } .panel-heading { background: rgba(255, 107, 53, 0.06) !important; border-bottom: 1px solid var(--iw-border) !important; color: var(--iw-text-primary) !important; } .panel-body { color: var(--iw-text-secondary) !important; } .panel-footer { background: rgba(255, 255, 255, 0.02) !important; border-top: 1px solid var(--iw-border) !important; } .alert { border-radius: var(--iw-radius-sm) !important; border: 1px solid var(--iw-border) !important; } .alert-success { background: rgba(40, 167, 69, 0.1) !important; color: #6dd693 !important; border-color: rgba(40, 167, 69, 0.2) !important; } .alert-warning { background: rgba(255, 193, 7, 0.1) !important; color: #ffd54f !important; border-color: rgba(255, 193, 7, 0.2) !important; } .alert-danger { background: rgba(220, 53, 69, 0.1) !important; color: #ff6b7a !important; border-color: rgba(220, 53, 69, 0.2) !important; } .alert-info { background: rgba(79, 156, 247, 0.1) !important; color: #7cb8ff !important; border-color: rgba(79, 156, 247, 0.2) !important; } .label { border-radius: 20px !important; padding: 3px 10px !important; font-size: 11px !important; font-weight: 600 !important; } .label-success { background: rgba(40, 167, 69, 0.2) !important; color: #6dd693 !important; } .label-warning { background: rgba(255, 193, 7, 0.2) !important; color: #ffd54f !important; } .label-danger { background: rgba(220, 53, 69, 0.2) !important; color: #ff6b7a !important; } .label-info { background: rgba(79, 156, 247, 0.2) !important; color: #7cb8ff !important; } .label-default { background: rgba(255, 255, 255, 0.1) !important; color: #8892b0 !important; } /* ============================================ 30. PAGINATION, BREADCRUMBS ============================================ */ .pagination li a { background: rgba(255, 255, 255, 0.05) !important; border: 1px solid var(--iw-border) !important; color: var(--iw-text-secondary) !important; border-radius: var(--iw-radius-sm) !important; margin: 0 2px !important; transition: var(--iw-transition); } .pagination li a:hover { background: rgba(255, 107, 53, 0.1) !important; border-color: var(--iw-accent) !important; color: #ff6b35 !important; } .pagination li.active a { background: var(--iw-accent-gradient) !important; border-color: transparent !important; color: #fff !important; } .breadcrumb { background: transparent !important; border: none !important; } .breadcrumb li, .breadcrumb a { color: #5a6380 !important; } .breadcrumb li.active, .breadcrumb li:last-child { color: #ff6b35 !important; } /* ============================================ 31. MODALS, DROPDOWNS, TOOLTIPS ============================================ */ .modal-content { background: #0d1135 !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; border-radius: var(--iw-radius-lg) !important; color: var(--iw-text-primary) !important; } .modal-header { border-bottom: 1px solid var(--iw-border) !important; } .modal-footer { border-top: 1px solid var(--iw-border) !important; } .modal-title { color: var(--iw-text-primary) !important; } .modal-backdrop { background: rgba(10, 14, 39, 0.8) !important; } .modal-body { color: var(--iw-text-secondary) !important; } .close { color: var(--iw-text-secondary) !important; text-shadow: none !important; opacity: 0.7; } .close:hover { color: #ff6b35 !important; opacity: 1; } .dropdown-menu { background: #0d1135 !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; border-radius: var(--iw-radius) !important; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4) !important; } .dropdown-menu li a { color: #8892b0 !important; transition: var(--iw-transition); } .dropdown-menu li a:hover { background: rgba(255, 107, 53, 0.1) !important; color: #ff6b35 !important; } .dropdown-header { color: var(--iw-text-muted) !important; } .tooltip-inner { background: #0d1135 !important; color: var(--iw-text-primary) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius-sm) !important; } .tooltip-arrow { border-color: #0d1135 !important; } .tooltip.top .tooltip-arrow { border-top-color: rgba(255, 255, 255, 0.06) !important; } .tooltip.bottom .tooltip-arrow { border-bottom-color: rgba(255, 255, 255, 0.06) !important; } .tooltip.left .tooltip-arrow { border-left-color: rgba(255, 255, 255, 0.06) !important; } .tooltip.right .tooltip-arrow { border-right-color: rgba(255, 255, 255, 0.06) !important; } /* ============================================ 32. NAV TABS, LIST GROUPS, PROGRESS ============================================ */ .nav-tabs { border-bottom: 1px solid var(--iw-border) !important; } .nav-tabs li a { color: var(--iw-text-secondary) !important; border: 1px solid transparent !important; border-radius: var(--iw-radius-sm) var(--iw-radius-sm) 0 0 !important; transition: var(--iw-transition); } .nav-tabs li a:hover { background: rgba(255, 255, 255, 0.05) !important; border-color: var(--iw-border) !important; color: #ff6b35 !important; } .nav-tabs li.active a { background: rgba(255, 107, 53, 0.1) !important; border-color: var(--iw-border) var(--iw-border) transparent !important; color: #ff6b35 !important; } .tab-content { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-top: none !important; border-radius: 0 0 var(--iw-radius) var(--iw-radius) !important; padding: 20px !important; } .nav-pills li a { color: var(--iw-text-secondary) !important; border-radius: 30px !important; transition: var(--iw-transition); } .nav-pills li a:hover { background: rgba(255, 107, 53, 0.1) !important; color: #ff6b35 !important; } .nav-pills li.active a { background: var(--iw-accent-gradient) !important; color: #fff !important; } .list-group-item { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; color: var(--iw-text-secondary) !important; } .list-group-item:hover { background: var(--iw-bg-card-hover) !important; } .progress { background: rgba(255, 255, 255, 0.05) !important; border-radius: 10px !important; } .progress-bar { background: var(--iw-accent-gradient) !important; border-radius: 10px !important; } /* ============================================ 33. MISCELLANEOUS BOOTSTRAP ============================================ */ .well { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; color: var(--iw-text-secondary) !important; box-shadow: none !important; } .thumbnail { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius) !important; } .thumbnail .caption { color: var(--iw-text-secondary) !important; } .carousel-indicators li { background: rgba(255, 255, 255, 0.2) !important; border: none !important; } .carousel-indicators li.active { background: #ff6b35 !important; } .carousel-control { color: #ff6b35 !important; } .carousel-caption { color: var(--iw-text-primary) !important; } .jumbotron { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; color: var(--iw-text-primary) !important; } .codehilite, pre, code { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius-sm) !important; color: var(--iw-text-primary) !important; } .blockquote, blockquote { border-left-color: var(--iw-accent) !important; color: var(--iw-text-secondary) !important; } .blockquote-footer, blockquote footer { color: var(--iw-text-muted) !important; } dl dt { color: var(--iw-text-primary) !important; } dl dd { color: var(--iw-text-secondary) !important; } /* ============================================ 34. CLIENT AREA / PANEL ============================================ */ .client-area, #client-area { background: var(--iw-bg-primary) !important; color: var(--iw-text-primary) !important; } #modernpanel, .muspanel { background: var(--iw-bg-primary) !important; color: var(--iw-text-primary) !important; } .rightcontent { background: var(--iw-bg-primary) !important; } .rightconhead { background: transparent !important; border-bottom: 1px solid var(--iw-border) !important; } .modernclient-rightcon { background: var(--iw-bg-primary) !important; color: var(--iw-text-primary) !important; } .sidebar { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius) !important; } .sidebar .menu a { color: #8892b0 !important; border-left: 3px solid transparent !important; padding: 10px 16px !important; display: block !important; transition: var(--iw-transition); } .sidebar .menu a:hover, .sidebar .menu a.active { color: #ff6b35 !important; background: rgba(255, 107, 53, 0.08) !important; border-left-color: #ff6b35 !important; } .ticket-list { background: var(--iw-bg-card) !important; border: 1px solid var(--iw-border) !important; border-radius: var(--iw-radius) !important; } /* ============================================ 35. WISECP COLOR OVERRIDES ============================================ */ .btn-success { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; border-color: var(--iw-accent) !important; color: #fff !important; } .btn-success:hover { background: var(--iw-accent-light) !important; } .btn-danger { background: linear-gradient(to bottom, #dc3545, #c82333) !important; border-color: #dc3545 !important; color: #fff !important; } .btn-warning { background: linear-gradient(to bottom, #ffc107, #e0a800) !important; border-color: #ffc107 !important; color: #000 !important; } .btn-info { background: linear-gradient(to bottom, #4f9cf7, #3a7fd5) !important; border-color: #4f9cf7 !important; color: #fff !important; } /* Override any hardcoded teal/green backgrounds */ [style*="background-color: #00b894"], [style*="background-color:#00b894"], [style*="background-color: #00cec9"], [style*="background-color:#00cec9"], [style*="background-color: #55efc4"], [style*="background-color:#55efc4"], [style*="background: #00b894"], [style*="background:#00b894"], [style*="background: #00cec9"], [style*="background:#00cec9"], [style*="background-color: #1abc9c"], [style*="background-color:#1abc9c"], [style*="background-color: #2ecc71"], [style*="background-color:#2ecc71"] { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; } .text-success, .text-green { color: #ff6b35 !important; } .bg-success { background-color: rgba(255, 107, 53, 0.1) !important; } .text-primary { color: #ff6b35 !important; } .text-warning { color: #ffd54f !important; } .text-danger { color: #ff6b7a !important; } .text-info { color: #7cb8ff !important; } .text-muted { color: #5a6380 !important; } /* ============================================ 36. SOCIAL SHARE BUTTONS ============================================ */ .paypasbutonlar { background: transparent !important; padding: 12px 0 !important; display: flex !important; align-items: center !important; gap: 8px !important; } .paypasbutonlar a, .paypasbutonlar .lbtn { color: #8892b0 !important; background: rgba(255, 255, 255, 0.05) !important; border: 1px solid var(--iw-border) !important; border-radius: 8px !important; padding: 8px 14px !important; transition: var(--iw-transition); display: inline-flex !important; align-items: center !important; gap: 6px !important; } .paypasbutonlar a:hover, .paypasbutonlar .lbtn:hover { color: #ff6b35 !important; border-color: rgba(255, 107, 53, 0.3) !important; background: rgba(255, 107, 53, 0.08) !important; } /* ============================================ 37. THEME PREVIEW BAR ============================================ */ .themepreview { background: var(--iw-bg-card) !important; border-bottom: 1px solid var(--iw-border) !important; color: var(--iw-text-primary) !important; padding: 10px 20px !important; text-align: center !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 16px !important; } .themepreview h5 { color: #ccd6f6 !important; margin: 0 !important; font-size: 14px !important; } .themepreview a, .themepreview .lbtn { color: #ff6b35 !important; background: rgba(255, 107, 53, 0.1) !important; border: 1px solid rgba(255, 107, 53, 0.3) !important; border-radius: 8px !important; padding: 6px 16px !important; font-weight: 600 !important; font-size: 13px !important; } /* ============================================ 38. SCROLL TO TOP (.cd-top) ============================================ */ .cd-top { background: var(--iw-accent-gradient) !important; color: #fff !important; border: none !important; border-radius: 50% !important; width: 44px !important; height: 44px !important; display: flex !important; align-items: center !important; justify-content: center !important; position: fixed !important; bottom: 24px !important; right: 24px !important; z-index: 9999 !important; cursor: pointer !important; transition: var(--iw-transition) !important; box-shadow: 0 4px 15px rgba(255, 107, 53, 0.3) !important; font-size: 0 !important; text-indent: -9999px !important; overflow: hidden !important; opacity: 0 !important; visibility: hidden !important; } .cd-top.cd-is-visible { opacity: 1 !important; visibility: visible !important; } .cd-top:hover { transform: translateY(-3px) !important; box-shadow: 0 8px 25px rgba(255, 107, 53, 0.5) !important; background: var(--iw-accent-gradient) !important; color: #fff !important; } /* ============================================ 39. WRAPPER & CLEAR ============================================ */ #wrapper { max-width: 1200px !important; margin: 0 auto !important; padding: 0 20px !important; } .clear { clear: both !important; } /* ============================================ 40. REVOLUTION SLIDER DARK OVERLAY ============================================ */ .tp-overlay { background: rgba(10, 14, 39, 0.6) !important; } .rev_slider, .tp-simpleresponsive { background: var(--iw-bg-primary) !important; } .tp-bullet { background: rgba(255, 255, 255, 0.3) !important; } .tp-bullet.selected { background: #ff6b35 !important; } .tp-leftarrow, .tp-rightarrow { color: #ff6b35 !important; } /* ============================================ 41. AOS ANIMATION ENHANCEMENT ============================================ */ [data-aos] { transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important; } /* ============================================ 42. RESPONSIVE DESIGN ============================================ */ @media (max-width: 1199px) { .card-3d-pricing:hover { transform: translateY(-8px) scale(1.01) !important; } } @media (max-width: 991px) { .card-3d-pricing:hover { transform: translateY(-6px) scale(1.01) !important; } .tablepaket:hover, .pricing-card:hover, .product-card:hover { transform: translateY(-6px) !important; } .section-header h2 { font-size: 1.8rem; } .sayfabaslik h1 { font-size: 1.6rem !important; } #wrapper { padding: 0 16px !important; } .homedomainarea, .domain-check-area, .domain-search { padding: 28px !important; } .ebulten, .newsletter { padding: 32px !important; } } @media (max-width: 767px) { .homedomainarea, .domain-check-area, .domain-search { padding: 20px !important; } .ebulten, .newsletter { padding: 24px !important; } .card-3d-pricing { padding: 28px 20px !important; } .card-3d-pricing:hover { transform: none !important; } .tablepaket:hover, .pricing-card:hover, .product-card:hover { transform: none !important; } .section-header h2 { font-size: 1.5rem; } .stat-card .stat-number { font-size: 2rem; } .miotab-labels, .tablopaketler { gap: 6px !important; } .miotab-labels a, .miotab-labels li a, .tablopaketler a { padding: 8px 16px !important; font-size: 13px !important; } .girisgonder, .giriskayit { padding: 24px !important; } .horizontal-list { font-size: 13px !important; } .horizontal-list th, .horizontal-list td { padding: 8px 10px !important; } .sayfabaslik h1 { font-size: 1.4rem !important; } #wrapper { padding: 0 12px !important; } } @media (max-width: 575px) { .section-header h2 { font-size: 1.3rem; } .stat-card .stat-number { font-size: 1.6rem; } .card-3d { padding: 20px; } .feature-card { padding: 20px; } .testimonial-card { padding: 20px; } } /* ============================================ 43. PRINT STYLES (keep light for printing) ============================================ */ @media print { body { background: #fff !important; color: #000 !important; } .header, .footer, .cd-top, .iw-hamburger, .iw-mobile-menu, .iw-mobile-menu-overlay { display: none !important; } } /* ============================================ COOKIE CONSENT POPUP - Dark Theme Override ============================================ */ .cookie-consent, .cookie-banner, .cookie-notice, .cookie-modal, .cookie-popup, #cookie-notice, .cookie-consent-container, .cc-window, .cc-banner, .cc-floating, [data-cookie-banner], .iziModal-content, .iziModal-header, .iziModal-body, .iziModal-footer { background: rgba(13, 17, 53, 0.98) !important; color: #ccd6f6 !important; border: 1px solid rgba(255, 255, 255, 0.08) !important; border-radius: 12px !important; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important; } .cookie-consent a, .cookie-banner a, .cookie-notice a, #cookie-notice a, .cc-window a { color: #ff6b35 !important; } .cookie-consent button, .cookie-banner button, .cookie-notice button, #cookie-notice button, .cc-window .cc-btn, .cc-btn { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; color: #fff !important; border: none !important; border-radius: 8px !important; padding: 10px 24px !important; font-weight: 600 !important; cursor: pointer !important; box-shadow: 0 4px 0 #cc4f20, 0 6px 10px rgba(0, 0, 0, 0.3) !important; } .cookie-consent button:hover, .cc-btn:hover { transform: translateY(-1px) !important; box-shadow: 0 6px 0 #cc4f20, 0 8px 15px rgba(0, 0, 0, 0.4) !important; } /* SweetAlert2 dark theme */ .swal2-popup { background: #0d1135 !important; color: #ccd6f6 !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; border-radius: 16px !important; } .swal2-title { color: #ccd6f6 !important; } .swal2-html-container, .swal2-content { color: #8892b0 !important; } .swal2-confirm { background: linear-gradient(to bottom, #ff6b35, #e85d2a) !important; color: #fff !important; border: none !important; border-radius: 10px !important; box-shadow: 0 4px 0 #cc4f20 !important; } .swal2-cancel { background: rgba(255, 255, 255, 0.05) !important; color: #8892b0 !important; border: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 10px !important; } /* iziModal dark theme */ .iziModal-overlay { background: rgba(10, 14, 39, 0.85) !important; } .iziModal { background: #0d1135 !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; border-radius: 16px !important; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5) !important; } .iziModal-header { background: rgba(255, 255, 255, 0.03) !important; border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important; color: #ccd6f6 !important; } .iziModal-title { color: #ccd6f6 !important; } .iziModal-body { color: #8892b0 !important; }