/* NoirParts brand overlay for standard Odoo pages (checkout, login, signup,
   account portal). Reuses the same palette as the custom storefront
   (np_style.css) so these pages no longer look like a different, unbranded
   site. Loaded site-wide via an inheriting view on website.layout so it
   applies to every controller-rendered page without touching Odoo's core
   templates. */

:root{
  --np-ink:#201c18;
  --np-ink-2:#2b2620;
  --np-red:#c1442b;
  --np-red-dark:#9c341f;
  --np-paper:#f4f1ea;
  --np-line:#e3ddd0;
  --np-muted:#776d60;
  --np-brass:#b8894a;
  --np-radius:8px;
}

/* Base page canvas + typography */
body{
  background-color:var(--np-paper) !important;
  color:var(--np-ink) !important;
}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{
  color:var(--np-ink) !important;
}
a{ color:var(--np-red); }
a:hover{ color:var(--np-red-dark); }

/* Primary buttons (Checkout, Pay now, Sign up, Log in, Confirm, Apply, etc.) */
.btn-primary{
  background-color:var(--np-red) !important;
  border-color:var(--np-red) !important;
  color:#fff !important;
}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active{
  background-color:var(--np-red-dark) !important;
  border-color:var(--np-red-dark) !important;
}
.btn-secondary{
  background-color:var(--np-ink) !important;
  border-color:var(--np-ink) !important;
  color:#fff !important;
}
.btn-secondary:hover,.btn-secondary:focus{
  background-color:var(--np-ink-2) !important;
  border-color:var(--np-ink-2) !important;
}
.btn-outline-primary{
  color:var(--np-red) !important;
  border-color:var(--np-red) !important;
}
.btn-outline-primary:hover{
  background-color:var(--np-red) !important;
  border-color:var(--np-red) !important;
  color:#fff !important;
}
.btn-link{ color:var(--np-red) !important; }

/* Form inputs: focus/active states in brass instead of Odoo's default blue */
.form-control:focus,.form-select:focus,input:focus,textarea:focus{
  border-color:var(--np-brass) !important;
  box-shadow:0 0 0 .2rem rgba(184,137,74,.25) !important;
}
input[type=radio]:checked,input[type=checkbox]:checked{
  background-color:var(--np-red) !important;
  border-color:var(--np-red) !important;
  accent-color:var(--np-red);
}

/* Checkout/portal stepper + breadcrumb (Order > Address > Payment, etc.) */
.o_wizard .o_wizard_step.text-primary,
.o_wizard .o_wizard_step.active,
.breadcrumb-item.active,
.breadcrumb a.text-primary{
  color:var(--np-red) !important;
}
.o_wizard .o_wizard_step .fa,
.o_wizard .o_wizard_step .o_wizard_step_icon{
  color:var(--np-brass) !important;
}

/* Cards / panels used throughout checkout, portal, address forms */
.card,.o_portal_my_home .card,.o_wizard_step_card{
  border-color:var(--np-line) !important;
  border-radius:var(--np-radius) !important;
}
.card.border-primary,.border-primary{
  border-color:var(--np-red) !important;
}
.bg-primary{ background-color:var(--np-red) !important; }
.text-primary{ color:var(--np-red) !important; }

/* Portal account tiles (My Invoices / My Orders / Addresses / Security) */
.o_portal_my_home .col-12 .card,
.o_portal_index_card{
  background-color:#fff !important;
}
.o_portal_my_home .card:hover{
  border-color:var(--np-brass) !important;
  box-shadow:0 4px 14px rgba(40,32,20,.12) !important;
}

/* Top header "Contact Us" CTA and account menu, so header reads consistently
   with the rest of the site even though it's Odoo's default navbar markup */
.o_header_standard .btn-primary,
header .btn-primary{
  background-color:var(--np-brass) !important;
  border-color:var(--np-brass) !important;
  color:var(--np-ink) !important;
}
.o_header_standard .btn-primary:hover{
  background-color:var(--np-red) !important;
  border-color:var(--np-red) !important;
  color:#fff !important;
}

/* Alerts (e.g. delivery method warnings) keep semantic colors but align
   corners/border weight with the rest of the site */
.alert{ border-radius:var(--np-radius) !important; }

/* alert-primary is Odoo's default blue "info" callout (e.g. "Invoices to pay"
   on the portal home) - it isn't a red/green/yellow semantic state, so it
   should follow the brand palette instead of Bootstrap's default blue */
.alert-primary{
  background-color:#f6ecd9 !important;
  border-color:var(--np-brass) !important;
  color:var(--np-ink) !important;
}
.alert-primary .btn-secondary{
  background-color:var(--np-ink) !important;
  border-color:var(--np-ink) !important;
  color:#fff !important;
}

/* Login / signup card */
.oe_login_form,.oe_signup_form{
  color:var(--np-ink);
}


/* Match the custom storefront's body typeface (np_style.css uses a native
   system-font stack, not Odoo's default "Inter") so standard Odoo pages -
   shop listing, checkout, login, signup, portal - read as the same site
   instead of a generic Odoo backend look. Headings already use Oswald
   consistently on both, so only body/text elements need this. */
:root, body, html{
  --bs-body-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}
body, input, select, textarea, button, .btn,
p, span, div, label, a, li, td, th{
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}
.fa, [class*=" fa-"], [class^="fa-"], .oi, [class*=" oi-"], [class^="oi-"],
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{
  font-family: Oswald, "Odoo Unicode Support Noto", sans-serif !important;
}
.fa, [class*=" fa-"], [class^="fa-"], .oi, [class*=" oi-"], [class^="oi-"]{
  font-family: FontAwesome, odoo_ui_icons !important;
}
