/*
Theme Name:   WoodMart Child
Theme URI:    https://omnisource.gr
Description:  Child theme for WoodMart - Omnisource B2B Wholesale
Author:       Omnisource
Author URI:   https://omnisource.gr
Template:     woodmart
Version:      1.1.4
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  woodmart-child
*/

/* ============================================================
   OMNISOURCE — Brand Color System
   Forest dark + Teal-green B2B palette
============================================================ */

:root {
  --os-primary:        #0A9B75;
  --os-primary-hover:  #1DC99A;
  --os-accent:         #1DC99A;
  --os-dark:           #0D1F1B;
  --os-title:          #1A2E1F;
  --os-surface:        #F0EFEA;
  --os-muted:          #5A6F68;
  --os-on-primary:     #FFFFFF;

  --wd-primary-color:           var(--os-primary);
  --wd-link-color:              var(--os-primary);
  --wd-link-color-hover:        var(--os-primary-hover);
  --wd-title-color:             var(--os-title);
  --wd-alternative-color:       var(--os-accent);
  --btn-accented-bgcolor:       var(--os-primary);
  --btn-accented-bgcolor-hover: var(--os-primary-hover);
  --btn-accented-color:         var(--os-on-primary);
  --btn-accented-color-hover:   var(--os-on-primary);
  --notices-success-bgcolor:    var(--os-primary);
}

a { color: var(--os-primary); transition: color .15s ease; }
a:hover, a:focus { color: var(--os-primary-hover); }

.button:not(.disabled), .btn, .single_add_to_cart_button, .checkout-button,
button[type="submit"], .wp-element-button, .wc-block-components-button:not(.is-link),
.woocommerce-button:not(.disabled), .added_to_cart, a.button {
  background-color: var(--os-primary) !important;
  border-color:     var(--os-primary) !important;
  color:            var(--os-on-primary) !important;
  transition: background-color .15s ease, border-color .15s ease;
}
.button:hover, .btn:hover, .single_add_to_cart_button:hover, .checkout-button:hover,
button[type="submit"]:hover, .wp-element-button:hover,
.wc-block-components-button:not(.is-link):hover,
.woocommerce-button:not(.disabled):hover, a.button:hover {
  background-color: var(--os-primary-hover) !important;
  border-color:     var(--os-primary-hover) !important;
  color:            var(--os-on-primary) !important;
}

.onsale, .wd-product-label, .wd-product-label.product-label-new,
.product_label, .new-label {
  background-color: var(--os-accent) !important;
  color:            var(--os-dark)   !important;
}

h1, h2, h3, h4, h5, h6,
.entry-title, .product_title, .woocommerce-loop-product__title {
  color: var(--os-title);
}

input:focus, input[type="text"]:focus, input[type="email"]:focus,
input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus,
input[type="tel"]:focus, input[type="url"]:focus, textarea:focus, select:focus {
  border-color: var(--os-primary) !important;
  box-shadow:   0 0 0 2px rgba(10, 155, 117, .25) !important;
  outline:      none !important;
}

::selection      { background: var(--os-accent); color: var(--os-dark); }
::-moz-selection { background: var(--os-accent); color: var(--os-dark); }

.wp-block-woocommerce-coming-soon, .woocommerce-coming-soon, body.woocommerce-coming-soon {
  background-color: var(--os-dark)    !important;
  color:            var(--os-surface) !important;
}
.wp-block-woocommerce-coming-soon h1, .wp-block-woocommerce-coming-soon h2,
.wp-block-woocommerce-coming-soon h3, .wp-block-woocommerce-coming-soon p,
.wp-block-woocommerce-coming-soon a { color: var(--os-surface) !important; }
.wp-block-woocommerce-coming-soon a:hover { color: var(--os-accent) !important; }

.woocommerce-message  { border-top-color: var(--os-primary) !important; }
.woocommerce-info     { border-top-color: var(--os-primary) !important; }
.woocommerce-message::before { color: var(--os-primary) !important; }

