/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

/* Style details page */
#post-878 > div > div > div:nth-child(1), #post-878 > div > div > div:nth-child(7), #post-878 > div > div > div:nth-child(4) {display: none;}
#post-878 > div {padding: 0px;}

body {background-color: #fff;}

.entry-meta {display: none !important;}

#site-navigation > div 
{color: #fff;}


/* Hide on mobile (show on desktop) */
.desktop-only {
    display: block;
}
@media (max-width: 768px) {
    .desktop-only {
        display: none !important;
    }
}

/* Hide on desktop (show on mobile) */
.mobile-only {
    display: none;
}
@media (max-width: 768px) {
    .mobile-only {
        display: block !important;
    }
}


#mobile-header {background-color: #fff !important;}

#text-34 > div {padding-right: 250px;}

#post-2120 > div > div > div:nth-child(1) {display: none;}

#post-2120 > div > div > div:nth-child(7) {display: none;}

#post-2120 > div > div > div:nth-child(3) {display: none;}

/* Adjust site name in nav bar */ 

@media only screen and (min-width: 900px) { #site-navigation > div > div.navigation-branding > p > a {padding-left: 120px; font-size: 0.8em !important;} }

@media only screen and (max-width: 899px) { #site-navigation > div > div.navigation-branding > p > a {display: none !important;} }


/* Style left hand filters */ 
#wdt-filter-widget > h2.widget-title  {font-size: 1.2em; text-align: left !important; padding-left: 15px; font-weight}

/* Style GF button beta tester #15 */ 
#gform_submit_button_15 {background-color: #6abb7d;
border: none; color: white; padding: 14px 24px; text-align: center; text-decoration: none; font-size: 18px; border-radius: 6px; cursor: pointer; margin: 0px;}

 /* Style demo pages */ 
#tve_editor > div.thrv_wrapper.thrv_custom_html_shortcode > div.thrv_wrapper.thrv-columns > div {padding: 0px 40px;}
#post-569 > div,
#post-662 > div,
#post-664 > div, 
#post-719 > div, 
#post-1581 > div, 
#post-1582 > div, 
#post-1583 > div
{padding: 0px;}

/* STYLING OF DATATABLE */

/* Optional hover effect for better readability */
#table_1 > thead > tr > th:hover {
    background-color: #f4f4f4; /* Light background on hover */
}

.wpDataTableFilterSection, .wdt-checkbox-label, .dt-buttons, .dataTables_length {font-size: 0.7em;}

.wdt-clear-filters-button {
    margin-top: 0px !important;
}

#table_1_info {
    text-align: center;      /* Center-align text */
    font-size: 0.7em !important;
    padding-bottom: 10px !important;
}

#table_1_paginate {
    margin-top: 20px; /* Adds 20px margin at the top */
}

/* Apply styling to all filter sections */
.wpDataTableFilterSection {
    display: flex;              /* Align inline */
    align-items: flex-start;    /* Align items at the top */
    min-height: 0 !important;   /* Remove any default min-height */
    padding: 0px 10px !important;      /* Remove padding */
    margin: 0px !important;       /* Remove margin */
}

/* Target all labels inside filter sections */
.wpDataTableFilterSection label {
    line-height: 1 !important;  /* Set consistent line height */
    margin: -10px 0px !important;       /* Remove margins */
    padding: 0px 10px !important;      /* Remove padding */
}

/* Target filter buttons */
.wdt-checkbox-filter.btn {
    min-height: 0 !important;   /* Remove min-height */
    line-height: 1 !important;  /* Consistent line height */
    padding: 0px 10px !important;      /* Remove padding */
    margin: -10px 0px !important;       /* Remove margin */
}

/* Target checkbox modal containers */
.wdt-checkbox-modal-wrap {
    min-height: 0 !important;   /* Remove height constraints */
    padding: 0px 10px !important;      /* Remove padding */
    margin: -10px 0px !important;       /* Remove margin */
}

/* Target individual checkbox options */
.wdt_checkbox_option.checkbox {
    line-height: 1 !important;  /* Reduce spacing between options */
    margin: -10px 0px !important;       /* Remove margin */
    padding: 0px 10px !important;      /* Remove padding */
}

