/*
Theme Name:   EIO
Theme URI:    https://eiowaste.com
Description:  Child theme of Kadence for eiowaste.com. Holds only approved CSS exceptions; every rule here is logged in docs/custom-css-log.md with its reason. All PHP lives in the eio-core plugin.
Author:       EIO Waste & Recycling Solutions Inc.
Template:     kadence
Version:      1.0.0
Requires at least: 6.6
Requires PHP: 8.1
Text Domain:  eio-child
*/

/* ------------------------------------------------------------------------------------------
   Gravity Forms submit inside a purple form band (Row Layout with the Additional CSS Class "eio-form-band").
   The global button is palette1 purple, invisible on the palette1 band; the old site's submit was green.
   Colour only — everything else stays the Customizer button. Approved by the user 2026-09-16. Logged in
   docs/custom-css-log.md (#2).
   ------------------------------------------------------------------------------------------ */
.eio-form-band .gform_wrapper .gform_button { background: var(--global-palette2); color: var(--global-palette9); }
.eio-form-band .gform_wrapper .gform_button:hover,
.eio-form-band .gform_wrapper .gform_button:focus { background: var(--global-palette6); color: var(--global-palette9); }

/* ------------------------------------------------------------------------------------------
   Hover-reveal cards (the old site's "flip cards" for dumpster sizes). A Section with the Additional CSS Class
   "eio-flip-card" holds two Row Layouts: "eio-flip-front" (drawing, title, weight — at rest) and "eio-flip-back"
   (title, description, button — on hover or keyboard focus). The back is stacked over the front and the two
   cross-fade; the card's hover background colour is the Section's own hover setting, not CSS. Geometry and
   animation only. On devices without hover the back is shown stacked under the front so the button stays
   reachable. Approved by the user 2026-09-16. Logged in docs/custom-code-log.md (#3).
   ------------------------------------------------------------------------------------------ */
.eio-flip-card > .kt-inside-inner-col { position: relative; transition: background-color .35s ease; }
.eio-flip-card .eio-flip-front { transition: opacity .35s ease; }
.eio-flip-card .eio-flip-back { position: absolute; inset: 0; display: flex; align-items: center; opacity: 0; pointer-events: none; transition: opacity .35s ease; }
.eio-flip-card .eio-flip-back > .kt-row-column-wrap { width: 100%; }
.eio-flip-card:hover .eio-flip-front,
.eio-flip-card:focus-within .eio-flip-front { opacity: 0; }
.eio-flip-card:hover .eio-flip-back,
.eio-flip-card:focus-within .eio-flip-back { opacity: 1; pointer-events: auto; }
@media (hover: none) {
  .eio-flip-card .eio-flip-back { position: static; opacity: 1; pointer-events: auto; }
}