/*
Theme Name: Gerhelm Child
Theme URI: https://shop.gerhelm.de
Description: Child theme fuer Golfanlage Gerhelm - 1:1 Design nach gerhelm.de
Author: Golfanlage Gerhelm
Template: astra
Version: 4.0.0
*/

@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:ital,wght@0,300;0,400;0,600;0,700;1,400&display=swap');

:root {
    --g-gruen:        #3d6b2e;
    --g-gruen-dunkel: #2d5020;
    --g-gruen-hell:   #4a7f37;
    --g-weiss:        #ffffff;
    --g-hellgrau:     #f5f5f5;
    --g-grau:         #888888;
    --g-text:         #333333;
    --g-border:       #dddddd;
    --g-font:         'Titillium Web', sans-serif;
}

/* ============================================
   GLOBAL
   ============================================ */
body, html {
    font-family: var(--g-font) !important;
    color: var(--g-text);
    background-color: var(--g-weiss) !important;
    margin: 0;
    padding: 0;
}

* { font-family: var(--g-font) !important; }

a { color: var(--g-gruen) !important; text-decoration: none !important; }
a:hover { color: var(--g-gruen-dunkel) !important; }

h1, h2, h3, h4, h5, h6 {
    font-family: var(--g-font) !important;
    color: var(--g-gruen) !important;
}

/* ============================================
   HEADER - Kompakter grüner Header wie gerhelm.de
   Logo rechts, Hamburger links, kompakte Höhe
   ============================================ */
#masthead,
.site-header,
header.site-header,
.main-header-bar,
.ast-primary-header-bar {
    background-color: var(--g-gruen) !important;
    border-bottom: none !important;
    box-shadow: none !important;
    min-height: 60px !important;
    padding: 0 !important;
}

.ast-site-header-wrap {
    padding: 0 20px !important;
    min-height: 60px !important;
    display: flex !important;
    align-items: center !important;
}

/* Site-Titel */
.site-title a,
.ast-site-title a {
    color: var(--g-weiss) !important;
    font-weight: 700 !important;
    font-size: 20px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
}

.site-description { display: none !important; }

/* Logo */
.custom-logo,
.site-logo img,
.ast-site-header-wrap img {
    max-height: 55px !important;
    width: auto !important;
}

/* ============================================
   NAVIGATION - weiße Schrift, kompakt, uppercase
   ============================================ */
.main-navigation,
.ast-nav-menu,
#ast-hf-menu-1,
.main-header-menu {
    background-color: var(--g-gruen) !important;
}

/* Nav Links - weiß, uppercase, kompakt */
.main-navigation a,
.ast-nav-menu > li > a,
#ast-hf-menu-1 .menu-item > a,
.main-header-menu .menu-item > a {
    color: var(--g-weiss) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    padding: 8px 14px !important;
    text-decoration: none !important;
    transition: background-color 0.2s !important;
    line-height: 1.2 !important;
}

.main-navigation a:hover,
.ast-nav-menu > li > a:hover,
#ast-hf-menu-1 .menu-item > a:hover {
    background-color: var(--g-gruen-dunkel) !important;
    color: var(--g-weiss) !important;
}

.current-menu-item > a,
.current_page_item > a {
    background-color: var(--g-gruen-dunkel) !important;
    color: var(--g-weiss) !important;
}

/* Dropdown */
.sub-menu { background-color: var(--g-gruen-dunkel) !important; border: none !important; }
.sub-menu a { color: var(--g-weiss) !important; font-size: 13px !important; padding: 9px 16px !important; }
.sub-menu a:hover { background-color: var(--g-gruen) !important; }

/* Mobil */
.ast-mobile-menu-trigger-minimal svg,
.ast-mobile-menu-trigger path,
.menu-toggle,
.ast-mobile-menu-trigger span {
    color: var(--g-weiss) !important;
    fill: var(--g-weiss) !important;
    stroke: var(--g-weiss) !important;
}

