/*
 Theme Name:   Hello-Elementor Praxis Jukimed Child
 Theme URI:    http://example.com/twenty-fifteen-child/
 Description:  Twenty Fifteen Child Theme
 Author:       Jens Kouros
 Author URI:   http://example.com
 Template:     hello-elementor
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  hello-elementor-praxis-jukimed-child
*/
/* ibm-plex-sans-regular - latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/ibm-plex-sans-v14-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/ibm-plex-sans-v14-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/ibm-plex-sans-v14-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/ibm-plex-sans-v14-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/ibm-plex-sans-v14-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/ibm-plex-sans-v14-latin-regular.svg#IBMPlexSans') format('svg'); /* Legacy iOS */
}

/* ibm-plex-sans-italic - latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/ibm-plex-sans-v14-latin-italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/ibm-plex-sans-v14-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/ibm-plex-sans-v14-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/ibm-plex-sans-v14-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/ibm-plex-sans-v14-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/ibm-plex-sans-v14-latin-italic.svg#IBMPlexSans') format('svg'); /* Legacy iOS */
}

/* ibm-plex-sans-500 - latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/ibm-plex-sans-v14-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/ibm-plex-sans-v14-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/ibm-plex-sans-v14-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/ibm-plex-sans-v14-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/ibm-plex-sans-v14-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/ibm-plex-sans-v14-latin-500.svg#IBMPlexSans') format('svg'); /* Legacy iOS */
}

/* ibm-plex-sans-500italic - latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/ibm-plex-sans-v14-latin-500italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/ibm-plex-sans-v14-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/ibm-plex-sans-v14-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/ibm-plex-sans-v14-latin-500italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/ibm-plex-sans-v14-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/ibm-plex-sans-v14-latin-500italic.svg#IBMPlexSans') format('svg'); /* Legacy iOS */
}

/* ==========================================================================
   Accessibility Color Contrast Fixes
   Override Hello Elementor's default link color for WCAG 2.1 AA compliance
   ========================================================================== */

/* Override default link color (#cc3366) for better contrast on light backgrounds */
/* Using !important to ensure override of Hello Elementor's reset.css */
body a,
.elementor a,
.elementor-widget-container a,
.elementor-widget-container p a {
    color: #2F4551 !important; /* Dark teal - 7.3:1 contrast on #CEE4E4 background */
}

body a:hover,
body a:active,
.elementor a:hover,
.elementor a:active {
    color: #1d4354 !important; /* Darker on hover for visual feedback */
}

/* Fix specific text widget (ac0a332) color contrast */
.elementor-element-ac0a332 .elementor-widget-container,
.elementor-element-ac0a332 .elementor-widget-container p {
    color: #2F4551 !important; /* Override inline #3F8DAE */
}

/* Ensure responsive menu phone link has proper contrast */
span[role="link"] {
    color: #2F4551 !important;
}

/* Restore pill-button styling for CTA links in the Responsive Menu additional content.
   Production may render these anchors without inline styles, so keep the styling in
   the child theme where it is not dependent on the plugin option HTML. */
#rmp-menu-additional-content-1155 a[href] {
    display: inline-block;
    font-family: 'IBM Plex Sans', sans-serif !important;
    font-weight: 500 !important;
    color: #333333 !important;
    background: #ffffff !important;
    padding: 9px 20px !important;
    border-radius: 100px !important;
    text-decoration: none !important;
}

#rmp-menu-additional-content-1155 a[href]:hover,
#rmp-menu-additional-content-1155 a[href]:focus {
    color: #333333 !important;
    background: #ffffff !important;
    text-decoration: underline !important;
}

/* Specific fix for email link in contact section */
.elementor-element-332edbfa a[href^="mailto:"] {
    color: #2F4551 !important;
}

/* ==========================================================================
   Accessible Service Cards Section
   Pure CSS expand/collapse using :has() selector
   ========================================================================== */

