/* ============================================
   PencilCut Business Suite — Red & White Theme
   ============================================ */
:root {
  --pc-primary: #E63946;
  --pc-primary-dark: #B81E2A;
  --pc-accent: #F4801E;
  --pc-bg: #ffffff;
  --pc-surface: #fafafa;
  --pc-surface-2: #f4f4f4;
  --pc-border: #e8e8e8;
  --pc-text: #1a1a1a;
  --pc-text-muted: #6b7280;

  --primary: #E63946;
  --primary-color: #E63946;
  --bg-color: #ffffff;
  --bg-surface: #ffffff;
  --control-bg: #fafafa;
  --control-bg-on-gray: #fafafa;
  --disabled-control-bg: #f0f0f0;
  --border-color: #e8e8e8;
  --card-bg: #ffffff;
}

/* ============================================
   Navbar — dark with red underline + white logo pill
   ============================================ */
.navbar {
  background-color: #1a1a1a !important;
  border-bottom: 2px solid var(--pc-primary) !important;
}
.navbar .navbar-brand {
  background-color: #ffffff !important;
  border-radius: 6px !important;
  padding: 3px 10px !important;
}
.navbar .nav-link,
.navbar .navbar-nav .nav-link,
.navbar .icon-btn {
  color: #d1d5db !important;
}
.navbar .nav-link:hover,
.navbar .icon-btn:hover {
  color: var(--pc-primary) !important;
}

/* Breadcrumbs — plain <a> inside #navbar-breadcrumbs li, no class */
#navbar-breadcrumbs li a,
#navbar-breadcrumbs li.disabled a {
  color: #ffffff !important;
  opacity: 1 !important;
  text-decoration: none !important;
}
#navbar-breadcrumbs li a:hover {
  color: var(--pc-primary) !important;
}

/* Notification bell — has .text-muted which must be overridden */
.navbar .notifications-icon,
.navbar .notifications-icon.text-muted,
.navbar .notifications-icon svg,
.navbar .notifications-icon use {
  color: #ffffff !important;
  stroke: #ffffff !important;
}

/* ============================================
   Splash / Loading — img + ring both fixed-centered on the viewport
   ============================================ */
.centered.splash,
.splash {
  background: #ffffff !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  -webkit-transform: none !important;
  transform: none !important;
  z-index: 9990 !important;
}
.centered.splash img,
.splash img {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  -webkit-transform: translate(-50%, -50%) !important;
  transform: translate(-50%, -50%) !important;
  width: 140px !important;
  height: auto !important;
  max-width: 140px !important;
  max-height: 140px !important;
  object-fit: contain !important;
  z-index: 9992 !important;
}
.centered.splash::after,
.splash::after {
  content: '' !important;
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  width: 220px !important;
  height: 220px !important;
  margin: -110px 0 0 -110px !important;
  border-radius: 50% !important;
  border: 4px solid #f0f0f0 !important;
  border-top-color: #E63946 !important;
  box-sizing: border-box !important;
  animation: pc-spin 1.2s linear infinite !important;
  z-index: 9991 !important;
}
@keyframes pc-spin {
  to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

/* ============================================
   Sidebar
   ============================================ */
.list-sidebar.overlay-sidebar,
.desk-sidebar {
  background-color: #ffffff !important;
  border-right: 1px solid var(--pc-border) !important;
}
.btn-reset.standard-sidebar-label {
  color: var(--pc-primary-dark) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
}
.desk-sidebar-item.standard-sidebar-item {
  border-radius: 4px !important;
  margin: 1px 6px !important;
}
.desk-sidebar-item .sidebar-item-label {
  color: var(--pc-text) !important;
  font-weight: 400 !important;
  font-size: 13px !important;
}
.desk-sidebar-item .sidebar-item-icon use,
.desk-sidebar-item .sidebar-item-icon svg {
  color: var(--pc-text-muted) !important;
  stroke: var(--pc-text-muted) !important;
}
.desk-sidebar-item.standard-sidebar-item:hover {
  background-color: rgba(230,57,70,0.08) !important;
}
.desk-sidebar-item.standard-sidebar-item:hover .sidebar-item-label,
.desk-sidebar-item.standard-sidebar-item:hover .sidebar-item-icon use,
.desk-sidebar-item.standard-sidebar-item:hover .sidebar-item-icon svg {
  color: var(--pc-primary) !important;
  stroke: var(--pc-primary) !important;
}
.desk-sidebar-item.standard-sidebar-item.selected {
  background-color: rgba(230,57,70,0.12) !important;
  border-left: 3px solid var(--pc-primary) !important;
}
.desk-sidebar-item.standard-sidebar-item.selected .sidebar-item-label,
.desk-sidebar-item.standard-sidebar-item.selected .sidebar-item-icon use,
.desk-sidebar-item.standard-sidebar-item.selected .sidebar-item-icon svg {
  color: var(--pc-primary) !important;
  stroke: var(--pc-primary) !important;
  font-weight: 600 !important;
}
.sidebar-child-item .desk-sidebar-item .sidebar-item-label {
  color: var(--pc-text-muted) !important;
  font-size: 12px !important;
}

/* ============================================
   Buttons
   ============================================ */
.btn-primary {
  background-color: var(--pc-primary) !important;
  border-color: var(--pc-primary) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--pc-primary-dark) !important;
  border-color: var(--pc-primary-dark) !important;
  color: #ffffff !important;
}

