/*
 * Author: amirhossinbanavand
 * Website: banclub.ir
 * File: global.css (Infrastructure & Base Styles)
 * Version: 1.0.0 Final
 */

/* 1. Typography Setup */
@font-face {
    font-family: 'Nazanin';
    src: url('../fonts/Nazanin.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* 2. Color System & Variables (Snowy Dark Theme) */
:root {
    /* Primary Colors */
    --ban-bg: #0a0b10;
    --ban-sidebar: rgba(16, 18, 27, 0.9);
    --ban-surface: #13151f;
    --ban-glass: rgba(25, 28, 41, 0.6);
    --ban-border: rgba(255, 255, 255, 0.08);
    
    /* Accent Colors */
    --ban-accent: #00c853;
    --ban-accent-hover: #00e676;
    --ban-accent-glow: rgba(0, 200, 83, 0.3);
    
    /* Text Colors */
    --ban-text: #f1f5f9;
    --ban-text-muted: #94a3b8;
    --ban-white: #ffffff;
    
    /* Feedback Colors */
    --ban-success: #10b981;
    --ban-danger: #ef4444;
    --ban-warning: #f59e0b;
    --ban-info: #3b82f6;

    /* Transitions */
    --ban-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Light Mode Variables */
body.light-mode {
    --ban-bg: #f8fafc;
    --ban-sidebar: #ffffff;
    --ban-surface: #ffffff;
    --ban-glass: rgba(255, 255, 255, 0.8);
    --ban-border: rgba(0, 0, 0, 0.05);
    --ban-text: #1e293b;
    --ban-text-muted: #64748b;
}

/* 3. Global Reset & Base */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    font-size: 16px;
}

body {
    font-family: 'Nazanin', 'Tahoma', 'Arial', sans-serif;
    background-color: var(--ban-bg);
    color: var(--ban-text);
    line-height: 1.6;
    overflow-x: hidden;
    direction: rtl;
    text-align: right;
    transition: var(--ban-transition);
}

/* 4. Custom Scrollbar (Professional Minimalist) */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--ban-bg);
}

::-webkit-scrollbar-thumb {
    background: var(--ban-border);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--ban-accent);
}

/* 5. Global Glassmorphism & Cards */
.ban-glass-card {
    background: var(--ban-glass);
    backdrop-filter: blur(20px) saturate(160%);
    -webkit-backdrop-filter: blur(20px) saturate(160%);
    border: 1px solid var(--ban-border);
    border-radius: 24px;
    padding: 25px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: var(--ban-transition);
}

.ban-glass-card:hover {
    border-color: var(--ban-accent);
    box-shadow: 0 15px 40px rgba(0, 200, 83, 0.1);
}

/* 6. Typography Utilities */
h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    color: var(--ban-white);
    margin-bottom: 1rem;
}

body.light-mode h1, body.light-mode h2, body.light-mode h3 {
    color: var(--ban-text);
}

.text-accent { color: var(--ban-accent) !important; }
.text-muted { color: var(--ban-text-muted) !important; }

/* 7. Button Framework */
.ban-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 24px;
    border-radius: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: var(--ban-transition);
    border: none;
    gap: 10px;
    font-size: 14px;
}

.ban-btn-primary {
    background: var(--ban-accent);
    color: #000 !important;
    box-shadow: 0 4px 15px var(--ban-accent-glow);
}

.ban-btn-primary:hover {
    background: var(--ban-accent-hover);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px var(--ban-accent-glow);
}

.ban-btn-outline {
    background: transparent;
    border: 1px solid var(--ban-border);
    color: var(--ban-text) !important;
}

.ban-btn-outline:hover {
    border-color: var(--ban-accent);
    color: var(--ban-accent) !important;
}

/* 8. Responsive Infrastructure */
.container-fluid {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 1200px) {
    .container-fluid { padding: 0 40px; }
}

@media (max-width: 768px) {
    body { font-size: 14px; }
    .ban-glass-card { padding: 15px; border-radius: 18px; }
}

/* 9. Utility Classes */
.rounded-xl { border-radius: 20px !important; }
.shadow-neon { box-shadow: 0 0 20px var(--ban-accent-glow); }
.blur-bg { backdrop-filter: blur(10px); }

/* 10. WHMCS Specific Overrides (Clean-up) */
.alert {
    border-radius: 12px;
    border: none;
    font-weight: 600;
}

.alert-success { background: rgba(16, 185, 129, 0.1); color: #10b981; }
.alert-danger { background: rgba(239, 68, 68, 0.1); color: #ef4444; }

table.table {
    color: var(--ban-text);
    border-collapse: separate;
    border-spacing: 0 8px;
}

table.table thead th {
    border: none;
    color: var(--ban-text-muted);
    font-weight: 500;
    text-transform: uppercase;
    font-size: 12px;
}

table.table tbody tr {
    background: var(--ban-surface);
    transition: var(--ban-transition);
}

table.table tbody td {
    border: none;
    padding: 15px;
    vertical-align: middle;
}

table.table tbody tr td:first-child { border-radius: 0 12px 12px 0; }
table.table tbody tr td:last-child { border-radius: 12px 0 0 12px; }

table.table tbody tr:hover {
    transform: scale(1.01);
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}