.ast-header-break-point .site-header,
.ast-header-break-point #masthead {
    background-color: var(--g-gruen) !important;
}

.ast-header-break-point .main-navigation {
    background-color: var(--g-gruen) !important;
}

/* ============================================
   CONTENT
   ============================================ */
.site-content, #content, #primary {
    background-color: var(--g-weiss) !important;
}

/* Breadcrumb */
.woocommerce-breadcrumb {
    font-size: 13px !important;
    color: var(--g-grau) !important;
    padding: 8px 0 !important;
    margin-bottom: 20px !important;
    border-bottom: 1px solid var(--g-border) !important;
}
.woocommerce-breadcrumb a { color: var(--g-gruen) !important; }

/* ============================================
   WOOCOMMERCE SHOP
   ============================================ */
h1.page-title,
.woocommerce-products-header__title {
    font-size: 26px !important;
    font-weight: 700 !important;
    color: var(--g-gruen) !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    border-bottom: 2px solid var(--g-gruen) !important;
    padding-bottom: 12px !important;
    margin-bottom: 25px !important;
}

.woocommerce ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
    margin: 0 !important;
}

@media (max-width: 768px) {
    .woocommerce ul.products { grid-template-columns: 1fr !important; }
}
@media (max-width: 1024px) and (min-width: 769px) {
    .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; }
}

.woocommerce ul.products li.product {
    background: var(--g-weiss) !important;
    border: 1px solid var(--g-border) !important;
    border-radius: 0 !important;
    padding: 20px !important;
    text-align: center !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
    margin: 0 !important;
    float: none !important;
    width: auto !important;
}

.woocommerce ul.products li.product:hover {
    border-color: var(--g-gruen) !important;
    box-shadow: 0 4px 15px rgba(61,107,46,0.15) !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2 {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: var(--g-gruen) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 8px !important;
}

.woocommerce ul.products li.product .price,
.woocommerce .price {
    color: var(--g-gruen) !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    display: block !important;
    margin-bottom: 12px !important;
}

/* ============================================
   BUTTONS - Gerhelm Stil (eckig, uppercase)
   ============================================ */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce .single_add_to_cart_button,
.woocommerce .checkout-button,
.woocommerce #place_order,
.woocommerce-cart .wc-proceed-to-checkout a {
    background-color: var(--g-gruen) !important;
    color: var(--g-weiss) !important;
    border: 2px solid var(--g-gruen) !important;
    border-radius: 0 !important;
    font-family: var(--g-font) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    padding: 10px 20px !important;
    transition: all 0.2s !important;
    cursor: pointer !important;
    text-decoration: none !important;
    display: inline-block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-top: 10px !important;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce .single_add_to_cart_button:hover,
.woocommerce #place_order:hover {
    background-color: var(--g-weiss) !important;
    color: var(--g-gruen) !important;
    border-color: var(--g-gruen) !important;
}

#place_order {
    font-size: 15px !important;
    padding: 14px 30px !important;
    font-weight: 700 !important;
}

/* ============================================
   EINZELPRODUKT
   ============================================ */
.single-product .product_title {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--g-gruen) !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    border-bottom: 1px solid var(--g-border) !important;
    padding-bottom: 15px !important;
    margin-bottom: 15px !important;
}

.single-product .price {
    color: var(--g-gruen) !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    margin-bottom: 20px !important;
    display: block !important;
}

/* ============================================
   FORMULARFELDER
   ============================================ */
.woocommerce form .input-text,
.woocommerce form input[type="text"],
.woocommerce form input[type="email"],
.woocommerce form input[type="tel"],
.woocommerce form input[type="number"],
.woocommerce form select,
.woocommerce form textarea {
    border: 1px solid #ccc !important;
    border-radius: 0 !important;
    padding: 10px 12px !important;
    font-size: 14px !important;
    transition: border-color 0.2s !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.woocommerce form .input-text:focus,
.woocommerce form input:focus,
.woocommerce form select:focus {
    border-color: var(--g-gruen) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(61,107,46,0.1) !important;
}

.woocommerce form label { font-weight: 600 !important; color: var(--g-text) !important; }

.woocommerce-checkout h3,
#order_review_heading {
    font-size: 18px !important;
    color: var(--g-gruen) !important;
    text-transform: uppercase !important;
    border-bottom: 1px solid var(--g-border) !important;
    padding-bottom: 10px !important;
    margin-bottom: 20px !important;
}