/* ============================================
   Page chrome
   ============================================ */
html, body {
  background-color: var(--pc-bg) !important;
}
.page-head,
.page-head-content,
.page-container,
.page-wrapper,
.layout-main,
.layout-main-section,
.layout-main-section-wrapper,
.layout-side-section,
.desk-page,
.page-content,
.main-section,
.workspace-container,
.workspace-skeleton,
.widget-group,
.onboarding-widget-box,
.onboarding-step,
.shortcut-widget-box,
.links-widget-box,
.chart-widget-box,
.number-widget-box,
.frappe-card,
.form-section .section-body,
.form-tabs-list,
.tab-content,
.form-page,
.list-row,
.dt-row,
.result {
  background-color: var(--pc-bg) !important;
}
.page-head {
  border-bottom: 1px solid var(--pc-border) !important;
}

/* Widget cards — clean white with subtle border */
.widget.shortcut-widget-box,
.widget.links-widget-box,
.widget.onboarding-widget-box {
  background-color: #ffffff !important;
  border: 1px solid var(--pc-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
}

/* List hover */
.list-row:hover,
.dt-row:hover {
  background-color: var(--pc-surface) !important;
}

/* Input fields */
.form-control,
input.form-control,
textarea.form-control,
select.form-control {
  background-color: var(--pc-surface) !important;
  border-color: var(--pc-border) !important;
}
.form-control:focus {
  border-color: var(--pc-primary) !important;
  box-shadow: 0 0 0 2px rgba(230,57,70,0.15) !important;
}

.title-text { color: var(--pc-text) !important; }

/* nprogress loading bar */
#nprogress .bar { background: var(--pc-primary) !important; }
#nprogress .peg { box-shadow: 0 0 10px var(--pc-primary), 0 0 5px var(--pc-primary) !important; }

/* Hide "powered by" */
.powered-by, footer .powered-by, [class*=powered] { display: none !important; }

/* ============================================
   Login Page
   ============================================ */
/* Hide original in-card logo */
.page-card-head img.app-logo { display: none !important; }

/* Hero logo (injected above the card via pencilcut_login.js) */
.pencilcut-logo-above {
  text-align: center;
  padding: 8px 20px 4px;
}
.pencilcut-logo-above img {
  max-width: 60vw;
  width: 140px;
  height: auto;
}

/* Tighten the login layout so everything fits one viewport */
.login-content.page-card {
  margin-top: 10px !important;
}
.page-card-head { padding-top: 14px !important; padding-bottom: 8px !important; }
body.with-login-section .for-login,
body.with-login-section .page-card-body { padding-top: 8px !important; }
.for-login .page-card,
.for-email-login .page-card,
.for-forgot .page-card { box-shadow: 0 4px 16px rgba(0,0,0,0.06) !important; }

/* Login title — swap text via ::after */
.page-card-head h4 {
  font-size: 0 !important;
  color: transparent !important;
}
.page-card-head h4::after {
  content: 'Login to PencilCut Business Suite';
  font-size: 1.1rem !important;
  color: var(--pc-text) !important;
  font-weight: 600 !important;
}

/* Card itself — red accent top border */
.page-card { border-top: 3px solid var(--pc-primary) !important; }

/* Hide footer "powered by" / "language" */
.login-footer, .login-content .text-muted small { display: none !important; }