/* ============================================ WHMCS Six Theme - Minimal Override Dosya yolu: /templates/six/css/custom.css ============================================ */ /* --- Temel Değişkenler --- */ :root { --primary: #111111; --accent: #2563eb; --accent-hover:#1d4ed8; --bg: #f8f8f7; --surface: #ffffff; --border: #e5e5e3; --text: #1a1a1a; --muted: #6b6b6b; --radius: 6px; --shadow: 0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.05); } /* --- Reset & Body --- */ body { background: var(--bg) !important; color: var(--text) !important; font-family: 'DM Sans', 'Helvetica Neue', Arial, sans-serif !important; font-size: 15px; line-height: 1.6; } /* Google Font import — bunu 'e ekle veya @import olarak bırak */ @import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&display=swap'); /* --- Navbar --- */ #header, .navbar, .navbar-default { background: var(--surface) !important; border-bottom: 1px solid var(--border) !important; box-shadow: none !important; padding: 0 !important; } .navbar-brand { font-weight: 600 !important; font-size: 1.1rem !important; color: var(--primary) !important; letter-spacing: -.3px; } .navbar-nav > li > a { color: var(--muted) !important; font-size: .875rem !important; font-weight: 500 !important; padding: 18px 14px !important; transition: color .15s !important; } .navbar-nav > li > a:hover, .navbar-nav > li.active > a { color: var(--primary) !important; background: transparent !important; } /* --- Buttons --- */ .btn-primary, .btn-success { background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important; border-radius: var(--radius) !important; font-weight: 500 !important; padding: 9px 20px !important; font-size: .875rem !important; letter-spacing: .01em; box-shadow: none !important; transition: background .15s, transform .1s !important; } .btn-primary:hover, .btn-success:hover { background: var(--accent-hover) !important; border-color: var(--accent-hover) !important; transform: translateY(-1px); } .btn-default { background: var(--surface) !important; border: 1px solid var(--border) !important; color: var(--text) !important; border-radius: var(--radius) !important; font-weight: 500 !important; font-size: .875rem !important; transition: border-color .15s !important; } .btn-default:hover { border-color: #aaa !important; background: #fafafa !important; } /* --- Cards & Panels --- */ .panel, .panel-default { border: 1px solid var(--border) !important; border-radius: var(--radius) !important; box-shadow: var(--shadow) !important; background: var(--surface) !important; } .panel-heading { background: var(--surface) !important; border-bottom: 1px solid var(--border) !important; font-weight: 600 !important; font-size: .8rem !important; letter-spacing: .06em; text-transform: uppercase; color: var(--muted) !important; padding: 14px 20px !important; } .panel-body { padding: 20px !important; } /* --- Form Inputs --- */ .form-control { border: 1px solid var(--border) !important; border-radius: var(--radius) !important; box-shadow: none !important; font-size: .875rem !important; color: var(--text) !important; background: var(--surface) !important; padding: 8px 12px !important; transition: border-color .15s !important; } .form-control:focus { border-color: var(--accent) !important; outline: 3px solid rgba(37,99,235,.12) !important; box-shadow: none !important; } /* --- Tables --- */ .table { border-collapse: separate !important; border-spacing: 0 !important; } .table > thead > tr > th { background: #f3f3f1 !important; border-bottom: 1px solid var(--border) !important; font-size: .75rem !important; font-weight: 600 !important; letter-spacing: .05em; text-transform: uppercase; color: var(--muted) !important; padding: 10px 16px !important; } .table > tbody > tr > td { border-top: 1px solid var(--border) !important; padding: 12px 16px !important; font-size: .875rem !important; vertical-align: middle !important; } .table-striped > tbody > tr:nth-of-type(odd) { background: #fafaf9 !important; } /* --- Alerts --- */ .alert { border-radius: var(--radius) !important; border: 1px solid transparent !important; font-size: .875rem !important; padding: 12px 16px !important; } .alert-info { background: #eff6ff !important; border-color: #bfdbfe !important; color: #1e40af !important; } .alert-success { background: #f0fdf4 !important; border-color: #bbf7d0 !important; color: #166534 !important; } .alert-warning { background: #fffbeb !important; border-color: #fde68a !important; color: #92400e !important; } .alert-danger { background: #fef2f2 !important; border-color: #fecaca !important; color: #991b1b !important; } /* --- Breadcrumb --- */ .breadcrumb { background: transparent !important; padding: 0 !important; margin-bottom: 16px !important; font-size: .8rem !important; color: var(--muted) !important; } .breadcrumb > li + li::before { color: var(--border) !important; } .breadcrumb > .active { color: var(--text) !important; } /* --- Hero / Jumbotron --- */ .jumbotron { background: var(--primary) !important; color: #fff !important; border-radius: var(--radius) !important; padding: 48px 40px !important; box-shadow: none !important; } .jumbotron h1 { font-weight: 600 !important; letter-spacing: -.5px; } .jumbotron p { color: rgba(255,255,255,.7) !important; } /* --- Footer --- */ #footer, footer { background: var(--surface) !important; border-top: 1px solid var(--border) !important; color: var(--muted) !important; font-size: .8rem !important; padding: 24px 0 !important; box-shadow: none !important; } /* --- Sidebar (Hesabım menüsü) --- */ .list-group-item { border-color: var(--border) !important; font-size: .875rem !important; padding: 10px 16px !important; color: var(--text) !important; background: var(--surface) !important; } .list-group-item.active, .list-group-item:hover { background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important; } /* --- Pager / Pagination --- */ .pagination > li > a, .pagination > li > span { border-color: var(--border) !important; color: var(--text) !important; font-size: .8rem !important; padding: 6px 12px !important; } .pagination > .active > a { background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important; } /* --- Badges & Labels --- */ .label-default { background: #e5e5e3 !important; color: var(--text) !important; } .label-primary { background: var(--accent) !important; } .label-success { background: #16a34a !important; } .label-danger { background: #dc2626 !important; } .label-warning { background: #d97706 !important; } /* --- Ürün/Servis Fiyatlandırma Kartları --- */ .product-list .panel { transition: box-shadow .2s, transform .2s !important; } .product-list .panel:hover { box-shadow: 0 8px 24px rgba(0,0,0,.1) !important; transform: translateY(-2px); } /* --- Global scrollbar (webkit) --- */ ::-webkit-scrollbar { width: 6px; height: 6px; } ::-webkit-scrollbar-track { background: transparent; } ::-webkit-scrollbar-thumb { background: #d0d0cc; border-radius: 99px; } /* --- Genel link rengi --- */ a { color: var(--accent) !important; text-decoration: none !important; } a:hover { color: var(--accent-hover) !important; } /* ============================================ KURULUM: 1. WHMCS admin paneli → Setup → General Settings → Template → Six seçili olduğundan emin ol 2. Bu dosyayı şuraya koy: /templates/six/css/custom.css 3. /templates/six/header.tpl içinde bölümüne ekle: ============================================ */