/* ============================================
   TABELLEN
   ============================================ */
.woocommerce table.shop_table {
    border: 1px solid var(--g-border) !important;
    border-radius: 0 !important;
    width: 100% !important;
}

.woocommerce table.shop_table thead { background-color: var(--g-gruen) !important; }
.woocommerce table.shop_table thead th {
    color: var(--g-weiss) !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    padding: 12px 15px !important;
    border: none !important;
}

.woocommerce table.shop_table tbody td { padding: 12px 15px !important; border-bottom: 1px solid var(--g-border) !important; }
.woocommerce table.shop_table tbody tr:nth-child(even) { background-color: var(--g-hellgrau) !important; }
.order-total .amount { color: var(--g-gruen) !important; font-weight: 700 !important; font-size: 20px !important; }

/* ============================================
   MELDUNGEN
   ============================================ */
.woocommerce-message { background: #edf5e9 !important; border-top: 3px solid var(--g-gruen) !important; color: var(--g-gruen-dunkel) !important; }
.woocommerce-error { border-top: 3px solid #cc0000 !important; }
.woocommerce-info { border-top: 3px solid var(--g-gruen) !important; }

/* ============================================
   FOOTER - Dunkelgrün mit 2 Spalten + Impressum
   Exakt wie gerhelm.de
   ============================================ */
.site-footer,
#colophon,
footer.site-footer {
    background-color: var(--g-gruen) !important;
    border-top: none !important;
    padding: 40px 0 0 0 !important;
}

/* Footer Inhalt weiß */
.site-footer *,
#colophon * {
    color: rgba(255,255,255,0.9) !important;
}

.site-footer a,
#colophon a {
    color: rgba(255,255,255,0.9) !important;
    text-decoration: none !important;
}

.site-footer a:hover,
#colophon a:hover {
    color: var(--g-weiss) !important;
    text-decoration: underline !important;
}

/* Widget Titel */
.site-footer .widget-title,
#colophon .widget-title {
    color: var(--g-weiss) !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    margin-bottom: 15px !important;
    padding-bottom: 0 !important;
    border: none !important;
}

/* Footer Widget Text */
.site-footer .widget p,
.site-footer .widget li,
#colophon .widget p,
#colophon .widget li {
    font-size: 14px !important;
    line-height: 1.8 !important;
    color: rgba(255,255,255,0.85) !important;
}

/* Impressum-Streifen - grauer Balken unten */
.site-footer .site-info,
#colophon .site-info,
.ast-footer-copyright {
    background-color: #e8e8e8 !important;
    padding: 12px 20px !important;
    margin-top: 30px !important;
    text-align: center !important;
    border-top: none !important;
}

.site-footer .site-info *,
#colophon .site-info *,
.ast-footer-copyright * {
    color: #555555 !important;
    font-size: 13px !important;
}

.site-footer .site-info a,
#colophon .site-info a,
.ast-footer-copyright a {
    color: #555555 !important;
    text-decoration: none !important;
    margin: 0 8px !important;
}

.site-footer .site-info a:hover,
.ast-footer-copyright a:hover {
    color: var(--g-gruen) !important;
    text-decoration: underline !important;
}

/* Astra Overrides */
:root {
    --ast-global-color-0: #3d6b2e;
    --ast-global-color-1: #2d5020;
}

.ast-sticky-active #masthead { background-color: var(--g-gruen) !important; box-shadow: 0 2px 10px rgba(0,0,0,0.2) !important; }
