/* ========================================
   FASTAP dashboards: refinements
   Loaded last on every dashboard (owner, admin, franchise, company).
   Calm, solid surfaces: no lifting cards, no glow, no scroll-in effects,
   ink buttons, sentence-case labels.
   ======================================== */

body {
  background: var(--bg-secondary);
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 { letter-spacing: -0.01em; }

/* ---------- Content always visible (no scroll-in animation) ---------- */
.fade-up, .fade-in, .fade-down, .fade-left, .fade-right, .scale-in, .slide-up,
.stagger-animation > *, [class*="stagger-"] {
  opacity: 1 !important;
  transform: none !important;
  transition-delay: 0s !important;
}
.float, .animate-float, .pulse, .animate-pulse, .bounce, .animate-bounce { animation: none !important; }

/* ---------- Nothing jumps on hover ---------- */
.card:hover, [class*="-card"]:hover, [class*="card-"]:hover, .btn:hover, .btn:active,
[class*="stat"]:hover, .theme-card:hover, .action-card:hover, .quick-action:hover,
.product-card:hover .product-image img {
  transform: none !important;
}
[class*="-card"]:hover, .card:hover { box-shadow: var(--shadow-sm) !important; }

/* ---------- Buttons ---------- */
.btn { border-radius: var(--radius-md) !important; box-shadow: none !important; font-weight: 600; letter-spacing: 0; }
.btn-primary, .btn-blue, .btn-gradient, .btn-purple {
  background: var(--btn-primary-bg) !important;
  color: var(--btn-primary-color) !important;
  border: 1px solid var(--btn-primary-bg) !important;
}
.btn-primary:hover, .btn-blue:hover, .btn-gradient:hover, .btn-purple:hover {
  background: var(--ink-hover) !important;
  border-color: var(--ink-hover) !important;
  color: var(--btn-primary-color) !important;
}
[data-theme="dark"] .btn-primary:hover { color: #161513 !important; }
.btn-secondary, .btn-outline, .btn-outline-primary, .btn-light {
  background: var(--card-bg) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-medium) !important;
}
.btn-secondary:hover, .btn-outline:hover, .btn-outline-primary:hover, .btn-light:hover {
  background: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-dark) !important;
}
.btn-danger { background: var(--red-500) !important; border-color: var(--red-500) !important; color: #fff !important; }
.btn-pink, .btn-orange { background: var(--card-bg) !important; color: var(--text-primary) !important; border: 1px solid var(--border-medium) !important; }

/* ---------- Cards and surfaces ---------- */
.card, .stat-card, .stat-card-dashboard, .form-card, .table-container, .c360-card, .fx-card,
.stat-mini-card, .content-card, .dashboard-card, .chart-card {
  box-shadow: none !important;
  border: 1px solid var(--card-border) !important;
  border-radius: var(--radius-lg) !important;
}

/* Coloured icon bubbles: quiet tint, coloured glyph */
.stat-icon, .stat-card-icon, .stat-mini-icon, .card-icon, .action-icon, .feature-icon {
  background: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  box-shadow: none !important;
}
.stat-icon i, .stat-card-icon i, .stat-mini-icon i, .card-icon i, .action-icon i { color: inherit !important; }

/* ---------- Sidebar ---------- */
.sidebar { box-shadow: none !important; border-right: 1px solid var(--border-light) !important; background: var(--bg-primary) !important; }
.nav-section-title {
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  color: var(--text-muted) !important;
}
.nav-item { border-radius: var(--radius-md) !important; color: var(--text-secondary) !important; }
.nav-item:hover { background: var(--bg-tertiary) !important; color: var(--text-primary) !important; }
.nav-item.active {
  background: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  font-weight: 600;
  box-shadow: none !important;
}
.nav-item.active::before { display: none !important; }
.nav-item.active i, .nav-item.active svg { color: var(--text-primary) !important; }
.sidebar-logo-text { background: none !important; -webkit-text-fill-color: currentColor !important; color: var(--text-primary) !important; letter-spacing: .04em; }

/* ---------- Header ---------- */
.dashboard-header, .admin-header, .top-header { box-shadow: none !important; border-bottom: 1px solid var(--border-light) !important; background: var(--header-bg) !important; backdrop-filter: none !important; }

/* ---------- "New" marker: quiet text, not a pill ---------- */
.new-badge {
  background: none !important;
  color: var(--accent) !important;
  border: 0 !important;
  padding: 0 !important;
  margin-left: 6px !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: none !important;
  vertical-align: middle;
}

/* ---------- Owner dashboard welcome block: plain card, wraps properly ---------- */
.welcome-banner {
  background: var(--card-bg) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--card-border);
  border-radius: var(--radius-lg) !important;
  padding: var(--space-md) var(--space-lg) !important;
  flex-wrap: wrap;
  gap: var(--space-sm);
}
.welcome-banner::before, .welcome-banner::after { display: none !important; }
.welcome-content { flex: 1 1 320px !important; }
.welcome-content h1, .welcome-content p { color: var(--text-primary) !important; }
.welcome-content p { color: var(--text-secondary) !important; opacity: 1 !important; }

/* Text that used to be filled with a gradient */
[class*="gradient-text"], .text-gradient, .gradient-heading { background: none !important; -webkit-text-fill-color: currentColor !important; color: var(--text-primary) !important; }

/* ---------- Tables and badges ---------- */
.data-table th { text-transform: none !important; letter-spacing: 0 !important; font-weight: 600; color: var(--text-secondary); }
.status-badge, .badge { border-radius: var(--radius-sm) !important; font-weight: 600; letter-spacing: 0 !important; text-transform: none !important; }

/* ---------- Forms ---------- */
.form-control:focus, input:focus, select:focus, textarea:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px var(--accent-soft) !important;
  outline: none;
}