.main-nav .menu-item:hover > a,
.wd-header-nav-wrapper .menu > li:hover > a,
.menu > .menu-item.current-menu-item > a { color: var(--os-primary) !important; }

.wd-loader::before { border-top-color: var(--os-primary) !important; }

.page-numbers.current, .wd-pagination .current {
  background-color: var(--os-primary) !important;
  border-color:     var(--os-primary) !important;
  color:            var(--os-on-primary) !important;
}

.quantity .qty:focus { border-color: var(--os-primary) !important; }

/* ============================================================
   OMNISOURCE — Homepage & Page Sections
============================================================ */

/* ---------- Hero / CTA wide sections ---------- */
.os-hero, .os-cta {
  background-color: var(--os-dark);
  color: var(--os-surface);
  padding: 70px 24px;
  margin: 0 calc(50% - 50vw) 40px;
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  background-image:
    radial-gradient(circle at 20% 20%, rgba(29,201,154,0.08), transparent 40%),
    radial-gradient(circle at 80% 80%, rgba(10,155,117,0.10), transparent 50%);
}
.os-hero-inner {
  max-width: 760px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.os-hero-icon {
  width: clamp(110px, 16vw, 160px);
  height: auto;
  display: block;
  margin: 0 0 20px;
  filter: drop-shadow(0 6px 24px rgba(29,201,154,0.20));
  animation: os-icon-float 6s ease-in-out infinite;
}
@keyframes os-icon-float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-6px); }
}

