/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/


/* Off-Canvas Menu */
.e-off-canvas .logo-section {
	inset-inline-start: 0 !important;
	top: 0 !important;
}

/* User profile dropdown */
.user-profile-dropdown .jet-mobile-menu__controls {
	display: none;
}

/* Notification pill */
.ns-notif-badge {
	--badge-bg: #e53935; /* red */
	--badge-fg: #fff; /* text color */
	--badge-font-size: 13.2px; /* font size */
	--badge-font-weight: 500; /* font weight */
	--badge-size: 22px; /* circle height; scales the pill */
	--badge-side-pad: 5px; /* extra width for 2–3 digits */
	--badge-ring: 0px; /* white ring around pill (helps on dark/blue) */
	--badge-shadow: 0 2px 6px rgba(0, 0, 0, .25);

	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-width: var(--badge-size);
	height: var(--badge-size);
	padding: 0 var(--badge-side-pad);

	background: var(--badge-bg);
	color: var(--badge-fg);
	border-radius: 999px;
	letter-spacing: .2px;
	font-size: var(--badge-font-size);
	font-weight: var(--badge-font-weight);

	/* subtle white ring to pop over colored shapes */
	box-shadow:0 0 0 var(--badge-ring) #fff, var(--badge-shadow);

	/* prevent layout jitter with changing numbers */
	white-space: nowrap;
}

/* Hide when empty or zero (optional) */
.ns-notif-badge:empty,
.ns-notif-badge[data-count="0"] {
	display: none;
}


/* Notifications */

/* Start collapsed */
body:not(.elementor-editor-active) .ns-notification-collapse {
  max-height: 0;             /* animates height nicely with the trick below */
  overflow: hidden;
  opacity: 0;
  transform: translateY(-6px);
  transition:
    max-height .70s cubic-bezier(.22,.61,.36,1),
    opacity   .30s ease-out,
    transform .70s cubic-bezier(.22,.61,.36,1);
}

/* Expanded state */
body:not(.elementor-editor-active) .ns-notification-collapse.is-open {
  /* Set a max-height larger than your panel’s real height */
  max-height: 80vh;
  opacity: 1;
  transform: translateY(0);
}

/* Optional: respect reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .ns-notification-collapse {
    transition: none;
  }
}

.ns-notification-default {
	--notif-color: rgb(13 110 253); /* Default colour in rgb */
}

.ns-notification-general {
	--notif-color: rgb(108 117 125); /* General colour in rgb */
}

.ns-notification-success {
	--notif-color: rgb(25 135 84); /* Success colour in rgb */
}

.ns-notification-info {
	--notif-color: rgb(13 202 240); /* Info colour in rgb */
}

.ns-notification-warning {
	--notif-color: rgb(255 193 7); /* Warning colour in rgb */
}

.ns-notification-danger {
	--notif-color: rgb(220 53 69); /* Danger colour in rgb */
}

/* Apply to widget container */
.ns-notification-default .elementor-widget-container,
.ns-notification-general .elementor-widget-container,
.ns-notification-success .elementor-widget-container,
.ns-notification-info .elementor-widget-container,
.ns-notification-warning .elementor-widget-container,
.ns-notification-danger .elementor-widget-container {
	background-color: rgb(from var(--notif-color) r g b / 0.2);
	border-color: var(--notif-color);
}

/* Apply to notification icon colour */
.ns-notification-default .elementor-widget-container .elementor-icon-list-item .elementor-icon-list-icon svg,
.ns-notification-general .elementor-widget-container .elementor-icon-list-item .elementor-icon-list-icon svg,
.ns-notification-success .elementor-widget-container .elementor-icon-list-item .elementor-icon-list-icon svg,
.ns-notification-info .elementor-widget-container .elementor-icon-list-item .elementor-icon-list-icon svg,
.ns-notification-warning .elementor-widget-container .elementor-icon-list-item .elementor-icon-list-icon svg,
.ns-notification-danger .elementor-widget-container .elementor-icon-list-item .elementor-icon-list-icon svg {
	fill: var(--notif-color);
}

