/* ============================================
   SALAY Accounting - White Label Branding
   Supports per-client customization via CSS variables
   ============================================ */

/* Default SALAY Branding Colors */
/* :root {
    --brand-primary: #FF4433;
    --brand-secondary: #CC3322;
    --brand-text: #333333;
    --brand-background: #FFFFFF;
} */
:root {
    --brand-primary: #666666;
    --brand-secondary: #555555;
    --brand-text: #333333;
    --brand-background: #FFFFFF;
}

/* ============================================
   HIDE ALL ERPNEXT/FRAPPE BRANDING
   ============================================ */

/* Hide "Powered by Frappe" footer */
.login-footer,
.page-card-head .indicator,
.text-muted.text-center a[href*="frappe"],
.web-footer .footer-links a[href*="frappe"],
footer a[href*="frappe.io"],
footer a[href*="erpnext.com"] {
    display: none !important;
}

/* Hide Frappe/ERPNext logos and branding */
.navbar-brand img[alt*="Frappe"],
.navbar-brand img[alt*="ERPNext"],
img[src*="frappe-logo"],
img[src*="erpnext-logo"] {
    display: none !important;
}

/* Hide version info and attribution */
.version-info,
.powered-by-frappe,
[class*="frappe-brand"],
[class*="erpnext-brand"] {
    display: none !important;
}

/* ============================================
   CUSTOM BRANDING - LOGIN PAGE
   ============================================ */

/* Login page background */
.page-card-head {
    background-color: var(--brand-primary) !important;
    border: none !important;
}

.login-content {
    background: var(--brand-background);
}

/* Custom logo on login page */
/*.page-card-head .brand-logo,*/
.app-logo,
.img.app-logo {
    width: 200px !important;
    height: 80px !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    display: block !important;
}
/*.for-login .app-logo {
    background-image: url('/assets/salay_accounting/images/logo.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    width: 200px !important;
    height: 80px !important;
    margin: 0 auto !important;
    display: block !important;
}
*/
/* Hide the IMG tag inside app-logo */
/*.app-logo img,
.for-login .app-logo img,
img.app-logo {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}*/

/* Replace IMG with background on the IMG itself */
img.app-logo {
    /* content: url('/assets/salay_accounting/images/logo.png') !important; */
    width: 200px !important;
    height: 80px !important;
    object-fit: contain !important;
}

/* Login button styling with brand color */
.btn-primary,
.btn-login {
    background-color: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
}

.btn-primary:hover,
.btn-login:hover {
    background-color: var(--brand-secondary) !important;
    border-color: var(--brand-secondary) !important;
}

/* Links with brand color */
a {
    color: var(--brand-primary) !important;
}

a:hover {
    color: var(--brand-secondary) !important;
}

/* ============================================
   CUSTOM BRANDING - INSIDE APPLICATION
   ============================================ */

/* Navbar/Header branding */
.navbar {
    background-color: var(--brand-primary) !important;
}

/* Sidebar active items */
.desk-sidebar .selected,
.desk-sidebar .active {
    background-color: var(--brand-primary) !important;
}

/* Primary buttons throughout app */
.btn-primary:not(.btn-login) {
    background-color: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
}

/* ============================================
   SYSTEM NAME REPLACEMENT
   ============================================ */

/* Replace "ERPNext" text with custom name */
.navbar-brand-title::after {
    content: "SALAY Accounting" !important;
}

/* Hide original title */
.navbar-brand-title {
    font-size: 0 !important;
}

/* ============================================
   RESPONSIVE DESIGN
   ============================================ */

@media (max-width: 768px) {
    .app-logo,
    .for-login .app-logo {
        width: 150px !important;
        height: 60px !important;
    }
}