/* Branded Omni·source text matching the logo */
.os-brand-text {
  font-size: clamp(54px, 9vw, 96px);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1;
  margin: 0 0 16px;
}
.os-brand-text .os-brand-omni   { color: #F0EFEA; font-weight: 400; }
.os-brand-text .os-brand-source { color: var(--os-accent); font-weight: 500; }

.os-hero-tagline {
  color: var(--os-accent) !important;
  font-size: clamp(18px, 2.4vw, 26px);
  font-weight: 500;
  margin: 0 0 22px;
  line-height: 1.35;
  letter-spacing: 0.01em;
}
.os-hero-desc {
  color: var(--os-surface) !important;
  max-width: 620px;
  margin: 0 auto 32px;
  font-size: 17px;
  line-height: 1.65;
  opacity: 0.92;
}
.os-cta { text-align: center; }
.os-cta h2 {
  color: #FFFFFF !important;
  font-size: clamp(28px, 4vw, 40px);
  margin: 0 0 16px;
}
.os-cta p {
  color: var(--os-surface) !important;
  max-width: 560px;
  margin: 0 auto 28px;
  font-size: 17px;
  line-height: 1.6;
  opacity: 0.92;
}
.os-btn-row {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 8px;
  justify-content: center;
}
.os-btn {
  display: inline-block;
  padding: 14px 32px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 16px;
  text-decoration: none !important;
  transition: all .15s ease;
  border: 2px solid transparent;
}
.os-btn-primary {
  background: var(--os-primary);
  color: #FFFFFF !important;
}
.os-btn-primary:hover {
  background: var(--os-accent);
  color: #FFFFFF !important;
  transform: translateY(-1px);
}
.os-btn-outline {
  background: transparent;
  color: #FFFFFF !important;
  border-color: rgba(240,239,234,0.5);
}
.os-btn-outline:hover {
  border-color: var(--os-accent);
  color: var(--os-accent) !important;
  background: rgba(29,201,154,0.08);
}

/* ---------- Sections ---------- */
.os-section { padding: 56px 0; }
.os-section-alt {
  background: var(--os-surface);
  margin: 0 calc(50% - 50vw) 0;
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  padding: 56px 24px;
}
.os-section-narrow { max-width: 900px; margin-left: auto; margin-right: auto; }
.os-section h2 {
  text-align: center;
  font-size: clamp(26px, 3.4vw, 36px);
  color: var(--os-title);
  margin: 0 0 36px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* ---------- Brand grid (logos + names) ---------- */
.os-brand-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.os-brand-grid-secondary {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 16px;
  max-width: 66.66%;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 768px) {
  .os-brand-grid { grid-template-columns: repeat(2, 1fr); }
  .os-brand-grid-secondary { max-width: 100%; }
}
.os-brand-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 28px 20px;
  background: #FFFFFF;
  border: 1px solid rgba(10,155,117,0.15);
  border-radius: 14px;
  text-align: center;
  color: var(--os-title) !important;
  text-decoration: none !important;
  transition: all 0.2s ease;
  min-height: 140px;
}
.os-brand-card:hover {
  border-color: var(--os-primary);
  transform: translateY(-3px);
  box-shadow: 0 10px 28px rgba(10,155,117,0.16);
  color: var(--os-primary) !important;
}
.os-brand-logo {
  width: 52px;
  height: 52px;
  object-fit: contain;
  transition: filter 0.25s ease, transform 0.25s ease;
}
.os-brand-logo-wide { width: 110px; height: 38px; }
.os-brand-card:hover .os-brand-logo {
  transform: scale(1.06);
  filter: brightness(0) saturate(100%) invert(46%) sepia(64%) saturate(513%) hue-rotate(125deg) brightness(94%) contrast(95%);
}
.os-brand-name {
  font-weight: 600;
  font-size: 16px;
  letter-spacing: 0.01em;
}
.os-brand-card-other {
  background: linear-gradient(135deg, rgba(10,155,117,0.05), rgba(29,201,154,0.05));
  border-style: dashed;
}
.os-brand-dots {
  font-size: 32px;
  font-weight: 300;
  color: var(--os-primary);
  line-height: 1;
}

/* ---------- Value props grid ---------- */
.os-value-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
@media (max-width: 980px) { .os-value-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .os-value-grid { grid-template-columns: 1fr; } }
.os-value-item {
  padding: 28px 20px;
  text-align: center;
}
.os-value-item .os-icon {
  display: inline-flex;
  width: 64px;
  height: 64px;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  background: rgba(10,155,117,0.10);
  color: var(--os-primary);
  border-radius: 50%;
  margin: 0 auto 16px;
}
.os-value-item h3 {
  color: var(--os-title) !important;
  font-size: 18px;
  margin: 0 0 10px;
}
.os-value-item p {
  color: var(--os-muted);
  font-size: 15px;
  line-height: 1.55;
  margin: 0;
}

/* ---------- About / Contact text pages ---------- */
.os-page-intro {
  max-width: 760px;
  margin: 0 auto 40px;
  text-align: center;
  font-size: 17px;
  color: var(--os-muted);
  line-height: 1.7;
}
.os-page-intro p { margin: 0 0 14px; }

.os-info-card {
  background: var(--os-surface);
  border-left: 4px solid var(--os-primary);
  padding: 24px 28px;
  border-radius: 8px;
  margin: 20px 0;
}
.os-info-card h3 {
  color: var(--os-primary) !important;
  margin: 0 0 10px;
  font-size: 18px;
}
.os-info-card p { margin: 0; color: var(--os-title); }
.os-info-card a { color: var(--os-primary); font-weight: 600; }

.os-feature-list {
  list-style: none;
  padding: 0;
  margin: 24px 0;
}
.os-feature-list li {
  padding: 12px 0 12px 32px;
  position: relative;
  color: var(--os-title);
  font-size: 16px;
}
.os-feature-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 12px;
  color: var(--os-primary);
  font-weight: 700;
  font-size: 18px;
}

/* ============================================================
   OMNISOURCE — Hide top bar, Create Account, replace logo
============================================================ */

/* Hide top bar ('FREE SHIPPING...' + dup brand links) */
.whb-top-bar,
.whb-row-top,
.header-banner,
header .whb-header-top {
  display: none !important;
}

