/* De inhoud van de overige pagina's (info, winkelmand, afrekenen, mijn account, niet gevonden) in de stijl
   van de home. De kop en voet staan in categorie.css; de inhoud zelf blijft van Kadence, WooCommerce en
   Elementor. Alles hangt aan body.tts-pagina, die paginas.php zet. */

/* Kleuren en letters van Kadence omzetten: de meeste onderdelen van het thema, WooCommerce en Elementor
   lezen deze variabelen. */
body.tts-pagina{--navy:#102638;--orange:#f79649;--cream:#f8f5f0;--muted:#536171;--line:#e5e7eb;--accent:#a94a08;
--global-palette1:#a94a08;--global-palette2:#102638;--global-palette3:#102638;--global-palette4:#102638;--global-palette5:#536171;--global-palette6:#536171;--global-palette7:#f8f5f0;--global-palette8:#fff;--global-palette9:#fff;
--global-palette-highlight:#a94a08;--global-palette-highlight-alt:#102638;--global-palette-highlight-alt2:#fff;
--global-palette-btn-bg:#f79649;--global-palette-btn-bg-hover:#ffab69;--global-palette-btn:#102638;--global-palette-btn-hover:#102638;
--global-body-font-family:TTSInter,Arial,sans-serif;--global-heading-font-family:TTSArchivo,Arial,sans-serif;
background:#fff;color:var(--navy);font-family:TTSInter,Arial,sans-serif;font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
body.tts-pagina #wrapper,body.tts-pagina #inner-wrap,body.tts-pagina .content-bg,body.tts-pagina .entry.single-entry{background:#fff;box-shadow:none;border-radius:0}

/* Breedte: dezelfde marges als de kop, de lopende tekst niet breder dan prettig leest. */
body.tts-pagina .content-container.site-container{width:min(1280px,calc(100% - 96px));max-width:none;margin-inline:auto;padding-inline:0}
body.tts-pagina .content-area{margin-top:56px;margin-bottom:88px}
body.tts-pagina .entry-content-wrap{padding:0}
body.tts-pagina:not(.elementor-page):not(.woocommerce-page) .content-wrap{max-width:820px}

/* Koppen en tekst */
body.tts-pagina #inner-wrap :is(h1,h2,h3,h4,h5,h6){font-family:TTSArchivo,Arial,sans-serif;color:var(--navy);font-weight:750;line-height:1.15;letter-spacing:-.035em;text-transform:none}
body.tts-pagina #inner-wrap h1{font-size:clamp(34px,4.2vw,52px);letter-spacing:-.045em;line-height:1.08;margin:0 0 28px}
body.tts-pagina #inner-wrap h2{font-size:clamp(24px,2.4vw,30px);margin:44px 0 14px}
body.tts-pagina #inner-wrap h3{font-size:20px;margin:32px 0 10px}
body.tts-pagina #inner-wrap h4{font-size:17px;margin:26px 0 8px;letter-spacing:-.02em}
body.tts-pagina #inner-wrap .entry-header{margin:0;padding:0}
body.tts-pagina #inner-wrap :is(p,li,td,th,dd,dt,label,address){font-family:TTSInter,Arial,sans-serif;color:var(--navy)}
body.tts-pagina #inner-wrap .entry-content :is(p,ul,ol){margin:0 0 18px}
body.tts-pagina #inner-wrap .entry-content :is(ul,ol){padding-left:22px}
body.tts-pagina #inner-wrap .entry-content li{margin-bottom:8px}
body.tts-pagina #inner-wrap .entry-content li::marker{color:var(--accent);font-weight:600}
body.tts-pagina #inner-wrap a:not(.button):not(.elementor-button):not(.wc-block-components-button):not(.wp-block-button__link){color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
body.tts-pagina #inner-wrap a:not(.button):not(.elementor-button):not(.wc-block-components-button):not(.wp-block-button__link):hover{color:var(--navy)}
body.tts-pagina #inner-wrap :focus-visible{outline:3px solid var(--accent);outline-offset:3px}
body.tts-pagina #inner-wrap hr{border:0;border-top:1px solid var(--line);margin:36px 0}
body.tts-pagina #inner-wrap table{border-collapse:collapse;width:100%;font-size:15px}
body.tts-pagina #inner-wrap :is(th,td){border:0;border-bottom:1px solid var(--line);padding:12px 14px 12px 0;text-align:left;vertical-align:top}
body.tts-pagina #inner-wrap th{font-weight:600}

/* Knoppen: oranje met donkerblauwe tekst, zoals op de home. */
body.tts-pagina #inner-wrap :is(.button,button[type=submit],input[type=submit],.elementor-button,.wp-block-button__link,.wc-block-components-button:not(.is-link),.checkout-button){display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:13px 23px;background:var(--orange);border:0;border-radius:6px;color:var(--navy);font-family:TTSInter,Arial,sans-serif;font-size:15px;font-weight:600;line-height:1.3;letter-spacing:normal;text-transform:none;text-decoration:none;box-shadow:none;cursor:pointer;transition:background .15s}
body.tts-pagina #inner-wrap :is(.button,button[type=submit],input[type=submit],.elementor-button,.wp-block-button__link,.wc-block-components-button:not(.is-link),.checkout-button):hover{background:#ffab69;color:var(--navy)}
body.tts-pagina #inner-wrap :is(.button,button[type=submit])[disabled],body.tts-pagina #inner-wrap .button.disabled{opacity:.5;cursor:not-allowed}

/* Formulieren */
body.tts-pagina #inner-wrap :is(input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],input[type=search],textarea,select){font-family:TTSInter,Arial,sans-serif;font-size:16px;color:var(--navy);background:#fff;border:1px solid #cfd4da;border-radius:6px;padding:11px 14px;box-shadow:none;min-height:48px}
body.tts-pagina #inner-wrap :is(input,textarea,select):focus{border-color:var(--navy);outline:2px solid var(--navy);outline-offset:1px}
body.tts-pagina #inner-wrap label{font-size:14px;font-weight:600}

/* Het zoekvak van Kadence (niet gevonden): de knop is een vergrootglas over het veld, geen oranje knop. */
body.tts-pagina #inner-wrap .search-form{position:relative;max-width:560px}
body.tts-pagina #inner-wrap .search-form .search-submit{position:absolute;top:0;right:0;bottom:0;width:50px;min-height:0;padding:0;background:transparent;color:transparent;border:0;border-radius:0;overflow:hidden;z-index:2}
body.tts-pagina #inner-wrap .search-form .search-submit:hover{background:transparent;color:transparent}

/* Pagina's uit Elementor (Legservice, Over ons, Contact): even breed als de kop, zonder de lege
   tussenruimtes van toen, en de lopende tekst niet breder dan prettig leest. */
body.tts-pagina .elementor-section.elementor-section-boxed>.elementor-container{max-width:none}
body.tts-pagina .elementor-top-section>.elementor-container>.elementor-column>.elementor-widget-wrap{padding-inline:0}
body.tts-pagina .entry-content .elementor-widget-spacer{display:none}
body.tts-pagina .entry-content .elementor-top-section:has(.elementor-widget:not(.elementor-widget-spacer))+.elementor-top-section{margin-top:28px}
body.tts-pagina .elementor-widget-text-editor{max-width:820px;font-family:TTSInter,Arial,sans-serif;color:var(--navy)}
body.tts-pagina .elementor-heading-title{font-family:TTSArchivo,Arial,sans-serif;color:var(--navy)}

/* Winkelmand: de melding dat hij leeg is, rustig. */
body.tts-pagina #inner-wrap :is(.cart-empty,.wc-empty-cart-message){font-size:20px;color:var(--navy)}

/* Productpagina: de naam iets kleiner dan een paginatitel, de tabjes als tabjes en niet als links. */
body.tts-pagina.single-product #inner-wrap h1.product_title{font-size:clamp(28px,3vw,40px);margin:0 0 18px}
body.tts-pagina.single-product #inner-wrap .woocommerce-tabs ul.tabs li a{color:var(--muted);text-decoration:none;font-weight:600}
body.tts-pagina.single-product #inner-wrap .woocommerce-tabs ul.tabs li.active a{color:var(--navy)}
body.tts-pagina.single-product #inner-wrap .woocommerce-breadcrumb{font-size:14px;color:var(--muted);margin-bottom:8px}
body.tts-pagina.single-product #inner-wrap .price{font-size:22px;font-weight:600;color:var(--navy)}

/* Telefoon */
@media (max-width:767px){
body.tts-pagina .content-container.site-container{width:calc(100% - 40px)}
body.tts-pagina .content-area{margin-top:36px;margin-bottom:60px}
}