/*
Theme Name:   Kadence Child (HK SafeKids)
Theme URI:    https://hksafekids.hk
Description:  Child theme of Kadence for HK SafeKids. Lets the Kadence parent theme be updated safely without losing any custom CSS or theme-level code. Add custom CSS to the bottom of this file and any custom PHP to functions.php.
Author:       SiteDesignNow
Author URI:   https://sitedesignnow.com.au
Template:     kadence
Version:      1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain:  kadence-child
*/

/* ==========================================================================
   Custom CSS for HK SafeKids.
   Migrated from Customizer > Additional CSS into the child theme on 2026-06-08
   so it survives Kadence theme updates and is version-controlled here.
   Future tweaks can go here or in Customizer > Additional CSS (both survive now).
   ========================================================================== */

/* =====================================================================
   HK SafeKids - Core Custom Styles
   Version: 2.0 (with Stripe card field background fix)
   =====================================================================
   PURPOSE:
     - Style recipient cards, badges, and form elements for parent/helper dashboards.
     - Ensure dropdowns and nested entry tables are readable.
     - Force white background and dark text on Stripe card input fields inside
       Conversational Forms (using Gravity Forms Theme Framework custom properties).
   ===================================================================== */

/* =====================================================================
   SECTION 1: Care Recipients Cards & Badges
   ===================================================================== */

/* Your custom component styles - keep if used */
.care-recipients {
    margin: 20px 0;
    font-family: 'Manrope', sans-serif;
}

.recipient-card {
    background: #ffffff;
    border-left: 4px solid #F9B6A9;
    padding: 12px 18px;
    margin-bottom: 12px;
    border-radius: 0 12px 12px 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    transition: all 0.2s ease;
}

.recipient-card:hover {
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    border-left-color: #A7D8F0;
}

.recipient-card a {
    color: #1E3A8A;
    text-decoration: none;
    font-weight: 600;
}

.recipient-card a:hover {
    color: #F9B6A9;
}

.allergy-badge, .care-badge, .medical-badge {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 20px;
    margin-left: 10px;
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.allergy-badge {
    background: #F9B6A9;
    color: #0F172A;
}

.care-badge {
    background: #A7D8F0;
    color: #0F172A;
}

.medical-badge {
    background: #1E3A8A;
    color: #ffffff;
}

.care-recipients h3 {
    color: #1E3A8A;
    font-size: 1.25rem;
    margin: 1.5rem 0 0.75rem;
    font-weight: 600;
    letter-spacing: -0.02em;
}

/* =====================================================================
   SECTION 2: Form Inputs - Dark Text on Light Background
   ===================================================================== */

/* Base form input text color */
.gform_wrapper input,
.gform_wrapper textarea,
.gform_wrapper select {
    color: #000000 !important;
}

/* Dropdown fix - white background always */
.gform-conversational select,
.gform-conversational select:focus,
.gform-conversational select:active,
.gform-conversational select option,
.gform-conversational select option:checked,
.gform-conversational select option:hover,
.gform-conversational .gfield_select .ginput_container select {
    background-color: #ffffff !important;
    color: #0F172A !important;
    border: 1px solid #ccc !important;
    padding: 8px;
    border-radius: 8px;
}

/* =====================================================================
   SECTION 3: Nested Entries Tables (GP Nested Forms)
   ===================================================================== */

/* Nested entries table cells - transparent background, white text */
.gform-conversational .gpnf-field,
.gform-conversational .gpnf-row-view table td,
.gform-conversational .gpnf-nested-entries td {
    background-color: transparent !important; /* let form background show */
    color: #ffffff !important; /* white text for readability */
    border-bottom: 1px solid rgba(255,255,255,0.2); /* subtle separator */
}

/* Table headers - if needed */
.gform-conversational .gpnf-nested-entries th {
    background-color: rgba(0,0,0,0.3) !important; /* semi-transparent dark */
    color: #ffffff !important;
    padding: 8px;
    text-align: left;
    border-bottom: 2px solid #F9B6A9; /* pink underline */
}

/* Edit button - pink */
.gform-conversational .gpnf-edit,
.gform-conversational .gpnf-edit-entry,
.gform-conversational button.gpnf-edit,
.gform-conversational a.gpnf-edit {
    background-color: #F9B6A9 !important;
    color: #0F172A !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 4px 12px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    transition: opacity 0.2s;
}

.gform-conversational .gpnf-edit:hover {
    opacity: 0.8;
}

/* Optional: style the whole table container */
.gform-conversational .gpnf-nested-entries {
    background-color: transparent;
    border-collapse: collapse;
    width: 100%;
}

/* Optional: Adjust background color */
.gform_wrapper .gform_footer input[type="submit"],
.gform_wrapper .gform_page_footer input[type="submit"] {
    background-color: #1e3a8a !important; /* Example: A darker blue */
    color: #ffffff !important;
}

/* Fix vertical tooltip text on LearnDash achievement badges */
.ld-achievement-info,
.ld-achievement-tooltip,
.learndash-achievement .tooltip,
.learndash-achievement .tooltiptext {
    white-space: nowrap !important;
    width: auto !important;
    min-width: 150px !important;
    text-align: center !important;
    word-break: keep-all !important;
}