/* Apply to notification text colour */
.ns-notification-default .elementor-widget-container .elementor-icon-list-item .elementor-icon-list-icon+.elementor-icon-list-text,
.ns-notification-general .elementor-widget-container .elementor-icon-list-item .elementor-icon-list-icon+.elementor-icon-list-text,
.ns-notification-success .elementor-widget-container .elementor-icon-list-item .elementor-icon-list-icon+.elementor-icon-list-text,
.ns-notification-info .elementor-widget-container .elementor-icon-list-item .elementor-icon-list-icon+.elementor-icon-list-text,
.ns-notification-warning .elementor-widget-container .elementor-icon-list-item .elementor-icon-list-icon+.elementor-icon-list-text,
.ns-notification-danger .elementor-widget-container .elementor-icon-list-item .elementor-icon-list-icon+.elementor-icon-list-text {
	color: var(--notif-color);
}

/*───────────────────────────────
			MEGA MENU
───────────────────────────────*/

.jet-mega-menu.jet-mega-menu--layout-horizontal .jet-mega-menu-sub-menu__list {
    padding: 6px 0 9px 0;
}

.ns-country-item .jet-listing-dynamic-image__figure {
  display: inline-flex;
  flex-direction: row !important;
  align-items: center;
  gap: 8px;
}

.ns-country-item .jet-listing-dynamic-image__figure .jet-listing-dynamic-image__img {
	max-width: 22px !important;
}

.ns-country-item .jet-listing-dynamic-image__caption {
    width: 210px;
}

.ns-country-item .jet-listing-dynamic-image__link figcaption {
	transition: color 0.2s;
	margin-top: 1px !important;
}

.ns-country-item .jet-listing-dynamic-image__link:hover figcaption {
    color: var( --e-global-color-primary );
}

.ns-header .jet-mega-menu-mega-container__inner {
    box-shadow: none !important;
}

#show-more:hover {
	cursor: pointer;
}

.ns-mobile-menu .jet-mobile-menu__toggle {
    border-radius: 6px;
}

.ns-mobile-menu .jet-mobile-menu__controls {
    padding: 15px 15px 0 15px;
}

body.logged-in .ns-mobile-menu .hide-loggedin {
    display: none;
}

body:not(.logged-in) .ns-mobile-menu .hide-not-loggedin {
    display: none;
}

body.logged-in .ns-nav .hide-loggedin {
    display: none;
}

body:not(.logged-in) .ns-nav .hide-not-loggedin {
    display: none;
}


/*───────────────────────────────
			POSTS
───────────────────────────────*/

#single_content h2 {
    font-size: 1.65rem;
    margin-bottom: 1.2rem;
    font-weight: 700;
}

#single_content h3 {
    font-size: 1.35rem;
    margin-bottom: 1.2rem;
    padding-top: 1.5rem;
    font-weight: 600;
}

#single_content h4 {
    font-size: 1.2rem;
    margin-bottom: 1.2rem;
    padding-top: 1.5rem;
    font-weight: 500;
    font-style: italic;
}

#single_content img {
	box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
	padding: .25rem;
    background-color: #fff;
    border: 1px solid var(--e-global-color-f9f910a);
	border-radius: 6px;
}

#single_content a {
	text-decoration: underline;
}

figcaption {
    margin-top: 12px !important;
}

.ns-comment-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50% !important;
}


/*───────────────────────────────
			PLACES
───────────────────────────────*/

#place_content h2 {
    font-size: 1.65rem;
    font-weight: 700;
}

#place_content h3 {
    font-size: 1.35rem;
    font-weight: 600;
}

/* Style for the disabled download button */
.download-btn a.disabled {
    opacity: 0.5;
    cursor: not-allowed !important;
}

.nslist-item a[data-port-of-entry="no"] .nslist-badge {
    display: none;
}

img.ns-post-thumbnail {
    border-radius: 6px;
}


/* COMMENTS
 * Remove bullets & weird dash in front of author */
#comments .comment-list,
#comments .children {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* === Card container (matches old Noonsite) === */
#comments .card.post-card {
    background: #fff;
    border: 1px solid #e2e6f0;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    margin: 0 0 1rem;
    overflow: hidden;
}

/* Rounded & shadow helpers used by callback */
#comments .rounded { border-radius: 8px; }
#comments .shadow-sm { box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
#comments .my-3 { margin-top: 1rem; margin-bottom: 1rem; }

/* Header bar with date/time + (Edit Comment) */
#comments .card-header {
    background: #f4f6fb;
    border-bottom: 1px solid #e2e6f0;
    padding: 0.5rem 0.9rem;
    font-size: 0.9rem;
}

/* Body with comment text */
#comments .card-body {
    padding: 0.75rem 0.9rem;
    font-size: 0.95rem;
    line-height: 1.55;
}

