/**
Theme Name: HelpLink Theme
Author: Maximillion Digital
Author URI: https://maximilliondigital.com
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: helplink-theme
Template: twentytwentyone
*/

/*profile page*/
/* Garet Font Family - Regular */
@font-face {
  font-family: 'Garet';
  src: url('fonts/helplink/helplink-garet-regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

/* Garet Medium */
@font-face {
  font-family: 'Garet';
  src: url('fonts/helplink/helplink-garet-medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
}


/* Garet Bold */
@font-face {
  font-family: 'Garet';
  src: url('fonts/helplink/helplink-garet-bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}


/* Garet Book */
@font-face {
  font-family: 'Garet';
  src: url('fonts/helplink/helplink-garet-book.otf') format('opentype');
  font-weight: 350;
  font-style: normal;
}


/* Garet Heavy */
@font-face {
  font-family: 'Garet';
  src: url('fonts/helplink/helplink-garet-heavy.ttf') format('truetype');
  font-weight: 850;
  font-style: normal;
}
a.navbar-brand.center-align {
   color:#D2D2DB !important;
}
/*Desktop styles*/
@media only screen and (min-width: 600px) {

img.h_l_banner {
    max-width: 40%;
    padding: 20px 0px;
}
.page-footer .logo img {
    width: 30%;
}
.primg {
    max-width: 20%;
    height: auto !important;
}

.ui-profile {  display: flex
;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding-block: 30px;
        flex-wrap: wrap;
    }

.prinfo.card-panel {
    background: transparent;
    top: 60px;
    box-shadow: none;
}

.ui-profile .prname .name {
    color: #d4d4d4;
    text-align: left;
    margin: 0 10px;
}

.ui-profile .profile-btn {
    display: flex;
}

.ui-profile .profile-btn .helplink_btn_alt {
    margin: 0 10px;
}

.gamipress-badges {
    justify-content: flex-start;
}

.ui-profile .prinfo .count {
    background: #FFFFFF;
        margin: 0.5% 1% 1.5% 1%;
        width: 31% !important;
        min-height: 110px !important;
        border-radius: 5px;
        padding-top: 20px;
}
 .container {
        width: 90%;
    }


.page-footer .logo img {
    width: 24%;
    height: auto;
}
.um-groups-directory {
    display: flex
;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: space-around;
    justify-content: space-around;
    align-items: stretch;
}
}
.about-logo,.feed-header {
    display: flex
;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
}
/*end of responsive */
.um-account-main div.um-account-heading{
    color: #D2D2DB !important;
}
.um-account-side li a.current span.um-account-icon, .um-account-side li a.current:hover span.um-account-icon{
    color: #215076 !important;
}
.um.um-account.um-editing.um-um_account_id {
    margin-top: 30px;
}
/* Header Background & General Styling */
.navbar {
    background-color: #343a40; /* Dark background */
    padding: 15px 0;
}
.um-member-metaline > strong {
    display: none !important;
}
.navbar-brand {
       color: #215076; /* Logo color */
       font-family: 'Garet', sans-serif;
    font-size: 1.5rem;
     font-weight: 500;
    width: 80%;
    display: inline-flex;
    margin: auto;
    align-content: center;
    justify-content: center;
    align-items: center;
    height: 65px;
    font-size: 44px;
    margin-top: px;

}

.navbar-brand:hover {
    color: #215076;
}

/* Navbar Links */
.navbar-nav .nav-link {
    color: #ffffff !important; /* White text */
    padding: 10px 15px;
    transition: 0.3s ease-in-out;
}

.navbar-nav .nav-link:hover {
    color: #ffc107 !important; /* Bootstrap Warning Yellow */
}

/* Active Menu Item */
.navbar-nav .nav-item.active .nav-link,
.navbar-nav .nav-link.active {
    color: #ffc107 !important;
    font-weight: bold;
}

/* Mobile Toggle Button */
.navbar-toggler {
    border-color: rgba(255, 255, 255, 0.5);
}

.navbar-toggler-icon {
    filter: invert(1);
}

/* Dropdown Styling */
.dropdown-menu {
    background-color: #343a40;
}

/* Profile Header */
.um-profile-photo {
    border-radius: 50%;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2);
}

/* Profile Tabs */
.um-profile-nav {
    background: #000;
    border-radius: 8px;
}

.um-profile-nav a {
    color: #fff !important;
    padding: 10px 15px;
}
/*maxines file*/
/* Friends & Groups */
.um-groups-list .um-group-item, .um-groups-directory .um-group-item{
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1), 0 3px 11px -2px rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1);
    border-radius: 2px;
    padding: 15px !important;
    margin-bottom: 24px;
    border-radius: 10px;
    margin-right: 10px;
}

.um-friend, .um-group {
    background: #f6f6f6;
    padding: 15px;
    border-radius: 5px;
}
.gamipress-badges {
display: flex
;
    gap: 10px;
    margin-bottom: 15px;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}
.page-id-17 img.gamipress-achievement-thumbnail.wp-post-image {
    width: 55px;
}
.page-id-40 .gamipress-achievements-list .gamipress-achievement {
    background: #fff;
    -webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1), 0 3px 11px -2px rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1), 0 3px 11px -2px rgba(0, 0, 0, 0.1), 0 1px 5px 0 rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    padding: 1em;
}
.gamipress-badges img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
}
.page-id-17 span.gamipress-inline-achievement-title {
    display: none;
}