/* CSS Custom Properties for Service Cards */
:root {
    --jukimed-primary-teal: #31bde0;
    --jukimed-dark-teal: #1d4354;
    --jukimed-white: #ffffff;
    --jukimed-text: #333333;
    --jukimed-text-light: #666666;
    --jukimed-card-radius: 8px;
    --jukimed-transition: 350ms ease-out;
    --jukimed-max-width: 1200px;
}

/* Visually Hidden - for screen readers only */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Services Section Container */
.jukimed-services {
    max-width: var(--jukimed-max-width);
    margin: 0 auto;
    padding: 40px 20px;
    font-family: 'IBM Plex Sans', sans-serif;
}

/* Hidden Toggle Checkbox */
.services-toggle-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

/* Services Grid Rows - NO gap between rows */
.services-row {
    display: grid;
    gap: 0;
}

.services-row--4 {
    grid-template-columns: repeat(4, 1fr);
}

.services-row--3 {
    grid-template-columns: repeat(3, 1fr);
}

/* Service Card - no border-radius, no shadow, no margins for seamless layout */
.service-card {
    background: var(--jukimed-white);
    overflow: hidden;
}

/* Service Card Trigger (Label) */
.service-card__trigger {
    display: block;
    cursor: pointer;
    position: relative;
}

.service-card__trigger:focus-visible {
    outline: 3px solid var(--jukimed-primary-teal);
    outline-offset: -3px;
}

/* Service Card Image */
.service-card__image {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
    transition: transform var(--jukimed-transition);
}

.service-card__trigger:hover .service-card__image {
    transform: scale(1.02);
}

/* Service Card Title - overlay on image */
.service-card__title {
    margin: 0;
    padding: 16px;
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--jukimed-dark-teal);
    text-align: center;
    background: var(--jukimed-white);
}

/* Service Card Content (Expandable) - collapsed by default */
.service-card__content {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows var(--jukimed-transition);
}

.service-card__content-inner {
    overflow: hidden;
}

.service-card__description {
    margin: 0;
    padding: 0 16px 16px;
    font-size: 0.95rem;
    line-height: 1.7;
    color: var(--jukimed-text-light);
}

/* Expanded State - when checkbox is checked, ALL cards expand */
.jukimed-services:has(.services-toggle-input:checked) .service-card__content {
    grid-template-rows: 1fr;
}

/* Toggle Button */
.services-toggle-button {
    display: flex;
    justify-content: center;
    margin-top: 24px;
}

.services-toggle-button label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: var(--jukimed-primary-teal);
    color: var(--jukimed-white);
    border-radius: 25px;
    cursor: pointer;
    font-weight: 500;
    transition: background-color var(--jukimed-transition);
}

.services-toggle-button label:hover {
    background: var(--jukimed-dark-teal);
}

.services-toggle-button label:focus-visible {
    outline: 3px solid var(--jukimed-dark-teal);
    outline-offset: 2px;
}

/* Toggle button text - show/hide based on checkbox state */
.toggle-text-expand {
    display: inline;
}

.toggle-text-collapse {
    display: none;
}

.jukimed-services:has(.services-toggle-input:checked) .toggle-text-expand {
    display: none;
}

.jukimed-services:has(.services-toggle-input:checked) .toggle-text-collapse {
    display: inline;
}

/* Toggle icon (plus/minus) */
.toggle-icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    position: relative;
    transition: transform var(--jukimed-transition);
}

.toggle-icon::before,
.toggle-icon::after {
    content: '';
    position: absolute;
    background: currentColor;
}

.toggle-icon::before {
    width: 16px;
    height: 2px;
    top: 7px;
    left: 0;
}

.toggle-icon::after {
    width: 2px;
    height: 16px;
    left: 7px;
    top: 0;
    transition: transform var(--jukimed-transition);
}

.jukimed-services:has(.services-toggle-input:checked) .toggle-icon::after {
    transform: scaleY(0);
}

