/*
Theme Name: Tosem Steel Premium
Theme URI: https://tosemsteel.com
Author: Tosem Steel Pvt. Ltd.
Author URI: https://tosemsteel.com
Description: A premium, industrial WordPress theme designed specifically for Tosem Steel Pvt. Ltd. — steel manufacturer & supplier in India. Features modern industrial design, sticky header, product showcase, enquiry forms, and conversion-optimized layouts.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tosem-steel
Tags: industrial, manufacturing, steel, b2b, one-page, custom-menu, responsive-layout, custom-colors

Tosem Steel Premium Theme © 2026 Tosem Steel Pvt. Ltd.
Built for tosemsteel.com
*/

@import url('../tosem-steel.css');

/* ============================================================
   THEME-SPECIFIC OVERRIDES
   ============================================================ */

/* WordPress Admin Bar compensation */
body.admin-bar .header {
  top: 32px;
}
@media (max-width: 782px) {
  body.admin-bar .header {
    top: 46px;
  }
}

/* ============================================================
   WOOCOMMERCE COMPATIBILITY (if used later)
   ============================================================ */
.woocommerce .products .product {
  text-align: center;
  padding: var(--space-4);
}

.woocommerce .button {
  font-family: var(--font-heading, 'Montserrat', sans-serif) !important;
}

.woocommerce div.product .product_title {
  font-family: var(--font-heading, 'Montserrat', sans-serif) !important;
}

/* ============================================================
   ELEMENTOR COMPATIBILITY
   ============================================================ */
.elementor-editor-active .header {
  position: relative;
  z-index: auto;
}

.elementor-widget-tosem-steel-enquiry-form .enquiry-form-wrapper {
  box-shadow: none;
}

/* ============================================================
   GRAVITY FORMS OVERRIDES (if used)
   ============================================================ */
.gform_wrapper .top_label .gfield_label {
  font-family: var(--font-body, 'Inter', sans-serif);
  font-weight: 600;
}

/* ============================================================
   CUSTOM UTILITIES
   ============================================================ */
.has-orange-text { color: var(--color-orange, #E85D04) !important; }
.has-orange-bg   { background-color: var(--color-orange, #E85D04) !important; }
.has-navy-bg     { background-color: var(--color-navy, #0A1628) !important; }
.text-navy       { color: var(--color-navy, #0A1628) !important; }

/* ============================================================
   ANNOUNCEMENT BAR (optional, via Customizer)
   ============================================================ */
.site-announcement {
  background: var(--color-orange, #E85D04);
  color: var(--color-white, #fff);
  text-align: center;
  padding: 8px var(--gutter, 24px);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.03em;
}
.site-announcement a {
  color: var(--color-white, #fff);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ============================================================
   BREADCRUMBS
   ============================================================ */
.tosem-breadcrumbs {
  padding: 16px 0;
  font-size: 0.875rem;
  color: var(--color-grey-dark, #6C757D);
}
.tosem-breadcrumbs a {
  color: var(--color-grey-dark, #6C757D);
  text-decoration: none;
}
.tosem-breadcrumbs a:hover {
  color: var(--color-orange, #E85D04);
}
.tosem-breadcrumbs .sep {
  margin: 0 8px;
  opacity: 0.4;
}
.tosem-breadcrumbs .current {
  color: var(--color-orange, #E85D04);
  font-weight: 600;
}

/* ============================================================
   SCROLL TO TOP
   ============================================================ */
.scroll-to-top {
  position: fixed;
  bottom: 80px;
  right: var(--gutter, 24px);
  width: 44px;
  height: 44px;
  background: var(--color-navy, #0A1628);
  color: var(--color-white, #fff);
  border: none;
  border-radius: var(--radius-full, 9999px);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition: all 0.3s ease;
  z-index: 500;
  box-shadow: 0 4px 20px rgba(10,22,40,0.3);
}
.scroll-to-top.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.scroll-to-top:hover {
  background: var(--color-orange, #E85D04);
  color: var(--color-white, #fff);
  transform: translateY(-2px);
}