/* Account Header */
    .account-header {
   text-align: center;
    position: relative;
    height: 200px;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    }

    .account-profile {
        display: flex;
        align-items: center;
        gap: 10px;
        justify-content: center;
    }

    .account-profile img {
        width: 80px;
        height: 80px;
        border-radius: 50%;
        object-fit: cover;
        border: 3px solid #fff;
    }

    .account-info h2 {
        font-size: 20px;
        margin: 5px 0;
    }

    .account-info span {
        font-size: 14px;
        color: #666;
    }

    /* User Stats Slider */
    .stats-slider {
        display: flex;
        overflow-x: auto;
        gap: 10px;
        padding: 20px;
        justify-content: center;
    }

    .stats-card {
        background: #f6f6f6;
        padding: 15px;
        text-align: center;
        border-radius: 5px;
        min-width: 100px;
    }

    .stats-card strong {
        font-size: 18px;
        display: block;
    }

    /* Groups Slider */
    .groups-slider {
    
        gap: 10px;
        padding: 20px;
        justify-content: center;
    }

    .group-icon {
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background: #aaa;
    }

 

    .meeting-item {
        border: 1px solid #ccc;
        padding: 15px;
        margin-bottom: 10px;
        border-radius: 5px;
        display: flex;
        align-items: center;
    }

    .meeting-date {
        font-size: 18px;
        font-weight: bold;
        text-align: center;
        min-width: 60px;
    }

    .meeting-details {
        margin-left: 15px;
    }

.row.HL_inc .text-area {
    color: #85919A;
}
i.um-icon-android-checkbox-outline-blank,.um-icon-android-radio-button-off,i.um-icon-android-radio-button-on {
    display: none;
}

span.um-field-checkbox-option,.um-field-radio-option {
    margin-top: -30px;
    margin-bottom: 20px;
}
i.um-icon-android-checkbox-outline {
    display: none;
}

.um-group-item {
    background-color: #fff;
}
.amelia-v2-booking {
 
     margin-top: -70px;
}


    

    .achievements-section h2 {
        font-size: 24px;
        font-weight: bold;
        margin-bottom: 20px;
    }

    .gamipress-achievements {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 15px;
    }

    .gamipress-achievements img {
        width: 80px;
        height: auto;
    }
/*  edulink course list style  */
.edulink-course-card {
    border: 1px solid #ddd;
    padding: 20px;
    margin-bottom: 20px;
    max-width: 400px;
}
.edulink-course-card img {
    max-width: 100%;
    height: auto;
    margin-bottom: 10px;
}
.edulink-course-card .btn {
    display: inline-block;
    padding: 10px 15px;
    background: #2196f3;
    color: #fff;
    text-decoration: none;
    border-radius: 4px;
}
.edulink-course-card .btn:hover {
    background: #1976d2;
}
.edulink-course-single {
    max-width: 800px;
    margin: auto;
}