/* Responsive: Tablet */
@media (max-width: 1024px) {
    .services-row--4,
    .services-row--3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Responsive: Mobile */
@media (max-width: 767px) {
    .services-row--4,
    .services-row--3 {
        grid-template-columns: 1fr;
    }

    .service-card__image {
        height: 180px;
    }

    .service-card__title {
        font-size: 1rem;
        padding: 12px;
    }

    .service-card__description {
        padding: 0 12px 12px;
        font-size: 0.9rem;
    }
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .service-card,
    .service-card__image,
    .service-card__content,
    .toggle-icon,
    .toggle-icon::after,
    .services-toggle-button label {
        transition-duration: 0.01ms !important;
    }
}

/* Fallback for browsers without :has() support - show content expanded */
@supports not selector(:has(*)) {
    .service-card__content {
        grid-template-rows: 1fr;
    }

    .services-toggle-button {
        display: none;
    }
}

/* ==========================================================================
   Accessibility Fix: List Item Spacing
   Replaces invalid <br> tags inside <ul> elements with CSS margins
   ========================================================================== */

.defaultList li {
    margin-bottom: 0.75em;
}

.defaultList li:last-child {
    margin-bottom: 0;
}

/* ==========================================================================
   JukiMed global navigation
   Reproduces the former Responsive Menu appearance without the plugin.
   ========================================================================== */

.jukimed-navigation,
.jukimed-navigation *,
.jukimed-navigation *::before,
.jukimed-navigation *::after {
    box-sizing: border-box;
}

.jukimed-navigation {
    position: relative;
    z-index: 999998;
    font-family: 'IBM Plex Sans', sans-serif;
}

.jukimed-navigation__toggle {
    position: fixed;
    z-index: 2;
    top: 32px;
    right: 7%;
    width: 50px;
    height: 50px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    appearance: none;
    border: 0 !important;
    border-radius: 51px;
    color: #185fa5;
    background: rgba(255, 255, 255, 0.4) !important;
    box-shadow: none !important;
    cursor: pointer;
    transition: background-color 0.25s ease;
}

.jukimed-navigation__toggle:hover,
.jukimed-navigation__toggle:focus-visible {
    color: #ffffff;
    background: rgba(30, 115, 190, 0.59) !important;
}

.jukimed-navigation__toggle:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: 3px;
    box-shadow: 0 0 0 5px #185fa5;
}

.jukimed-navigation__toggle-icon,
.jukimed-navigation__toggle-icon::before,
.jukimed-navigation__toggle-icon::after {
    position: absolute;
    left: 50%;
    display: block;
    width: 25px;
    height: 3px;
    border-radius: 4px;
    background: #185fa5;
    transform: translateX(-50%);
    transition: transform 0.25s ease, top 0.25s ease, bottom 0.25s ease, opacity 0.2s ease, background-color 0.2s ease;
}

.jukimed-navigation__toggle-icon {
    top: 24px;
}

.jukimed-navigation__toggle-icon::before,
.jukimed-navigation__toggle-icon::after {
    content: '';
}

.jukimed-navigation__toggle-icon::before {
    top: -10px;
}

.jukimed-navigation__toggle-icon::after {
    bottom: -10px;
}

.jukimed-navigation.is-open .jukimed-navigation__toggle {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.28) !important;
}

.jukimed-navigation.is-open .jukimed-navigation__toggle-icon,
.jukimed-navigation.is-open .jukimed-navigation__toggle-icon::before,
.jukimed-navigation.is-open .jukimed-navigation__toggle-icon::after,
.jukimed-navigation__toggle:hover .jukimed-navigation__toggle-icon,
.jukimed-navigation__toggle:hover .jukimed-navigation__toggle-icon::before,
.jukimed-navigation__toggle:hover .jukimed-navigation__toggle-icon::after {
    background: #ffffff;
}