/* Target checkbox labels */
.wdt-checkbox-label {
    line-height: 1 !important;  /* Tighten label spacing */
    margin: -10px 0px !important;       /* Remove margins */
    padding: 0px 10px !important;      /* Remove paddings */
}

/* Adjust padding for individual checkbox options */
.wdt_checkbox_option.checkbox {
    padding: 20px 0px !important;
}

/* Align "Clear Filters" and "Print/Copy/PDF" on the same line */
#wdt-clear-filters-button-block {
    display: inline-block;          /* Makes it behave like an inline element */
    vertical-align: middle;         /* Aligns it vertically with the buttons */
    margin-right: 10px !important;  /* Adds space between this and the next element */
}

/* Ensure the Print/Copy/PDF buttons are also inline */
.dt-buttons {
    display: inline-block !important; /* Inline-block for alignment */
    vertical-align: middle !important; /* Aligns vertically with "Clear Filters" */
}

/* Optional: Adjust padding and size for "Clear Filters" */
.wdt-clear-filters-button {
    padding: 8px 15px !important;      /* Padding for size */
    font-size: 12px !important;        /* Font size */
    background-color: #A3D8FF !important; /* Background color */
    border-radius: 5px !important;     /* Rounded corners */
    border: none !important;           /* Remove border */
    cursor: pointer !important;        /* Pointer cursor */
}

/* Hover effect for "Clear Filters" button */
.wdt-clear-filters-button:hover {
    background-color: #74B3E2 !important; /* Slightly darker blue on hover */
    color: white !important;             /* White text on hover */
}


/* Center set columns content in play */ 
.column-nr,
.column-props,
.column-step,
.column-exertion,
.column-status
{text-align: center !important;}

#table_1_wrapper { 
    padding: 0px;      /* Removes padding inside the table container */
}

#wdt-filter-widget > h2.widget-title { 
    text-align: center; /* Centers the filter widget's title */
}

@media only screen and (min-width: 769px) {
    #page { 
        max-width: 100%;         /* Allows the page container to span the full width of the viewport */
        padding: 0px;           /* Removes all padding inside the page container */
        margin: 0px 20px;      /* Adds 20px of space to the left of the page */
    }
}

/* Styling of bullet lists - applies site-wide */
ul {
    list-style: none !important; /* Removes default bullets */
    padding-left: 0 !important; /* Removes extra indentation */
    margin-left: 0 !important; /* Ensures alignment */
}

ul li {
    position: relative;
    padding-left: 40px !important; /* Creates space for the bullet */
    display: block;
}

ul li::before {
    content: "✅"; 
    position: absolute;
    left: 0px; /* Moves bullet all the way to the left */
    top: 16px; /* Aligns bullet to the top */
    line-height: 1; /* Prevents bullet from shifting */
}

/* Styling of modal */
#wdt-md-modal > div > div > div.modal-header > h4 {font-size: 0.7em !important; font-style: italic !important; font-weight: 400;}
#table_1_Name_detials {font-size: 2em !important; font-weight: bold;}
#table_1_id_detials {font-size: 0.7em !important; font-style: italic !important;}
#table_1_md_dialog > div > div:nth-child(17) {margin: 0px !important;}
#wdt-clear-filters-button-block > button {margin-top: 30px; background-color: #E1F1E5; font-size: 1.1em;}
@media only screen and (min-width: 768px){
.wpdt-c .col-sm-9 {width: 100% !important;}}
#wdt-md-modal > div > div > div.modal-header > button > span {font-size: 3em;}
#table_1_md_dialog > div > div:nth-child(4) {margin: 0px;}
#table_1_md_dialog > div > div:nth-child(18) > div {padding-top: 40px;}


#table_1_0_filter_sections > label, #table_1_1_filter_sections > label, #table_1_2_filter_sections > label, #table_1_3_filter_sections > label, #table_1_4_filter_sections > label, #table_1_5_filter_sections > label, #table_1_6_filter_sections > label, #table_1_7_filter_sections > label, #table_1_8_filter_sections > label, #table_1_9_filter_sections > label, #table_1_10_filter_sections > label, #table_1_11_filter_sections > label {display: none;}



/* Style top and bottom table pagination */
#table_1_info {font-size: 0.8em; padding: 0px 10px;}
#table_1_length > label {margin: 0px 20px; font-weight: 400; }
#table_1_filter > label {margin-left: 0px; padding: 10px; font-weight: 400; font-size: 0.8em;}