.course-thumbnail img {
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}

.course-title {
    font-size: 2.2rem;
    margin-bottom: 15px;
}

.course-content {
    font-size: 1.1rem;
    line-height: 1.6;
}

.course-meta {
    margin-top: 30px;
    font-style: italic;
    color: #777;
}
.enroll-modal {
    display: none;
    position: fixed;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.6);
    top: 0; left: 0; width: 100%; height: 100%;
    align-items: center;
    justify-content: center;
}

.enroll-modal.show {
    display: flex;
}

.modal-content {
    background: #fff;
    padding: 30px;
    max-width: 400px;
    text-align: center;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0,0,0,0.3);
}

.modal-content h4 {
    margin-top: 0;
}

.modal-content .close-modal {
    margin-top: 20px;
    padding: 10px 20px;
    background: #2196f3;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.slider .slides li .caption,h2.gamipress-achievement-title,h4.gamipress-achievement-steps-heading,ul.gamipress-achievement-steps.gamipress-required-achievements,ol.gamipress-achievement-steps.gamipress-required-achievements {
    color:#215076;
}

.page-id-17 .woocommerce img, .woocommerce-page img {
    height: inherit;
}
.learn-press-courses span.course-title, .learn-press-courses span.free,.lp-single-course .lp-single-course-main .course-price .free {
    color: #fff !important;
       font-family: 'Garet', sans-serif !important;
  font-weight: bold !important;
  text-transform: uppercase !important;
}
.lp-section-instructor {
    display: none;
}
/*Amelia styles*/
.amelia-v2-booking #amelia-container .am-msd.am-slide-popup__block-inner,span.am-sc__expiration,.amelia-v2-booking #amelia-container .am-cappa__img-name,.amelia-v2-booking #amelia-container .am-cappa__service-img__name,.amelia-v2-booking #amelia-container .am-fs-sb,.um-group-field[data-key=group_privacy] label{
      font-family: 'Garet', sans-serif !important;
  font-weight: bold !important;
  text-transform: uppercase !important;
  font-size: 16px !important;
  background: linear-gradient(45deg, #2A9d8F, #215076) !important;/* Adjust as needed */
  color: #e2e2e2 !important;
}
.um-group-name,.um-notification-header-row{
    color: #215076;
        font-family: 'Garet', sans-serif !important;
  font-weight: bold !important;
  text-transform: uppercase !important;
  font-size: 16px !important;
}
.course-card-wrapper.card {
    padding: 10px;
}
.content-section .um-account-name a,.content-section .um-account-nav a,.um:not(.um-admin),.um-message-conv-item,.um-group-fields .um-group-field,.um-group-field input[type=text]{
    color: #e2e2e2 !important;
}
.um-message-item-content{
    background: #2A9D8F; /* bubble color */
    color: #D2D2DB; /* text color */
    padding: 1em;
    border-radius: 15px;
    max-width: 300px;
    margin: 1em;
    position: relative;
    font-family: sans-serif;
    font-size: 1rem;
    line-height: 1.5;
}

