/* Unique Point Marketing - WHMCS client area brand theme (child of Twenty-One).
   Change the colours in one place: the :root block below. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root {
  --up-orange: #FE6208;
  --up-orange-dark: #E0540A;
  --up-orange-band: #F36311;
  --up-ink: #0B0B0A;
  --up-text: #55555B;
  --up-bg: #FCF8F3;
  --up-card: #FFFFFF;
  --up-rule: #E6E0DA;
}

body {
  font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  color: var(--up-text);
  background-color: var(--up-bg);
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: 'Inter', sans-serif;
  color: var(--up-ink);
  font-weight: 800;
  letter-spacing: -0.02em;
}
h1, .h1 { font-weight: 800; letter-spacing: -0.03em; }

a { color: var(--up-orange-dark); }
a:hover, a:focus { color: var(--up-orange); }

/* Header + navigation */
#header.header, .header { background-color: var(--up-bg); box-shadow: none; border-bottom: 1px solid var(--up-rule); }
.navbar-light .navbar-nav .nav-link { color: var(--up-ink); font-weight: 500; }
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .active > .nav-link { color: var(--up-orange); }
#main-menu, .navbar { background-color: var(--up-bg); }
.master-breadcrumb { background-color: #F5EEE6; border-bottom: 1px solid var(--up-rule); }
.master-breadcrumb .breadcrumb { background: transparent; }

/* Logo sizing (logo set via General Settings > Logo URL) */
.navbar-brand img, #header .logo img { max-height: 48px; width: auto; }

/* Buttons: orange pill, as on the website */
.btn { border-radius: 999px; font-weight: 600; padding-left: 1.4rem; padding-right: 1.4rem; }
.btn-primary, .btn-success {
  background-color: var(--up-orange); border-color: var(--up-orange); color: #fff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-success:hover, .btn-success:focus, .btn-success:active {
  background-color: var(--up-orange-dark) !important; border-color: var(--up-orange-dark) !important; color: #fff;
}
.btn-default, .btn-secondary, .btn-outline-primary {
  background: transparent; color: var(--up-ink); border: 1px solid var(--up-ink);
}
.btn-default:hover, .btn-secondary:hover, .btn-outline-primary:hover {
  background: var(--up-ink); color: #fff; border-color: var(--up-ink);
}

/* Cards, panels, tables */
.card, .panel, .tile, .list-group-item {
  border-color: var(--up-rule); border-radius: 14px; background-color: var(--up-card);
}
.card-header, .panel-heading { background-color: #fff; border-bottom: 1px solid var(--up-rule); color: var(--up-ink); font-weight: 700; }
.card-sidebar .list-group-item.active, .list-group-item.active {
  background-color: var(--up-ink); border-color: var(--up-ink); color: #fff;
}
.card-sidebar .card-header { background-color: var(--up-ink); color: #fff; }
.card-sidebar .card-header .card-title, .card-sidebar .card-header i { color: #fff; }
.table thead th { border-bottom: 2px solid var(--up-orange); color: var(--up-ink); }
.tile:hover { border-color: var(--up-orange); }
.tile i, .tile .stat { color: var(--up-orange); }

/* Forms */
.form-control { border-radius: 10px; border-color: #D9D2CA; }
.form-control:focus, .custom-select:focus {
  border-color: var(--up-orange); box-shadow: 0 0 0 0.2rem rgba(254, 98, 8, 0.18);
}
.custom-control-input:checked ~ .custom-control-label::before { background-color: var(--up-orange); border-color: var(--up-orange); }
.input-group-text { background: #F5EEE6; border-color: #D9D2CA; color: var(--up-ink); }

/* Pagination, labels, badges, progress */
.page-item.active .page-link { background-color: var(--up-orange); border-color: var(--up-orange); }
.page-link { color: var(--up-orange-dark); }
.badge-primary, .label-primary { background-color: var(--up-orange); }
.progress-bar { background-color: var(--up-orange); }

/* Order form (Standard Cart) */
.product, .products .product { border-radius: 14px; }
.products .product header, #order-standard_cart .products .product header { background-color: var(--up-ink); color: #fff; }
#order-standard_cart .view-cart-items-header,
#order-standard_cart .order-summary h2 { background-color: var(--up-ink); }
#order-standard_cart .btn-order-now, #order-standard_cart .btn-checkout { background-color: var(--up-orange); border-color: var(--up-orange); }
#order-standard_cart .price .amt, #order-standard_cart .total-due-today .amt { color: var(--up-orange-dark); }
#order-standard_cart .cart-sidebar .card-title { color: #fff; }

/* Footer: charcoal band with orange accent */
#footer.footer, .footer { background-color: var(--up-ink); border-top: 4px solid var(--up-orange); color: #CFCAC4; }
.footer a, .footer .nav-link { color: #fff; }
.footer a:hover { color: var(--up-orange); }
.footer .btn, .footer .btn-default { border-color: #fff; color: #fff; }

/* Login / register */
.logincontainer .card, .login-form .card { box-shadow: 0 12px 40px rgba(11, 11, 10, 0.08); }

/* UPM page background + logo tweaks */
html, body, #main-body, .main-content, section#main-body { background-color: var(--up-bg); }
.navbar-brand img { max-height: 52px; }
/* Below-footer area matches the footer */
html { background-color: var(--up-ink); }