/* ==========================================
   SOFTOCART Custom Theme Overrides
   Modern color palette + typography polish
   ========================================== */

/* -- Color Palette Override --
   Primary:   #2563eb (vibrant blue)
   Primary-d: #1d4ed8 (darker blue for hover)
   Accent:    #f59e0b (warm amber)
   Dark:      #0f172a (rich dark navy)
   Text:      #1e293b (slate)
   Subtle:    #64748b (muted slate)
   Light BG:  #f8fafc (cool off-white)
*/

/* Body typography */
.u-body {
  font-family: 'Inter', sans-serif;
  color: #1e293b;
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  letter-spacing: -0.02em;
  /* Color inherited from parent sections — Nicepage handles dark/light context */
}

/* ---- White text for dark/shaded sections ---- */
/* Hero carousel slides with dark photo backgrounds */
.u-shading h1,
.u-shading h2,
.u-shading h3,
.u-shading h4,
.u-shading h5,
.u-shading h6,
.u-shading p,
.u-shading .u-text {
  color: #ffffff !important;
}

/* Ensure footer text stays white */
.u-grey-80 p,
.u-grey-80 .u-text {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* -- Header / Nav Styling -- */
.u-header {
  background-color: #ffffff !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
  transition: box-shadow 0.3s ease;
}

.u-nav-link {
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.01em;
  transition: color 0.25s ease !important;
}

/* Nav link colors */
.u-nav-container .u-nav-link {
  color: #334155 !important;
}

.u-nav-container .u-nav-link:hover,
.u-nav-container .u-nav-link:focus {
  color: #2563eb !important;
}

/* Active nav link */
.u-text-active-palette-1-base:active,
.u-text-active-palette-1-base.active,
li.active > .u-text-active-palette-1-base {
  color: #2563eb !important;
}

/* -- Primary Palette Override (Blue) -- */
.u-palette-1-base,
.u-body.u-palette-1-base,
section.u-palette-1-base:before,
.u-palette-1-base > .u-container-layout:before,
.u-palette-1-base > .u-inner-container-layout:before,
.u-palette-1-base.u-sidenav:before,
.u-container-layout.u-container-layout.u-palette-1-base:before {
  background-color: #2563eb;
}

.u-input.u-palette-1-base,
.u-field-input.u-palette-1-base,
.u-button-style.u-palette-1-base,
.u-button-style.u-palette-1-base[class*="u-border-"] {
  background-color: #2563eb !important;
}

.u-button-style.u-palette-1-base:hover,
.u-button-style.u-palette-1-base[class*="u-border-"]:hover,
.u-button-style.u-palette-1-base:focus,
.u-button-style.u-palette-1-base[class*="u-border-"]:focus {
  background-color: #1d4ed8 !important;
}

a.u-link.u-hover-palette-1-base:hover {
  color: #2563eb !important;
}

/* -- Accent Palette Override (Amber) -- */
.u-palette-2-base,
.u-body.u-palette-2-base,
section.u-palette-2-base:before,
.u-palette-2-base > .u-container-layout:before {
  background-color: #f59e0b;
}

.u-button-style.u-palette-2-base,
.u-button-style.u-palette-2-base[class*="u-border-"] {
  background-color: #f59e0b !important;
}

.u-button-style.u-palette-2-base:hover,
.u-button-style.u-palette-2-base[class*="u-border-"]:hover {
  background-color: #d97706 !important;
}

/* Nav hover accent */
.u-text-hover-palette-2-base:hover,
.u-text-hover-palette-2-base:focus {
  color: #2563eb !important;
}

/* -- Dark sections -- */
.u-color-1-dark-3,
.u-body.u-color-1-dark-3,
section.u-color-1-dark-3:before,
.u-color-1-dark-3 > .u-container-layout:before,
.u-color-1-dark-3 > .u-inner-container-layout:before,
.u-color-1-dark-3.u-sidenav:before,
.u-container-layout.u-container-layout.u-color-1-dark-3:before {
  background-color: #0f172a;
}

.u-color-1-dark-2,
.u-body.u-color-1-dark-2,
section.u-color-1-dark-2:before,
.u-color-1-dark-2 > .u-container-layout:before {
  background-color: #1e293b;
}

.u-color-1-dark-1,
.u-body.u-color-1-dark-1,
section.u-color-1-dark-1:before,
.u-color-1-dark-1 > .u-container-layout:before {
  background-color: #1d4ed8;
}

/* -- Light blue shades -- */
.u-color-1-light-1,
.u-body.u-color-1-light-1,
section.u-color-1-light-1:before,
.u-color-1-light-1 > .u-container-layout:before {
  background-color: #60a5fa;
}

.u-color-1-light-2,
.u-body.u-color-1-light-2,
section.u-color-1-light-2:before,
.u-color-1-light-2 > .u-container-layout:before {
  background-color: #93c5fd;
}

/* -- Text color overrides for palette classes -- */
.u-text-palette-1-base {
  color: #2563eb !important;
}

.u-text-palette-1-dark-2 {
  color: #1e293b !important;
}

.u-text-palette-2-base {
  color: #f59e0b !important;
}

/* -- Buttons -- */
.u-btn {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  border-radius: 6px;
  transition: all 0.25s ease;
}

.u-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25);
}

/* -- Form inputs -- */
.u-input,
.u-field-input {
  font-family: 'Inter', sans-serif;
  border-radius: 6px;
  border: 1.5px solid #e2e8f0;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.u-input:focus,
.u-field-input:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
  outline: none;
}

/* -- Footer -- */
footer.u-footer {
  background-color: #0f172a !important;
}

/* -- Product cards -- */
.u-products-item {
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.u-products-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.1);
}

/* -- Blog cards -- */
.u-blog-post {
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.u-blog-post:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.1);
}

/* -- Border color overrides -- */
.u-border-palette-1-base {
  border-color: #2563eb !important;
}

.u-border-palette-1-dark-2 {
  border-color: #1e293b !important;
}

/* -- Smooth scroll -- */
html {
  scroll-behavior: smooth;
}

/* -- Selection color -- */
::selection {
  background-color: #2563eb;
  color: #ffffff;
}