.um-message-item-content::after {
    content: '';
    position: absolute;
    left: -15px;
    top: 20px;
    width: 0;
    height: 0;
    border: 10px solid transparent;
    border-right-color: #2A9D8F; /* MATCH this to the bubble background */
}
.um-notification-b {
     background: #2A9D8F !important; /* bubble color */
    color: #D2D2DB !important; /* text color */}
.um-notification-header a,.um-faicon-ellipsis-h,.um-faicon-eye, .um-notification-content-string{
    color: #2A9D8F !important;
}
.icon_menu {
    display: inline-flex;
    padding: 0px;
    width: 85px;
}
a.um-message-btn::before,a.um-friend-btn::before {
width:87% !important;
}
    .helplink-close-panel-btn {
    position: absolute;
    top: 15px;
    right: 20px;
    z-index: 10000;
    color: white;
    border: none;
    padding: 8px 16px;
    font-size: 14px;
    border-radius: 6px;
    cursor: pointer;

}

.helplink-close-panel-btn:hover {
   font-weight: bold;
}
        .modal {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(0,0,0,0);
      z-index: 10;
 overflow-y: inherit;
 max-height: 60% !important;
 box-shadow: none !important;
}
      /*  .helplink-bookings {
            max-width: 500px;
            margin: 0 auto;
            font-family: 'Segoe UI', sans-serif;
        }*/
        .helplink-card {
          display: flex;
    flex-direction: column;
            align-items: flex-start;
            padding: 15px;
            border: 1px solid #ccc;
            border-radius: 10px;
            margin-bottom: 15px;
            background: #fff;
            box-shadow: 0 2px 5px rgba(0,0,0,0.05);
        }

        .helplink-card-left {
            padding-right: 15px;
            border-right: 1px solid #eee;
        }.helplink-card-right {
            padding-left: 15px;
            
        }
        .helplink-date-box {
            font-size: 14px;
            color: #555;
        }
        .helplink-card-body {
            flex-grow: 1;
            padding: 0 15px;
        }
        .helplink-session-title {
            font-weight: bold;
            margin: 0 0 5px;
            font-size: 16px;
        }
        .helplink-time {
            color: #666;
            font-size: 14px;
            margin-bottom: 5px;
        }
        .helplink-card-actions {
            display: flex;
            flex-direction: column;
            gap: 6px;
        }
        .helplink-card-actions .btn {
            background: none;
            border: none;
            font-size: 18px;
            cursor: pointer;
        }
        .btn-cancel { color: red; }
        .btn-reschedule { color: #215076; }
        .helplink-bookings {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    padding: 10px;
}
        .helplink-package-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
            gap: 20px;
        }
        .helplink-package-card {
            background: #ffffff;
            border: 1px solid #d9e1ec;
            border-radius: 12px;
            padding: 24px;
            box-shadow: 0 4px 12px rgba(0,0,0,0.05);
        }
        
.helplink-card .helplink_btn_alt {
    min-width: 215px;
    text-align: center;
}
        .helplink-package-card h4 {
            font-weight: 600;
            font-size: 20px;
            color: #215076;
            margin-bottom: 20px;
        }
        .helplink-package-card p {
            margin-bottom: 10px;
            color: #4e5c6e;
            font-size: 15px;
        }
        .helplink-package-card .progress {
            height: 12px;
            background-color: #f1f5f9;
            border-radius: 6px;
            margin-top: 8px;
            margin-bottom: 16px;
        }
        .helplink-package-card .progress-bar {
            background-color: #215076;
            height: 100%;
        }
   .amelia-packages {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.amelia-package {
    border: 1px solid #ddd;
    padding: 15px;
    width: 30%;
}

.amelia-book-button {
    display: inline-block;
    margin-top: 10px;
    padding: 10px 15px;
    background-color: #0073aa;
    color: #fff;
    text-decoration: none;
}
.helplink-card-body p{
    color:#215076;
}
.helplink-time{
    color: #2A9d8F;
    font-weight: bold;
}
/* Wrapper: takes full width, scrolls with page */
#helplink-customer-panel-wrapper.modal {
 position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(0,0,0,0);
      z-index: 10;
 overflow-y: inherit;
 max-height: 100% !important;
 box-shadow: none !important;

}

/* Content wrapper (Amelia output) */
#helplink-customer-panel-wrapper .amelia-v2-booking  {
  max-width: 960px;
  width: 100%;

  border-radius: 10px;
  padding: 20px;
   box-shadow: none !important;
  position: relative;
}

/* Close button */
.helplink-close-panel-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 1001;
  background: #215076;
  color: #fff;
  border: none;
  border-radius: 20px;
  padding: 6px 12px;
  font-size: 14px;
  cursor: pointer;
}
.helplink-close-panel-btn:hover {
  background: #183b5e;
}

    .HL_inc .col.s6.m6.l4 .block {
      min-height: 280px;
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
}
.lp-course-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.lp-course-card {
    width: 300px;
    border: 1px solid #215076;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
      color: #215076;
}
.content-item-wrap .course-item-title{
    color: #215076 !important;
}
.lp-single-course__header,.lp-single-course .lp-single-course-main__right__inner{
    background: #215076 !important;
}