/* ============================================
   ZI-HOST WHMCS Custom Theme v1.0
   Modern, RTL, Professional
   ============================================ */

/* === VARIABLES === */
:root {
    --zi-primary: #8b5cf6;
    --zi-primary-dark: #7c3aed;
    --zi-primary-light: #a78bfa;
    --zi-primary-bg: rgba(139,92,246,0.08);
    --zi-secondary: #088F8F;
    --zi-success: #22c55e;
    --zi-danger: #ef4444;
    --zi-warning: #f59e0b;
    --zi-info: #3b82f6;
    --zi-dark: #1e293b;
    --zi-light: #f8fafc;
    --zi-gray: #64748b;
    --zi-gray-light: #f1f5f9;
    --zi-border: #e2e8f0;
    --zi-radius: 12px;
    --zi-radius-sm: 8px;
    --zi-shadow: 0 1px 3px rgba(0,0,0,0.06),0 1px 2px rgba(0,0,0,0.04);
    --zi-shadow-md: 0 4px 12px rgba(0,0,0,0.08);
    --zi-shadow-lg: 0 10px 25px rgba(0,0,0,0.1);
    --zi-transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
}

/* === GLOBAL === */
body, input, textarea, select, button { font-family:'Vazirmatn','Tahoma',sans-serif; }
body { background:var(--zi-gray-light)!important; color:var(--zi-dark); line-height:1.8; -webkit-font-smoothing:antialiased; }
a { color:var(--zi-primary); transition:var(--zi-transition); }
a:hover { color:var(--zi-primary-dark); text-decoration:none; }
::selection { background:var(--zi-primary); color:#fff; }
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 { font-weight:700; color:var(--zi-dark); }
#main-body { padding:1.5rem 0 3rem; }
#main-body>.container { max-width:1280px; }

/* === CARDS === */
.card {
    border:1px solid var(--zi-border)!important;
    border-radius:var(--zi-radius)!important;
    box-shadow:var(--zi-shadow)!important;
    overflow:hidden;
    transition:var(--zi-transition);
    background:#fff;
    margin-bottom:1.25rem!important;
}
.card:hover { box-shadow:var(--zi-shadow-md)!important; }
.card-header {
    background:linear-gradient(135deg,var(--zi-primary-bg),rgba(8,143,143,0.04))!important;
    border-bottom:1px solid var(--zi-border)!important;
    padding:1rem 1.25rem!important;
}
.card-header .card-title,.card-header h3 {
    font-size:1rem!important; font-weight:600!important; color:var(--zi-dark)!important; margin:0!important;
}
.card-body { padding:1.25rem!important; }
.card-footer {
    background:var(--zi-gray-light)!important;
    border-top:1px solid var(--zi-border)!important;
    padding:0.875rem 1.25rem!important;
}
.card-accent-blue { border-top:3px solid var(--zi-info)!important; }
.card-accent-green { border-top:3px solid var(--zi-success)!important; }
.card-accent-red { border-top:3px solid var(--zi-danger)!important; }
.card-accent-gold { border-top:3px solid var(--zi-warning)!important; }

/* === BUTTONS === */
.btn {
    border-radius:var(--zi-radius-sm)!important;
    font-weight:500!important;
    padding:0.5rem 1.25rem!important;
    transition:var(--zi-transition)!important;
    border:none!important;
    font-size:0.9rem!important;
    letter-spacing:0.01em;
}
.btn-primary {
    background:linear-gradient(135deg,var(--zi-primary),var(--zi-primary-dark))!important;
    color:#fff!important;
    box-shadow:0 2px 8px rgba(139,92,246,0.3)!important;
}
.btn-primary:hover,.btn-primary:focus {
    background:linear-gradient(135deg,var(--zi-primary-dark),#6d28d9)!important;
    transform:translateY(-1px);
    box-shadow:0 4px 14px rgba(139,92,246,0.4)!important;
}
.btn-success {
    background:linear-gradient(135deg,var(--zi-success),#16a34a)!important;
    color:#fff!important;
    box-shadow:0 2px 8px rgba(34,197,94,0.3)!important;
}
.btn-success:hover { transform:translateY(-1px); box-shadow:0 4px 14px rgba(34,197,94,0.4)!important; }
.btn-danger {
    background:linear-gradient(135deg,var(--zi-danger),#dc2626)!important;
    color:#fff!important;
}
.btn-info {
    background:linear-gradient(135deg,var(--zi-info),#2563eb)!important;
    color:#fff!important;
}
.btn-warning {
    background:linear-gradient(135deg,var(--zi-warning),#d97706)!important;
    color:#fff!important;
}
.btn-default,.btn-secondary {
    background:#fff!important;
    color:var(--zi-dark)!important;
    border:1px solid var(--zi-border)!important;
}
.btn-default:hover,.btn-secondary:hover {
    background:var(--zi-gray-light)!important;
    border-color:var(--zi-primary)!important;
    color:var(--zi-primary)!important;
}
.btn-link { color:var(--zi-primary)!important; text-decoration:none!important; }
.btn-link:hover { color:var(--zi-primary-dark)!important; }
.btn-lg { padding:0.75rem 1.75rem!important; font-size:1rem!important; border-radius:var(--zi-radius)!important; }
.btn-sm,.btn-xs { padding:0.3rem 0.75rem!important; font-size:0.8rem!important; }

/* === FORMS === */
.form-control,.field {
    border:1.5px solid var(--zi-border)!important;
    border-radius:var(--zi-radius-sm)!important;
    padding:0.6rem 1rem!important;
    font-size:0.9rem!important;
    transition:var(--zi-transition)!important;
    background:#fff!important;
    color:var(--zi-dark)!important;
}
.form-control:focus,.field:focus {
    border-color:var(--zi-primary)!important;
    box-shadow:0 0 0 3px rgba(139,92,246,0.12)!important;
    outline:none!important;
}
.form-control::placeholder { color:#94a3b8!important; }
label,.col-form-label,.form-control-label {
    font-weight:500!important;
    color:var(--zi-dark)!important;
    font-size:0.88rem!important;
    margin-bottom:0.4rem!important;
}
.form-group { margin-bottom:1.25rem!important; }
.custom-select {
    border:1.5px solid var(--zi-border)!important;
    border-radius:var(--zi-radius-sm)!important;
    padding:0.6rem 1rem!important;
}
.custom-select:focus {
    border-color:var(--zi-primary)!important;
    box-shadow:0 0 0 3px rgba(139,92,246,0.12)!important;
}
.input-group .input-group-text {
    background:var(--zi-gray-light)!important;
    border:1.5px solid var(--zi-border)!important;
    border-radius:var(--zi-radius-sm) 0 0 var(--zi-radius-sm)!important;
    color:var(--zi-primary)!important;
}
.input-group .form-control {
    border-radius:0 var(--zi-radius-sm) var(--zi-radius-sm) 0!important;
}
.input-group-merge .input-group-prepend .input-group-text {
    border-left:0!important;
    border-radius:0 var(--zi-radius-sm) var(--zi-radius-sm) 0!important;
}
.input-group-merge .form-control {
    border-radius:var(--zi-radius-sm) 0 0 var(--zi-radius-sm)!important;
    border-right:0!important;
}

/* === TABLES === */
.table { border-collapse:separate; border-spacing:0; }
.table thead th {
    background:linear-gradient(135deg,var(--zi-primary-bg),rgba(8,143,143,0.04))!important;
    color:var(--zi-dark)!important;
    font-weight:600!important;
    font-size:0.85rem!important;
    padding:0.875rem 1rem!important;
    border-bottom:2px solid var(--zi-border)!important;
    border-top:none!important;
    white-space:nowrap;
}
.table td {
    padding:0.875rem 1rem!important;
    vertical-align:middle!important;
    border-top:1px solid var(--zi-border)!important;
    font-size:0.9rem!important;
}
.table-striped tbody tr:nth-of-type(odd) { background:rgba(248,250,252,0.5)!important; }
.table-striped tbody tr:hover,.table tbody tr:hover { background:var(--zi-primary-bg)!important; }
.table-responsive {
    border-radius:var(--zi-radius)!important;
    border:1px solid var(--zi-border);
}

/* === SIDEBAR === */
.sidebar .card { border-radius:var(--zi-radius)!important; overflow:hidden; }
.sidebar .card-header {
    background:linear-gradient(135deg,var(--zi-primary),var(--zi-primary-dark))!important;
    padding:0.875rem 1.25rem!important;
}
.sidebar .card-header .card-title,.sidebar .card-header h3 {
    color:#fff!important; font-size:0.95rem!important;
}
.sidebar .card-header .card-minimise { color:rgba(255,255,255,0.8)!important; }
.sidebar .list-group-item {
    border:none!important;
    padding:0.7rem 1.25rem!important;
    color:var(--zi-dark)!important;
    font-size:0.88rem!important;
    transition:var(--zi-transition);
    border-bottom:1px solid rgba(226,232,240,0.5)!important;
}
.sidebar .list-group-item:hover {
    background:var(--zi-primary-bg)!important;
    color:var(--zi-primary)!important;
    padding-right:1.5rem!important;
}
.sidebar .list-group-item.active {
    background:linear-gradient(135deg,var(--zi-primary-bg),rgba(139,92,246,0.12))!important;
    color:var(--zi-primary)!important;
    font-weight:600!important;
    border-right:3px solid var(--zi-primary)!important;
}
.sidebar .list-group-item .sidebar-menu-item-icon {
    color:var(--zi-primary)!important;
    width:20px;
    text-align:center;
}
.sidebar .list-group-item.active .sidebar-menu-item-icon { color:var(--zi-primary-dark)!important; }

/* === DASHBOARD TILES === */
.tiles .tile {
    display:flex!important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:1.5rem 1rem!important;
    text-decoration:none!important;
    transition:var(--zi-transition);
    position:relative;
    overflow:hidden;
    background:#fff;
    border:1px solid var(--zi-border);
    min-height:140px;
}
.tiles .tile:hover {
    transform:translateY(-3px);
    box-shadow:var(--zi-shadow-md);
    z-index:1;
}
.tiles .tile i {
    font-size:2rem!important;
    margin-bottom:0.5rem;
    opacity:0.9;
}
.tiles .tile .stat {
    font-size:2rem!important;
    font-weight:700!important;
    color:var(--zi-dark)!important;
    line-height:1.2;
}
.tiles .tile .title {
    font-size:0.85rem!important;
    color:var(--zi-gray)!important;
    font-weight:500;
    margin-top:0.25rem;
}
.tiles .tile .highlight {
    height:4px!important;
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    border-radius:4px 4px 0 0;
    transition:var(--zi-transition);
}
.tiles .tile:hover .highlight { height:5px!important; }
.tiles .row { border-radius:var(--zi-radius); overflow:hidden; box-shadow:var(--zi-shadow); }
.bg-color-blue { background:var(--zi-info)!important; }
.bg-color-green { background:var(--zi-success)!important; }
.bg-color-red { background:var(--zi-danger)!important; }
.bg-color-gold { background:var(--zi-warning)!important; }

/* === LOGIN PAGE === */
.login-form .card {
    border:none!important;
    box-shadow:var(--zi-shadow-lg)!important;
    border-radius:var(--zi-radius-sm)!important;
    max-width:480px;
    margin:2rem auto!important;
}
.login-form .card-body {
    padding:2.5rem!important;
}
.login-form .card-body .h3,
.login-form .card-body h6.h3 {
    font-size:1.5rem!important;
    font-weight:700!important;
    color:var(--zi-dark)!important;
    text-align:center;
}
.login-form .card-body .text-muted {
    text-align:center!important;
    display:block;
}
.login-form .card-footer {
    text-align:center!important;
    padding:1.25rem!important;
    background:var(--zi-gray-light)!important;
}
.login-form .btn-primary {
    width:100%;
    padding:0.75rem!important;
    font-size:1rem!important;
}
.login-form .form-check-input { margin-left:0.5rem; }

/* === REGISTER PAGE === */
.card .card-title {
    font-size:1.1rem!important;
    font-weight:600!important;
    color:var(--zi-dark)!important;
    margin-bottom:1rem!important;
}
.password-strength-meter .progress {
    height:6px!important;
    border-radius:3px!important;
    background:var(--zi-border)!important;
}
.progress-bar { border-radius:3px!important; }

/* === ALERTS === */
.alert {
    border-radius:var(--zi-radius-sm)!important;
    border:none!important;
    padding:1rem 1.25rem!important;
    font-size:0.9rem!important;
}
.alert-success {
    background:rgba(34,197,94,0.1)!important;
    color:#15803d!important;
    border-right:4px solid var(--zi-success)!important;
}
.alert-danger,.alert-error {
    background:rgba(239,68,68,0.1)!important;
    color:#b91c1c!important;
    border-right:4px solid var(--zi-danger)!important;
}
.alert-warning {
    background:rgba(245,158,11,0.1)!important;
    color:#92400e!important;
    border-right:4px solid var(--zi-warning)!important;
}
.alert-info {
    background:rgba(59,130,246,0.1)!important;
    color:#1d4ed8!important;
    border-right:4px solid var(--zi-info)!important;
}

/* === BADGES === */
.badge {
    font-weight:500!important;
    padding:0.35rem 0.75rem!important;
    border-radius:50px!important;
    font-size:0.75rem!important;
    letter-spacing:0.02em;
}
.badge-success,.badge-active { background:var(--zi-success)!important; color:#fff!important; }
.badge-danger,.badge-overdue { background:var(--zi-danger)!important; color:#fff!important; }
.badge-warning,.badge-pending { background:var(--zi-warning)!important; color:#fff!important; }
.badge-info { background:var(--zi-info)!important; color:#fff!important; }
.badge-secondary { background:var(--zi-gray)!important; color:#fff!important; }

/* === PAGINATION === */
.pagination { gap:0.25rem; }
.page-item .page-link {
    border:1px solid var(--zi-border)!important;
    border-radius:var(--zi-radius-sm)!important;
    color:var(--zi-dark)!important;
    padding:0.5rem 0.85rem!important;
    font-size:0.88rem!important;
    transition:var(--zi-transition);
}
.page-item .page-link:hover {
    background:var(--zi-primary-bg)!important;
    border-color:var(--zi-primary)!important;
    color:var(--zi-primary)!important;
}
.page-item.active .page-link {
    background:var(--zi-primary)!important;
    border-color:var(--zi-primary)!important;
    color:#fff!important;
    box-shadow:0 2px 6px rgba(139,92,246,0.3);
}

/* === MODALS === */
.modal-content {
    border:none!important;
    border-radius:var(--zi-radius)!important;
    box-shadow:var(--zi-shadow-lg)!important;
    overflow:hidden;
}
.modal-header {
    background:linear-gradient(135deg,var(--zi-primary-bg),rgba(8,143,143,0.04))!important;
    border-bottom:1px solid var(--zi-border)!important;
    padding:1.25rem 1.5rem!important;
}
.modal-header .modal-title { font-weight:600!important; color:var(--zi-dark)!important; }
.modal-body { padding:1.5rem!important; }
.modal-footer {
    border-top:1px solid var(--zi-border)!important;
    padding:1rem 1.5rem!important;
    background:var(--zi-gray-light)!important;
}
.modal-backdrop.show { opacity:0.4!important; backdrop-filter:blur(4px); }

/* === SHOPPING CART === */
.order-summary {
    background:#fff!important;
    border-radius:var(--zi-radius)!important;
    box-shadow:var(--zi-shadow-md)!important;
    border:1px solid var(--zi-border);
}
.total-due-today {
    background:linear-gradient(135deg,var(--zi-primary-bg),rgba(8,143,143,0.06))!important;
    border-radius:var(--zi-radius-sm)!important;
    padding:1.25rem!important;
    text-align:center;
}
.total-due-today .amt {
    font-size:1.75rem!important;
    font-weight:700!important;
    color:var(--zi-primary)!important;
    display:block;
}
.btn-checkout {
    background:linear-gradient(135deg,var(--zi-success),#16a34a)!important;
    border-radius:var(--zi-radius)!important;
    padding:0.875rem 2rem!important;
    font-size:1.05rem!important;
    box-shadow:0 4px 14px rgba(34,197,94,0.35)!important;
}
.btn-checkout:hover {
    transform:translateY(-2px)!important;
    box-shadow:0 6px 20px rgba(34,197,94,0.45)!important;
}
.view-cart-items-header {
    background:linear-gradient(135deg,var(--zi-primary-bg),rgba(8,143,143,0.04))!important;
    border-radius:var(--zi-radius) var(--zi-radius) 0 0!important;
    padding:1rem 1.25rem!important;
    font-weight:600!important;
}
.item-domain,.item-product,.item-addon,.item-renewal {
    border-bottom:1px solid var(--zi-border)!important;
    padding:1rem 1.25rem!important;
    transition:var(--zi-transition);
}
.item-domain:hover,.item-product:hover { background:rgba(248,250,252,0.8)!important; }
.empty-cart { text-align:center; padding:3rem 1rem!important; }
.empty-cart i { font-size:3rem; color:var(--zi-gray); margin-bottom:1rem; }

/* Cart steps */
.order-form-steps {
    display:flex;
    justify-content:center;
    gap:0.5rem;
    margin-bottom:2rem;
}
.order-form-steps .step {
    padding:0.5rem 1.5rem;
    border-radius:50px;
    font-size:0.85rem;
    font-weight:500;
    background:var(--zi-gray-light);
    color:var(--zi-gray);
    border:1px solid var(--zi-border);
}
.order-form-steps .step.active {
    background:var(--zi-primary)!important;
    color:#fff!important;
    border-color:var(--zi-primary)!important;
}

/* Checkout */
.sub-heading { font-size:1.1rem!important; font-weight:600!important; color:var(--zi-dark)!important; margin-bottom:1rem!important; }
.order-summary .promo-code { padding:1rem!important; }
.order-summary .promo-code .form-control { border-radius:var(--zi-radius-sm) 0 0 var(--zi-radius-sm)!important; }

/* === DOMAIN SEARCH === */
.domain-checker-container { margin-bottom:2rem; }
.domain-checker-result-item {
    border:1px solid var(--zi-border)!important;
    border-radius:var(--zi-radius)!important;
    padding:1rem 1.25rem!important;
    margin-bottom:0.75rem!important;
    display:flex;
    align-items:center;
    justify-content:space-between;
    transition:var(--zi-transition);
    background:#fff;
}
.domain-checker-result-item:hover { box-shadow:var(--zi-shadow-md); }
.domain-checker-available {
    border-right:4px solid var(--zi-success)!important;
}
.domain-checker-unavailable {
    border-right:4px solid var(--zi-danger)!important;
    opacity:0.7;
}
.domain-pricing .table { border-radius:var(--zi-radius)!important; overflow:hidden; }

/* === INVOICES === */
.invoice-list .card { border-radius:var(--zi-radius)!important; }
#paymentGatewaysContainer .payment-btn-container .btn {
    border-radius:var(--zi-radius-sm)!important;
    padding:0.75rem 1.5rem!important;
}
.status-unpaid { color:var(--zi-danger)!important; font-weight:600; }
.status-paid { color:var(--zi-success)!important; font-weight:600; }

/* === TICKETS === */
.ticket-reply {
    border:1px solid var(--zi-border)!important;
    border-radius:var(--zi-radius)!important;
    margin-bottom:1rem!important;
    overflow:hidden;
}
.ticket-reply-header {
    background:var(--zi-gray-light)!important;
    padding:0.875rem 1.25rem!important;
    border-bottom:1px solid var(--zi-border)!important;
}
.ticket-reply.staff .ticket-reply-header {
    background:linear-gradient(135deg,var(--zi-primary-bg),rgba(8,143,143,0.04))!important;
    border-right:3px solid var(--zi-primary);
}
.ticket-reply-body { padding:1.25rem!important; }

/* === CLIENT HOME PANELS === */
.client-home-cards .card { transition:var(--zi-transition); }
.client-home-cards .card:hover { transform:translateY(-2px); box-shadow:var(--zi-shadow-md)!important; }
.client-home-cards .list-group-item {
    border:none!important;
    border-bottom:1px solid var(--zi-border)!important;
    padding:0.75rem 1.25rem!important;
    transition:var(--zi-transition);
}
.client-home-cards .list-group-item:hover {
    background:var(--zi-primary-bg)!important;
    color:var(--zi-primary)!important;
}
.client-home-cards .list-group-item:last-child { border-bottom:none!important; }

/* Active products */
.active-products-services-item .service-title { font-weight:600; color:var(--zi-dark); }
.active-products-services-item .service-status .badge { font-size:0.75rem!important; }

/* === DOMAIN DETAILS === */
.domain-details .card { border-radius:var(--zi-radius)!important; }
.domain-details .nav-tabs {
    border-bottom:2px solid var(--zi-border)!important;
    gap:0.25rem;
}
.domain-details .nav-tabs .nav-link {
    border:none!important;
    color:var(--zi-gray)!important;
    font-weight:500!important;
    padding:0.75rem 1.25rem!important;
    border-radius:var(--zi-radius-sm) var(--zi-radius-sm) 0 0!important;
    transition:var(--zi-transition);
}
.domain-details .nav-tabs .nav-link:hover { color:var(--zi-primary)!important; background:var(--zi-primary-bg)!important; }
.domain-details .nav-tabs .nav-link.active {
    color:var(--zi-primary)!important;
    border-bottom:3px solid var(--zi-primary)!important;
    font-weight:600!important;
}

/* Nav tabs general */
.nav-tabs { border-bottom:2px solid var(--zi-border)!important; }
.nav-tabs .nav-link {
    border:none!important;
    color:var(--zi-gray)!important;
    font-weight:500!important;
    padding:0.75rem 1.25rem!important;
    transition:var(--zi-transition);
    border-radius:var(--zi-radius-sm) var(--zi-radius-sm) 0 0!important;
}
.nav-tabs .nav-link:hover { color:var(--zi-primary)!important; background:var(--zi-primary-bg)!important; }
.nav-tabs .nav-link.active {
    color:var(--zi-primary)!important;
    border-bottom:3px solid var(--zi-primary)!important;
    font-weight:600!important;
    background:transparent!important;
}

/* === BREADCRUMB === */
.breadcrumb {
    background:transparent!important;
    padding:0.5rem 0!important;
    font-size:0.85rem!important;
}
.breadcrumb-item a { color:var(--zi-primary)!important; }
.breadcrumb-item.active { color:var(--zi-gray)!important; }
.breadcrumb-item+.breadcrumb-item::before { color:var(--zi-gray)!important; }

/* === KNOWLEDGEBASE === */
.kb-article-list .card { transition:var(--zi-transition); }
.kb-article-list .card:hover { transform:translateY(-2px); }
.article-title { font-weight:600!important; color:var(--zi-dark)!important; }
.article-title:hover { color:var(--zi-primary)!important; }

/* === ANNOUNCEMENTS === */
.announcement-single .card { border-radius:var(--zi-radius)!important; }
.announcement-single .card-body { font-size:0.95rem!important; line-height:1.9; }
.announcement-date { color:var(--zi-gray)!important; font-size:0.85rem!important; }

/* === EMPTY STATES === */
.text-center.py-5,.no-results { text-align:center; }

/* === DROPDOWN === */
.dropdown-menu {
    border:1px solid var(--zi-border)!important;
    border-radius:var(--zi-radius-sm)!important;
    box-shadow:var(--zi-shadow-md)!important;
    padding:0.5rem!important;
}
.dropdown-item {
    border-radius:6px!important;
    padding:0.5rem 1rem!important;
    font-size:0.88rem!important;
    transition:var(--zi-transition);
}
.dropdown-item:hover {
    background:var(--zi-primary-bg)!important;
    color:var(--zi-primary)!important;
}

/* === SCROLLBAR === */
::-webkit-scrollbar { width:8px; height:8px; }
::-webkit-scrollbar-track { background:var(--zi-gray-light); }
::-webkit-scrollbar-thumb { background:var(--zi-border); border-radius:4px; }
::-webkit-scrollbar-thumb:hover { background:var(--zi-gray); }

/* === LIST GROUP GENERAL === */
.list-group-item {
    border-color:var(--zi-border)!important;
    transition:var(--zi-transition);
}
.list-group-item.active {
    background:var(--zi-primary)!important;
    border-color:var(--zi-primary)!important;
}
.list-group-item-action:hover {
    background:var(--zi-primary-bg)!important;
    color:var(--zi-primary)!important;
}

/* === TOOLTIPS === */
.tooltip-inner {
    background:var(--zi-dark)!important;
    border-radius:6px!important;
    padding:0.4rem 0.75rem!important;
    font-size:0.8rem!important;
}

/* === MISC OVERRIDES === */
.mw-540 { max-width:500px; margin:0 auto; }
.text-primary { color:var(--zi-primary)!important; }
.bg-primary { background:var(--zi-primary)!important; }
.border-primary { border-color:var(--zi-primary)!important; }
.text-success { color:var(--zi-success)!important; }
.text-danger { color:var(--zi-danger)!important; }
.text-warning { color:var(--zi-warning)!important; }
.text-info { color:var(--zi-info)!important; }
.text-muted { color:var(--zi-gray)!important; }
hr { border-color:var(--zi-border)!important; }

/* Loading spinner */
.fa-spinner,.fa-circle-notch { color:var(--zi-primary)!important; }

/* Fix RTL input group */
.input-group>.form-control:not(:last-child) { border-radius:0 var(--zi-radius-sm) var(--zi-radius-sm) 0!important; }
.input-group>.form-control:not(:first-child) { border-radius:var(--zi-radius-sm) 0 0 var(--zi-radius-sm)!important; }
.input-group>.input-group-prepend>.input-group-text { border-radius:0 var(--zi-radius-sm) var(--zi-radius-sm) 0!important; }
.input-group>.input-group-append>.input-group-text { border-radius:var(--zi-radius-sm) 0 0 var(--zi-radius-sm)!important; }
.input-group>.input-group-append>.btn { border-radius:var(--zi-radius-sm) 0 0 var(--zi-radius-sm)!important; }

/* Panel header links */
.card-header .btn-xs,.card-header .btn-sm {
    border-radius:50px!important;
    font-size:0.75rem!important;
    padding:0.25rem 0.75rem!important;
}

/* Add Funds */
.add-funds-amount { font-size:1.5rem!important; font-weight:700!important; color:var(--zi-primary)!important; }

/* Service detail buttons */
.product-details-tab-actions .btn { margin-bottom:0.5rem; border-radius:var(--zi-radius-sm)!important; }

/* === RESPONSIVE === */
@media (max-width:992px) {
    .sidebar { margin-bottom:1.5rem; }
    .tiles .tile { min-height:120px; padding:1rem!important; }
    .tiles .tile .stat { font-size:1.5rem!important; }
    .login-form .card-body { padding:1.5rem!important; }
}
@media (max-width:768px) {
    #main-body { padding:1rem 0 2rem; }
    .card-body { padding:1rem!important; }
    .card-header { padding:0.875rem 1rem!important; }
    .btn-lg { padding:0.6rem 1.25rem!important; font-size:0.9rem!important; }
    .modal-body { padding:1rem!important; }
    .total-due-today .amt { font-size:1.4rem!important; }
    .tiles .tile i { font-size:1.5rem!important; }
}

/* === ANIMATION === */
@keyframes fadeIn {
    from { opacity:0; transform:translateY(8px); }
    to { opacity:1; transform:translateY(0); }
}
.card,.tile,.alert { animation:fadeIn 0.4s ease-out; }
.modal.show .modal-dialog { animation:fadeIn 0.3s ease-out; }