/* Styling title top left widget */ 
.title1
{display: block; clear:both;}
.title1 .date1 { float:right }
.title1 .name1 { float:left }

/* Style sidebar Logo */ 
#text-2, #text-5, #text-6, #text-13, #text-14, #text-16, #text-17, #text-18, #text-19, #text-24, #text-25, #text-27 {padding: 0px; margin-bottom:20px;}
#text-3 {padding: 20px 0px; margin-bottom:20px;}
#text-28, #text-29, #text-30, #text-31, #text-4, #text-32, #text-33  {padding: 40px 0px 0px 15px !important;}

#text-37 {margin: 0px; padding:0px;}
@media screen and (min-width: 600px) {div.link2filters {display: none;}}

/* Styling tutorial widget */ 
#shortcodes-ultimate-3, #shortcodes-ultimate-4 {padding: 0px; background-color: #f2f2f2; margin-bottom: 20px;}

/* Styling wpDT modal */ 
.modal-body .col-sm-3 {font-size: 20px !important;}
.modal-body .detailColumn {font-size: 20px !important; padding-left: 0px !important;}
.modal-dialog {width: 80% !important;}
.modal-body .col-sm-3 {display: none !important;}

/* Sitewide header menu */
.hcol1 {float: left; width: 36%; padding: 10px;}
.hcol2 {float: left; width: 64%; padding: 10px;}
.hrow:after {content: ""; display: table; clear: both;}

/* MOBILE LAYOUT */

/* Style mobile header */ 
#mobile-header {background-color: #F4F4F4; margin: 0px 20px; padding-right: 25px;}
#mobile-header > div > button > span.mobile-menu {display: none;}

/* Style GF in footer */
#gform_2 > div.gform_footer.top_label {display: none;}
.site-footer { padding: 0 40px;} 

/* Wrap summary text on mobile */
.wpDataTablesWrapper {
    width: 100% !important;
    max-width: 100% !important;
}
.wpDataTable th, 
.wpDataTable td {
    white-space: normal !important;
}

/* Dev Log Page Formatting */ 
#post-2171 > div {padding: 0px 40px 0px 0px;} 


/* Footer tooltip */ 
.tooltip-container {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

.tooltip-text {
  visibility: hidden;
  width: 180px;
  background-color: #A87C5F; /* Warm brown to complement your pastel tones */
  color: white;
  text-align: center;
  padding: 8px;
  border-radius: 5px;
  font-size: 14px;

  /* Positioning above */
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin-bottom: 8px; /* Space between text and element */

  /* Subtle shadow for better visibility */
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);

  /* Fade-in effect */
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

.tooltip-container:hover .tooltip-text {
  visibility: visible;
  opacity: 1;
}




/* General Button Styling */
.funhub-button {
    display: inline-block;
    background-color: #99CCFF; 
    color: white !important;
    padding: 10px 15px;
    text-align: center;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    margin: 5px;
    transition: background-color 0.3s ease-in-out;
    border: none;
    font-size: 0.9em;
}

/* Hover Effect */
.funhub-button:hover {
    background-color: #3E74C6; /* Darker blue for hover */
    color: white !important;
}

/* Center buttons and ensure they are visible on all devices */
.button-container {
    text-align: center;
    font-size: 0.9em;
    margin-bottom: 40px;
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.small-button {
    display: inline-block;
    background-color: #568ADD !important; 
    color: white !important;
    padding: 2px 6px; /* Smaller padding */
    font-size: 0.75em; /* Smaller text */
    border-radius: 3px; /* Slightly rounded corners */
    text-decoration: none;
    font-weight: 600;
    text-align: center;
    border: none;
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
    cursor: pointer;
    line-height: 1.2;
}

/* Hover Effect */
.small-button:hover {
    background-color: #3C6BB0 !important; /* Darker blue for contrast */
    color: white !important;
}

/* Ensure the button doesn't inherit unwanted styles */
.small-button:visited,
.small-button:active {
    background-color: #4A78C2 !important;
    color: white !important;
}

/* Optional: Add small spacing if multiple buttons appear together */
.small-button + .small-button {
    margin-left: 4px;
}