/* Hide 'Create an Account' link in sign-in popup */
.wd-popup-content a[href*="action=register"],
.wd-popup-content a[href*="register"],
.wd-popup-acc .create-account,
.wd-popup-acc-link,
.wd-account-popup a[href*="register"],
.wd-popup a.create-account,
.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--register,
.wd-popup .wd-popup-header a:not([href*="lost-password"]):not([href*="my-account"]) {
  display: none !important;
}
/* Specifically the 'Create an Account' top-right link in the popup */
.wd-popup-acc h3 + a,
.wd-popup-content > a[href*="my-account"]:first-of-type {
  display: none !important;
}

/* ---------- Logo: aggressively force visibility everywhere ---------- */
.site-logo.wd-switch-logo { display: none !important; }

html body .site-logo,
html body .site-logo .wd-logo,
html body .wd-main-logo,
html body .wd-sticky-logo,
html body .wd-mobile-logo {
  display: inline-flex !important;
  align-items: center;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
  position: static !important;
  min-width: 200px;
  min-height: 44px;
}

html body .wd-logo img,
html body .wd-logo img.attachment-full,
html body .wd-logo .custom-logo {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 200px !important;
  height: auto !important;
  max-width: 200px !important;
  max-height: 50px !important;
  object-fit: contain;
  margin: 0 !important;
}

/* Sticky / mobile = round icon (smaller) */
html body .wd-sticky-logo,
html body .wd-mobile-logo { min-width: 50px; }
html body .wd-sticky-logo img,
html body .wd-mobile-logo img {
  width: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
}

.wd-logo { text-decoration: none !important; }
.os-footer-logo { display: block !important; }