/* Footer with reply link */
#comments .card-footer {
    padding: 0.5rem 0.9rem 0.75rem;
    border-top: 1px solid #e2e6f0;
    background: #fff;
}

/* === Simple flex grid for avatar / author row === */
#comments .row {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0.4rem 0.9rem 0;
}

#comments .col-3 {
    flex: 0 0 auto;
}

#comments .col-8 {
    flex: 1 1 auto;
    padding-left: 0.75rem;
}

/* Avatar (img or SVG) */
#comments .avatar.photo,
#comments .bi-person-circle {
    border-radius: 50%;
    width: 48px;
    height: 48px;
}

/* Author name + 'says:' */
#comments .col-8 span {
    display: inline-block;
    font-size: 0.95rem;
}

#comments .col-8 a {
    font-weight: 600;
}

/* === Reply button styles (logged-in) === */
#comments .reply .btn.btn-primary {
    display: inline-block;
    padding: 0.35rem 1.2rem;
    border-radius: 999px;
    background: #004f9f;
    border: 1px solid #004f9f;
    color: #fff;
    font-size: 0.9rem;
    text-decoration: none;
}

#comments .reply .btn.btn-primary:hover {
    background: #003b7a;
    border-color: #003b7a;
}

/* Logged-out login/register links */
#comments .reply a.comment-reply-link {
    color: #004f9f;
}

/* Indent child comments slightly like old site */
#comments .children {
    margin-left: 2rem;
}

#comments .ns-comment-author {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.95rem;
}

#comments .ns-comment-author .says {
    color: #555;
}

#comments .card-header {
    font-weight: 500;
    padding: 0.6rem 0.9rem;
}

#comments ol.children {
    margin-left: 2.2rem !important;
}

#comments .card.post-card {
    border: 1px solid #d9deea;
}

/* ===== Comment form card – match old Noonsite ===== */

.comments-area #respond.comment-respond {
    margin-top: 2rem;
    border: 1px solid #e2e6f0;
    border-radius: 8px;
    background: #ffffff;
    overflow: hidden;
}

/* Blue header "Leave a comment" */
.comments-area #respond .ns-comment-form-title {
    margin: 0;
    padding: 0.75rem 1rem;
    background: #20428c;          /* same dark blue as old site */
    color: #ffffff;
    font-size: 1rem;
    font-weight: 600;
}

/* Inner form padding */
.comments-area #respond .comment-form {
    padding: 0.85rem 1rem 1rem;
}

/* Logged-in text spacing */
.comments-area #respond .logged-in-as,
.comments-area #respond .must-log-in {
    margin: 0 0 0.75rem;
    font-size: 0.9rem;
}

/* Label + textarea */
.comments-area #respond .comment-form-comment label {
    display: block;
    margin-bottom: 0.25rem;
    font-weight: 600;
    font-size: 0.9rem;
}

.comments-area #respond textarea#comment {
    width: 100%;
    border-radius: 6px;
    border: 1px solid #c5c9d6;
    padding: 0.6rem 0.7rem;
    font-size: 0.95rem;
    min-height: 130px;
    resize: vertical;
}

/* Submit button – square blue like old "Post Comment" */
.comments-area #respond .form-submit {
    margin-top: 0.75rem;
}

.comments-area #respond .form-submit .submit {
    display: inline-block;
    padding: 0.45rem 1.5rem;
    border-radius: 4px;           /* not pill-shaped */
    border: 1px solid #20428c;
    background: #20428c;
    color: #ffffff;
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
}

.comments-area #respond .form-submit .submit:hover {
    background: #16306a;
    border-color: #16306a;
}

/* Add bottom spacing under comment form */
#respond.comment-respond {
    margin-bottom: 2rem;
}

.comments-area #respond .logged-in-as, .comments-area #respond .must-log-in {
    display: none;
}

.comments-area #respond .comment-form-comment label {
    display: none;
}

/* Hide all elements marked for reveal */
body:not(.elementor-editor-active) .ns-hide-content {
    display: none;          /* fully hidden */
    opacity: 0;             /* prep for a smooth fade-in if needed later */
    transition: opacity 0.3s ease;
}


/* Dropdown content */
/* Hidden by default */
.ns-dropdown-dynamic-content-hide{
  display: none;
}

/* Shown when JS adds the class */
.ns-dropdown-dynamic-content-hide.ns-dd-show{
  display: block !important;
}