/* ---------- Alerts: flat ---------- */
.alert { box-shadow: none !important; border-radius: var(--radius-md) !important; }

/* ---------- Owner dashboard details ---------- */
.welcome-actions { display: flex; gap: 8px; }
.welcome-actions .btn-white { background: var(--btn-primary-bg) !important; color: var(--btn-primary-color) !important; border: 1px solid var(--btn-primary-bg) !important; }
.welcome-actions .btn-outline-white { background: var(--card-bg) !important; color: var(--text-primary) !important; border: 1px solid var(--border-medium) !important; }
.stat-card-trend.is-zero { display: none !important; }
.whats-new-owner { background: var(--card-bg) !important; }
.quick-action-item { background: var(--bg-secondary) !important; color: var(--text-primary) !important; border: 1px solid var(--border-light); box-shadow: none !important; }
.quick-action-item:hover { background: var(--bg-tertiary) !important; }
.quick-action-item span, .quick-action-item .quick-action-label { color: var(--text-primary) !important; }
.quick-action-icon { background: var(--card-bg) !important; color: var(--text-secondary) !important; border: 1px solid var(--border-light); box-shadow: none !important; }
.quick-action-icon i { color: inherit !important; }
.profile-preview-initials { background: var(--ink) !important; }

/* ---------- Admin dashboard period switch ---------- */
.dash-periods a { border-radius: var(--radius-md) !important; }
.dash-periods a.active { background: var(--ink) !important; border-color: var(--ink) !important; color: var(--btn-primary-color) !important; }
.kpi-icon { background: var(--bg-tertiary) !important; color: var(--text-secondary) !important; }

/* ---------- Franchise / company welcome blocks: plain cards ---------- */
.welcome-card, .company-welcome, .dashboard-welcome, .hero-card {
  background: var(--card-bg) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--card-border) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: none !important;
}
.welcome-card::before, .welcome-card::after, .company-welcome::before, .company-welcome::after,
.dashboard-welcome::before, .dashboard-welcome::after, .hero-card::before, .hero-card::after { display: none !important; }
.welcome-card h1, .welcome-card h2, .welcome-card h3, .company-welcome h1, .company-welcome h2, .dashboard-welcome h1, .dashboard-welcome h2 { color: var(--text-primary) !important; }
.welcome-card p, .company-welcome p, .dashboard-welcome p { color: var(--text-secondary) !important; opacity: 1 !important; }

/* ---------- Company panel ---------- */
.dashboard-sidebar .sidebar-logo { background: none !important; color: var(--text-primary) !important; box-shadow: none !important; }
.dashboard-sidebar .sidebar-logo i, .dashboard-sidebar .sidebar-logo span { color: var(--text-primary) !important; -webkit-text-fill-color: currentColor !important; }
.sidebar-nav-link.active, .sidebar-nav-link:hover { background: var(--bg-tertiary) !important; color: var(--text-primary) !important; }
.sidebar-nav-link.active::before { display: none !important; }
.stat-card.primary, .stat-card.success, .stat-card.warning, .stat-card.info, .stat-card.danger, .stat-card.purple {
  background: var(--card-bg) !important;
  color: var(--text-primary) !important;
}
.stat-card .stat-value { color: var(--text-primary) !important; }
.stat-card .stat-label { color: var(--text-muted) !important; opacity: 1 !important; }
.stat-card.success .stat-icon { color: var(--green-500) !important; }
.stat-card.warning .stat-icon { color: var(--yellow-500) !important; }
.stat-card.danger .stat-icon { color: var(--red-500) !important; }

/* ---------- Tables scroll sideways instead of cutting columns ---------- */
.table-container, .table-responsive, .table-wrapper { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }

/* ---------- Laravel pagination (Tailwind markup without Tailwind) ---------- */
nav[role="navigation"] svg { width: 16px !important; height: 16px !important; }
nav[role="navigation"] { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; font-size: var(--text-sm); color: var(--text-muted); }
nav[role="navigation"] > div:first-child:not(:only-child) { display: none; }
nav[role="navigation"] span[aria-current="page"] > span, nav[role="navigation"] a, nav[role="navigation"] span[aria-disabled="true"] > span {
  display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; padding: 0 8px;
  border: 1px solid var(--border-light); border-radius: var(--radius-md); background: var(--card-bg); color: var(--text-secondary); text-decoration: none; margin: 0 2px;
}
nav[role="navigation"] span[aria-current="page"] > span { background: var(--ink); border-color: var(--ink); color: var(--btn-primary-color); }
nav[role="navigation"] p { margin: 0; }

/* Bootstrap pagination markup (Paginator::useBootstrap) */
ul.pagination { display: flex; flex-wrap: wrap; gap: 4px; list-style: none; padding: 0; margin: 0; }
ul.pagination .page-item .page-link, ul.pagination .page-item > span {
  display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; padding: 0 10px;
  border: 1px solid var(--border-light); border-radius: var(--radius-md); background: var(--card-bg); color: var(--text-secondary); text-decoration: none; font-size: var(--text-sm);
}
ul.pagination .page-item.active .page-link, ul.pagination .page-item.active > span { background: var(--ink); border-color: var(--ink); color: var(--btn-primary-color); }
ul.pagination .page-item.disabled .page-link, ul.pagination .page-item.disabled > span { opacity: .45; }

/* Owner profile header: quiet cover strip so the name stays readable */
.profile-header-bg { background: var(--bg-tertiary) !important; }
.profile-header-info h1, .profile-header-info h2, .profile-header-info h3 { color: var(--text-primary) !important; }

/* Page title in the top bar never breaks mid-word */
.page-title { word-break: normal !important; overflow-wrap: normal !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
@media (max-width: 480px) { .page-title { font-size: 1.05rem !important; } }