/* ---------- Contact form (provided by omnisource-messages plugin) ---------- */
.omn-contact-form {
  max-width: 640px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.omn-form-row { display: flex; flex-direction: column; gap: 6px; }
.omn-form-row label {
  font-size: 14px;
  font-weight: 500;
  color: var(--os-title);
}
.omn-form-row input,
.omn-form-row textarea {
  padding: 12px 14px;
  border: 1px solid rgba(10,155,117,0.20);
  border-radius: 8px;
  font-size: 15px;
  font-family: inherit;
  background: #fff;
  color: var(--os-title);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.omn-form-row textarea { resize: vertical; min-height: 130px; }
.omn-submit-btn {
  align-self: flex-start;
  background: var(--os-primary);
  color: #fff;
  border: none;
  padding: 14px 32px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color .15s ease, transform .15s ease;
}
.omn-submit-btn:hover { background: var(--os-accent); transform: translateY(-1px); }
.omn-submit-btn:disabled { opacity: 0.6; cursor: not-allowed; }
.omn-form-status { font-size: 14px; padding: 10px 14px; border-radius: 6px; min-height: 1.2em; }
.omn-form-success { background: rgba(29,201,154,0.12); color: var(--os-primary); border: 1px solid var(--os-primary); }
.omn-form-error   { background: rgba(207,46,46,0.10); color: #cf2e2e; border: 1px solid #cf2e2e; }

/* ============================================================
   OMNISOURCE — Hide duplicate 'Header categories' pill bar
============================================================ */

/* The black row of pill-shaped brand buttons below the top bar — duplicate of top nav */
.wd-header-secondary-nav,
nav[aria-label="Header categories menu"],
nav.wd-header-nav.wd-header-secondary-nav,
.whb-row .wd-header-nav.wd-nav-secondary {
  display: none !important;
}

/* Also kill any header row that ends up empty after hiding it */
.whb-row:has(> .whb-column:only-child:empty),
.whb-row.whb-empty {
  display: none !important;
}

/* ============================================================
   OMNISOURCE — Mobile menu cleanup
============================================================ */

/* Hide entire tabs UI inside the mobile drawer (Categories/Menu switcher) */
.mobile-nav .wd-tabs-nav,
.mobile-nav .wd-nav-tabs,
.mobile-nav .nav-tabs,
.mobile-nav .wd-tools-nav,
.mobile-nav .mobile-nav-tabs,
.mobile-nav [class*="tab-cats"],
.mobile-nav [class*="cats-tab"],
.mobile-nav [class*="tab-categor"],
.mobile-nav .wd-cats-nav,
.wd-side-hidden .wd-nav-mob-tab,
.wd-side-hidden .nav-tabs,
.wd-side-hidden [class*="tab-cats"] {
  display: none !important;
}

/* Force the menu panel to stay visible even when tabs hidden */
.mobile-nav .wd-tab-content,
.mobile-nav [class*="tab-content"],
.mobile-nav .wd-tab-menu,
.mobile-nav [class*="tab-menu"] {
  display: block !important;
  width: 100% !important;
}

/* ============================================================
   OMNISOURCE — Hide unwanted WoodMart demo elements
============================================================ */

/* Hide broken 'Discounts' button (points to dummy.xtemos.com demo) */
a[href*="dummy.xtemos.com"] { display: none !important; }
.wd-button-wrapper:has(a[href*="dummy.xtemos.com"]) { display: none !important; }

/* Hide 'Blog' menu link (top bar secondary menu) */
.item-with-label a[href$="/blog/"],
.item-with-label a[href$="/blog"] { display: none !important; }
li.item-with-label:has(> a[href$="/blog/"]) { display: none !important; }
li.item-with-label:has(> a[href$="/blog"])  { display: none !important; }

/* Hide WoodMart 'Categories' mega-menu trigger (uses #-href + Icon.svg) */
li.menu-item:has(> a[href="#"] > img[src*="/Icon.svg"]) { display: none !important; }
li.menu-item:has(> a > .nav-link-text:only-child) > a[href="#"] { /* fallback selector */ }

/* Hide WoodMart credit in footer */
.copyrights-wrapper a[href*="xtemos.com"],
.copyrights-wrapper a[href*="woodmart"] { display: none !important; }
.copyrights-wrapper:has(> *:only-child a[href*="xtemos"]) { display: none !important; }

/* ============================================================
   OMNISOURCE — Custom Footer
============================================================ */

.os-footer {
  background: var(--os-dark);
  color: var(--os-surface);
  padding: 56px 24px 0;
  margin-top: 60px;
}
.os-footer-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  gap: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(240,239,234,0.10);
}
@media (max-width: 900px) {
  .os-footer-inner { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 540px) {
  .os-footer-inner { grid-template-columns: 1fr; gap: 28px; text-align: center; }
}

.os-footer-col h4 {
  color: var(--os-accent) !important;
  font-size: 15px;
  font-weight: 600;
  margin: 0 0 18px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.os-footer-col ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.os-footer-col ul li {
  margin: 0 0 10px;
}
.os-footer-col ul li a {
  color: var(--os-surface);
  font-size: 15px;
  text-decoration: none;
  opacity: 0.85;
  transition: opacity 0.15s ease, color 0.15s ease;
}
.os-footer-col ul li a:hover {
  color: var(--os-accent);
  opacity: 1;
}
.os-footer-col p {
  color: var(--os-surface);
  opacity: 0.85;
  font-size: 14px;
  line-height: 1.6;
  margin: 0 0 12px;
}

.os-footer-brand .os-footer-logo {
  width: 200px;
  max-width: 100%;
  margin-bottom: 16px;
  display: block;
}
@media (max-width: 540px) {
  .os-footer-brand .os-footer-logo { margin-left: auto; margin-right: auto; }
}

.os-footer-contact {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  font-size: 14px;
}
@media (max-width: 540px) { .os-footer-contact { justify-content: center; } }
.os-footer-contact a {
  color: var(--os-surface);
  text-decoration: none;
  opacity: 0.9;
}
.os-footer-contact a:hover { color: var(--os-accent); opacity: 1; }
.os-footer-icon {
  font-size: 14px;
  width: 18px;
  display: inline-flex;
  justify-content: center;
}

.os-footer-bottom {
  max-width: 1200px;
  margin: 0 auto;
  padding: 22px 0;
  text-align: center;
}
.os-footer-bottom p {
  margin: 0;
  color: var(--os-surface);
  opacity: 0.65;
  font-size: 13px;
}
.os-footer-bottom strong { color: var(--os-accent); }

/* ---------- End of Omnisource section styles ---------- */