.jukimed-navigation.is-open .jukimed-navigation__toggle-icon {
    transform: translateX(-50%) rotate(45deg);
}

.jukimed-navigation.is-open .jukimed-navigation__toggle-icon::before {
    top: 0;
    opacity: 0;
}

.jukimed-navigation.is-open .jukimed-navigation__toggle-icon::after {
    bottom: 0;
    transform: translateX(-50%) rotate(-90deg);
}

.jukimed-navigation__backdrop {
    position: fixed;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    visibility: hidden;
    border: 0;
    color: transparent;
    background: rgba(18, 45, 59, 0.45) !important;
    box-shadow: none !important;
    opacity: 0;
    cursor: default;
    transition: opacity 0.5s ease, visibility 0s linear 0.5s;
}

.jukimed-navigation__backdrop:hover,
.jukimed-navigation__backdrop:focus,
.jukimed-navigation__backdrop:active {
    color: transparent;
    background: rgba(18, 45, 59, 0.45) !important;
    box-shadow: none !important;
    outline: 0;
}

.jukimed-navigation__drawer {
    position: fixed;
    z-index: 1;
    top: 0;
    right: 0;
    width: min(100%, 500px);
    height: 100%;
    height: 100dvh;
    padding: 112px 10% 36px;
    overflow-y: auto;
    visibility: hidden;
    color: #ffffff;
    background: linear-gradient(to bottom, #28659e 0%, #0875a2 48%, #087e9e 100%);
    transform: translateX(100%);
    transition: transform 0.5s ease, visibility 0s linear 0.5s;
    scrollbar-width: none;
}

.jukimed-navigation__drawer::-webkit-scrollbar {
    width: 0;
}

.jukimed-navigation.is-open .jukimed-navigation__backdrop,
.jukimed-navigation.is-open .jukimed-navigation__drawer {
    visibility: visible;
    transition-delay: 0s;
}

.jukimed-navigation.is-open .jukimed-navigation__backdrop {
    opacity: 1;
}

.jukimed-navigation.is-open .jukimed-navigation__drawer {
    transform: translateX(0);
}

body.jukimed-navigation-open {
    overflow: hidden;
}

.jukimed-navigation__list,
.jukimed-navigation__list .sub-menu {
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.jukimed-navigation__list .sub-menu {
    padding-left: 10%;
}

.jukimed-navigation__list a {
    display: flex;
    min-height: 44px;
    align-items: center;
    padding: 2px 5%;
    color: #ffffff !important;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.35;
    text-decoration: none;
    border-radius: 4px;
}

.jukimed-navigation__list .sub-menu a {
    font-size: 16px;
}

.jukimed-navigation__list a:hover,
.jukimed-navigation__list a:focus-visible,
.jukimed-navigation__list .current-menu-item > a,
.jukimed-navigation__list .current_page_item > a {
    color: #ffffff !important;
    background: rgba(0, 42, 68, 0.28);
}

.jukimed-navigation__list a:focus-visible,
.jukimed-navigation__actions a:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: 2px;
}

.jukimed-navigation__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 48px;
    padding: 0 5%;
}

.jukimed-navigation__actions a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    padding: 9px 20px;
    border-radius: 100px;
    color: #185fa5 !important;
    background: #ffffff;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.35;
    text-decoration: none;
}

.jukimed-navigation__actions a:hover {
    color: #185fa5 !important;
    text-decoration: underline;
}

@media (max-width: 600px) {
    .admin-bar .jukimed-navigation__toggle {
        top: 46px;
    }

    .jukimed-navigation__drawer {
        padding-right: 7%;
        padding-left: 7%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .jukimed-navigation__toggle,
    .jukimed-navigation__toggle-icon,
    .jukimed-navigation__toggle-icon::before,
    .jukimed-navigation__toggle-icon::after,
    .jukimed-navigation__backdrop,
    .jukimed-navigation__drawer {
        transition-duration: 0.01ms !important;
    }
}