/* ----------------------------------------------------------------
	Merged App Stylesheet
	Source order preserved: app_top.css -> app_bottom.css
	Color controls: edit this single :root block
-----------------------------------------------------------------*/

:root {
	/* Core Brand + Typography */
	--cnvs-themecolor: #6e8f6c;              /* Primary brand green */
	--cnvs-themecolor-rgb: 110, 143, 108;    /* RGB pair for alpha utilities */
	--cnvs-body-font: 'Montserrat', Arial, sans-serif;
	--cnvs-secondary-font: 'Archivo Black', Arial, sans-serif;

	/* Section Accent Colors */
	--cnvs-color-travel: #6f42c1;
	--cnvs-color-tech: #007bff;
	--cnvs-color-fashion: #e83e8c;
	--cnvs-color-sports: #dc3545;
	--cnvs-color-lifestyle: #13a774;
	--cnvs-color-food: #17a2b8;
	--cnvs-color-market: #ffc107;
	--cnvs-color-light: #f8f9fa;
	--cnvs-color-dark: #3e3e3e;
	--cnvs-color-darkest: #191a1d;           /* Effective value from prior top+bottom cascade */
	--cnvs-border: #6a906c;
	--cnvs-body: #484848;
	--cnvs-card-rounded: 20px;

	/* FAQ Theme Colors */
	--mtm-faq-accent: #2f5d3b;
	--mtm-faq-accent-soft: rgba(47, 93, 59, 0.22);
	--mtm-faq-accent-strong: rgba(47, 93, 59, 0.95);
	--mtm-faq-gold: rgba(217, 192, 122, 0.95);
	--mtm-faq-text: #e5e7eb;
	--mtm-faq-muted: rgba(229, 231, 235, 0.78);
	--mtm-faq-muted-2: rgba(229, 231, 235, 0.62);
	--mtm-faq-border: rgba(106, 144, 108, 0.60);
	--mtm-faq-border-strong: rgba(106, 144, 108, 0.85);
	--mtm-faq-page-border: rgba(47, 93, 59, 0.45);         /* FAQ page-specific border tint */
	--mtm-faq-page-border-strong: rgba(47, 93, 59, 0.85);  /* FAQ page-specific strong border */
	--mtm-faq-bar-bg: rgba(0, 0, 0, 0.55);
	--mtm-faq-overlay-grad: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0) 65%);
	--mtm-faq-card-grad: radial-gradient(circle at top left, rgba(17, 17, 17, 0.78), rgba(0, 0, 0, 0.45));
	--mtm-faq-accent-cycle: linear-gradient(135deg, rgba(47, 93, 59, 0.95), rgba(217, 192, 122, 0.90));
	--mtm-faq-body-glow-1: rgba(106, 144, 108, 0.18);
	--mtm-faq-body-glow-2: rgba(248, 228, 136, 0.10);

	/* Shared App Controls */
	--mtm-brand-green: #6a906c;
	--mtm-brand-green-dark: #5b7d5d;
	--mtm-brand-accent: rgba(248, 228, 136, 0.45);
	--mtm-btn-base-shadow: rgba(99, 99, 99, 0.50) 0 2px 8px 0;
	--mtm-btn-primary-border: rgba(106, 144, 108, 0.80);
	--mtm-btn-primary-text: #fff;
	--mtm-btn-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
	--mtm-btn-shadow-hover: 0 8px 18px rgba(106, 144, 108, 0.28);
	--mtm-btn-outline-color: #1fe557;
	--mtm-btn-secondary-bg: rgba(255, 255, 255, 0.08);
	--mtm-btn-secondary-bg-hover: rgba(255, 255, 255, 0.14);
	--mtm-btn-secondary-border: rgba(248, 228, 136, 0.22);
	--mtm-btn-secondary-border-hover: rgba(248, 228, 136, 0.45);
	--mtm-btn-danger-bg: rgba(201, 74, 74, 0.16);
	--mtm-btn-danger-bg-hover: rgba(201, 74, 74, 0.28);
	--mtm-btn-danger-border: rgba(201, 74, 74, 0.55);
	--mtm-btn-danger-border-hover: rgba(201, 74, 74, 0.75);
	--mtm-btn-danger-text: #ffdada;
	--mtm-btn-info-bg: rgba(75, 198, 202, 0.16);
	--mtm-btn-info-bg-hover: rgba(75, 202, 143, 0.28);
	--mtm-btn-info-border: rgba(75, 202, 149, 0.55);
	--mtm-btn-info-border-hover: rgba(75, 202, 137, 0.75);
	--mtm-btn-info-text: #ffdada;

	/* Shared Tile/Card Surface Colors */
	--mtm-tile-border: rgba(248, 228, 136, 0.22);
	--mtm-tile-border-hover: rgba(248, 228, 136, 0.45);
	--mtm-tile-bg-top: rgba(0, 0, 0, 0.42);
	--mtm-tile-bg-bot: rgba(0, 0, 0, 0.28);
	--mtm-tile-shadow: 0 6px 18px rgba(0, 0, 0, 0.22);
	--mtm-tile-shadow-hover: 0 10px 24px rgba(0, 0, 0, 0.28);
	--mtm-card-shadow: rgba(0, 0, 0, 0.36) 0 2px 6px;
	--mtm-comment-bg: rgba(0, 0, 0, 0.20);
	--mtm-comment-shadow: rgba(0, 0, 0, 0.16) 0 1px 4px;
	--mtm-comment-author-text: #ebebeb;
	--mtm-comment-body-text: #a8a8a8;

	/* Message / Alert Colors */
	--mtm-msg-neutral-border: rgba(248, 228, 136, 0.22);
	--mtm-msg-neutral-bg: linear-gradient(180deg, rgba(0, 0, 0, 0.42), rgba(0, 0, 0, 0.28));
	--mtm-msg-neutral-text: #e9ecef;
	--mtm-msg-neutral-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);
	--mtm-msg-success-border: rgba(31, 229, 87, 0.35);
	--mtm-msg-success-bg: rgba(31, 229, 87, 0.08);
	--mtm-msg-success-text: #d6ffdf;
	--mtm-msg-error-border: rgba(201, 74, 74, 0.55);
	--mtm-msg-error-bg: rgba(201, 74, 74, 0.10);
	--mtm-msg-error-text: #ffd5d5;
	--mtm-msg-radius: 14px;

	/* Loader + Overlay Colors */
	--mtm-loader-overlay: rgba(4, 10, 6, 0.78);
	--mtm-loader-panel-bg: linear-gradient(180deg, rgba(16, 16, 16, 0.92), rgba(26, 26, 26, 0.86));
	--mtm-loader-panel-border: rgba(106, 144, 108, 0.45);
	--mtm-loader-ring: rgba(106, 144, 108, 0.24);
	--mtm-loader-ring-active: #6a906c;
	--mtm-loader-ring-accent: rgba(248, 228, 136, 0.75);
	--mtm-loader-ring-shadow: 0 0 0 4px rgba(0, 0, 0, 0.16), 0 0 18px rgba(106, 144, 108, 0.35);
	--mtm-loader-panel-text: #e9ecef;
	--mtm-loader-panel-subtext: #dce3e8;
	--mtm-loader-panel-shadow: 0 18px 40px rgba(0, 0, 0, 0.42);
	--mtm-loader-progress-label: #fff;
	--mtm-loader-progress-meta: rgba(229, 231, 235, 0.82);
	--mtm-loader-progress-border: rgba(106, 144, 108, 0.35);
	--mtm-loader-progress-track: rgba(233, 236, 239, 0.28);
	--mtm-loader-progress-fill: linear-gradient(90deg, #5b7d5d 0%, #6a906c 45%, #7ca87f 100%);
	--mtm-loader-progress-text: #d5f7df;
	--mtm-loader-progress-shadow-text: 0 1px 2px rgba(0, 0, 0, 0.55);

	/* Accounts + Tab Menu Colors */
	--mtm-bumble-yellow: #6e8f6c;
	--mtm-bumble-dark: #191a1d;
	--mtm-tab-bg: #6e8f6c;
	--mtm-tab-border: #ececec;
	--mtm-tab-text: #191a1d;
	--mtm-tab-active-border: #6a906c;
	--mtm-tab-active-text: #fff;
	--mtm-tab-hover-bg: #2e352e;
	--mtm-tab-hover-bg-pill: rgba(110, 143, 108, 0.8);
	--mtm-tab-underline: #6e8f6c;

	/* Common Status/Accent Colors */
	--mtm-status-success: #5cba51;
	--mtm-status-warning: #ffc350;
	--mtm-status-danger: #c94a4a;
	--mtm-status-info: #4bc6ca;
}

/* ----------------------------------------------------------------
	Version: 1.1
-----------------------------------------------------------------*/

/* Customized Colors */

.body-bg{
	overflow-x: hidden !important;
	background:
		radial-gradient(circle at 0% 0%, var(--mtm-faq-body-glow-1), transparent 55%),
		radial-gradient(circle at 100% 120%, var(--mtm-faq-body-glow-2), transparent 55%),
		linear-gradient(to bottom, #0b0b0b, #0b0b0b 55%, #000 100%) !important;

	color: var(--mtm-faq-text);
}

.font-secondary {
      font-family: var(--cnvs-secondary-font);
      font-size: 3rem;
      font-weight: 900;
      letter-spacing: -1.5px;
      text-align: center;
      line-height: 1.22; /* taller text */
      text-transform: uppercase;
    }
    .text-charcoal {
	  color: #232323 !important; /* charcoal */
    }

.span-color{
	color: var(--cnvs-themecolor) !important;
}

/* Hover text color for "Project Details" and "Open Tasks" */
.devhub-actions .btn.btn-outline-light:hover,
.reminders-toolbar .btn.btn-outline-light:hover {
  color: var(--cnvs-themecolor) !important;
}

.rounded-xxl {
	border-radius: var(--cnvs-card-rounded);
}

.form-control{
	/* background-color: var(--cnvs-color-darkest) !important; */
}
.form-signin {
	width: 100%;
	padding: 15px;
	margin: 0 auto;
}

.form-label-group {
	position: relative;
	margin-bottom: 1rem;
}

.form-label-group > label {
	position: absolute;
	top: 50%;
	left: 10px;
	margin-bottom: 0; /* Override default `<label>` margin */
	color: #e9e9e9;
	padding: 2px 4px;
	transform: translateY(-50%);
	transition: all 200ms ease;
	background-color: rgba(0, 0, 0, 0.40);
	cursor: text;
}
.form-control {
	--cnvs-input-focus-border-color: var(--cnvs-themecolor) !important;
	--cnvs-input-focus-box-shadow: 0 0 0 0.25rem rgba(var(--cnvs-themecolor-rgb), 0.25) !important;

}

.form-label-group .form-control:focus + label,
.form-label-group .form-control:valid + label,
.form-label-group .form-control.focus-visible + label {
  font-size: 10px;
  top: 0;
  transform: translate3d(0, -50%, 0);
  opacity: 1;
}

/* Make the native checkbox use our theme color when checked */
.form-check-input {
  /* modern browsers */
  accent-color: var(--cnvs-themecolor);
}

/* fallback for browsers that don’t support accent-color: */
.form-check-input:checked {
  background-color: var(--cnvs-themecolor);
  border-color:     var(--cnvs-themecolor);
}

.entry-meta:not(.no-separator) li::before {
  margin-right: 5px !important;
 
}
.table {
  --bs-table-bg: transparent !important;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid rgba(92, 186, 81, 0.0) !important;
  border-radius: 10px !important;
}

#header {
	--cnvs-primary-menu-font-size: 0.75rem;
	--cnvs-primary-menu-tt: uppercase;
	--cnvs-primary-menu-font-weight: 600;
	--cnvs-header-height: 30px;
	--mtm-header-bg; var(--cnvs-color-darkest);
}
#header-wrap {
  background-color: rgba(20, 23, 20, 0.8) !important;
  }
  
.font-primary { font-family: 'Roboto Slab', serif !important; }

/* Colors */
.color-home,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-home:hover > .menu-link,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-home.current > .menu-link,
.menu-item.menu-color-home .sub-menu-container .menu-item:hover > .menu-link,
.menu-item.menu-color-home .sub-menu-container .menu-item.current > .menu-link { color: var(--cnvs-themecolor) !important; }

.color-travel,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-travel:hover > .menu-link,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-travel.current > .menu-link,
.menu-item.menu-color-travel .sub-menu-container .menu-item:hover > .menu-link,
.menu-item.menu-color-travel .sub-menu-container .menu-item.current > .menu-link { color: var(--cnvs-color-travel) !important; }

.color-tech,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-tech:hover > .menu-link,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-tech.current > .menu-link,
.menu-item.menu-color-tech .sub-menu-container .menu-item:hover > .menu-link,
.menu-item.menu-color-tech .sub-menu-container .menu-item.current > .menu-link { color: var(--cnvs-color-tech) !important; }

.color-fashion,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-fashion:hover > .menu-link,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-fashion.current > .menu-link,
.menu-item.menu-color-fashion .sub-menu-container .menu-item:hover > .menu-link,
.menu-item.menu-color-fashion .sub-menu-container .menu-item.current > .menu-link { color: var(--cnvs-color-fashion) !important; }

.color-sports,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-sports:hover > .menu-link,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-sports.current > .menu-link,
.menu-item.menu-color-sports .sub-menu-container .menu-item:hover > .menu-link,
.menu-item.menu-color-sports .sub-menu-container .menu-item.current > .menu-link { color: var(--cnvs-color-sports) !important; }

.color-lifestyle,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-lifestyle:hover > .menu-link,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-lifestyle.current > .menu-link,
.menu-item.menu-color-lifestyle .sub-menu-container .menu-item:hover > .menu-link,
.menu-item.menu-color-lifestyle .sub-menu-container .menu-item.current > .menu-link { color: var(--cnvs-color-lifestyle) !important; }

.color-food,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-food:hover > .menu-link,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-food.current > .menu-link,
.menu-item.menu-color-food .sub-menu-container .menu-item:hover > .menu-link,
.menu-item.menu-color-food .sub-menu-container .menu-item.current > .menu-link { color: var(--cnvs-color-food) !important; }

.color-market,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-market:hover > .menu-link,
body:not(.dark) #header:not(.dark) #header-wrap:not(.dark) .menu-container > .menu-item.menu-color-market.current > .menu-link,
.menu-item.menu-color-market .sub-menu-container .menu-item:hover > .menu-link,
.menu-item.menu-color-market .sub-menu-container .menu-item.current > .menu-link { color: var(--cnvs-color-market) !important; }


.navbar-nav.nav-sm .nav-link:hover,
.navbar-nav.nav-sm .nav-link.active { color: #FFF; }

/* Background Colors */
.bg-home,
.bg-color-home.nav-link:hover,
.menu-color-home > a::before,
.bg-color-home.nav-link.active { background: var(--cnvs-themecolor) !important; }

.bg-travel,
.bg-color-travel.nav-link:hover,
.menu-color-travel > a::before,
.bg-color-travel.nav-link.active { background: var(--cnvs-color-travel) !important; }

.bg-tech,
.bg-color-tech.nav-link:hover,
.menu-color-tech > a::before,
.bg-color-tech.nav-link.active { background: var(--cnvs-color-tech) !important; }

.bg-fashion,
.bg-color-fashion.nav-link:hover,
.menu-color-fashion > a::before,
.bg-color-fashion.nav-link.active { background: var(--cnvs-color-fashion) !important; }

.bg-sports,
.bg-color-sports.nav-link:hover,
.menu-color-sports > a::before,
.bg-color-sports.nav-link.active { background: var(--cnvs-color-sports) !important; }

.bg-lifestyle,
.bg-color-lifestyle.nav-link:hover,
.menu-color-lifestyle > a::before,
.bg-color-lifestyle.nav-link.active { background: var(--cnvs-color-lifestyle) !important; }

.bg-food,
.bg-color-food.nav-link:hover,
.menu-color-food > a::before,
.bg-color-food.nav-link.active { background: var(--cnvs-color-food) !important; }

.bg-market,
.bg-color-market.nav-link:hover,
.menu-color-market > a::before,
.bg-color-market.nav-link.active { background: var(--cnvs-color-market) !important; }

@media (max-width: 575px) {

	#top-cart {
		display: block;
		right: 70px;
	}
}

.social-icon.si-mini {
	width: 30px;
	height: 30px;
	font-size: 12px;
	line-height: 29px !important;
}

.social-icon.si-mini:hover i:first-child { margin-top: -29px; }

.si-instagram:hover,
.si-colored.si-instagram {
	background: #C92BB7;
	background: linear-gradient(145deg, #3051F1 10%, #C92BB7 70%) no-repeat;
}

.hesperiden .tp-tab-date { margin-bottom: 2px; }

.hesperiden .tp-tab-date.tp-tab-para {
	margin-top: 3px;
	font-weight: 400;
	color: #888;
	font-family: var(--cnvs-body-font);
}

.tp-tab-title {
	white-space: nowrap;
	width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
}


.menu-container > .menu-item > .menu-link {
	-webkit-transition: color .4s ease;
	-o-transition: color .4s ease;
	transition: color .4s ease;
}

.entry-title h3 {
	font-weight: 600;
}
.entry-categories {
	position: absolute;
	bottom: 10px;
	left: 10px;
	text-transform: capitalize;
}

.bg-overlay .entry-categories {
	position: relative;
	left: auto;
	bottom: auto;
	margin-bottom: 12px;
	z-index: 2;
}

.entry-categories a {
	color: #FFF !important;
	padding: 3px 5px;
	font-size: 10px;
	border-radius: 2px;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 400;
	font-family: var(--cnvs-body-font);
}

.entry-meta {
	margin-top: 5px;
}

.entry-meta li {
	font-size: 0.875rem;
}

.entry-meta li a:not(:hover) {
	color: #AAA;
}

.entry-icons {
	position: absolute;
	right: 0;
	bottom: 0;
	margin: 0;
	padding: 0;
}

.entry-icons li {
	position: relative;
	display: inline-block;
	margin: 0 5px;
}

.entry-icons a {
	font-weight: 600;
	color: #EEE;
}

.entry-icons span {
	opacity: 0;
	position: absolute;
	left: 50%;
	margin-left: -1px;
	top: 0;
	font-size: 11px;
	font-weight: 600;
	font-family: var(--cnvs-body-font);
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	-webkit-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
}

.entry:hover .entry-icons span {
	opacity: 1;
	-webkit-transform: translate(-50%, -13px);
	transform: translate(-50%, -13px);
}

.nav-link { color: #333; }
.dark .nav-link { color: #EEE; }

.navbar-nav.nav-sm .nav-link {
	color: #444;
	font-size: 12px;
	font-weight: 400;
	padding: 2px 6px;
	line-height: 21px;
	margin: 4px 2px;
	border-radius: 2px;
	font-family: var(--cnvs-body-font);
	-webkit-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
}

.navbar-light .navbar-nav .dropdown-toggle::after { display: none; }

.line-xs {
	margin: 4px 0 20px;
	border-bottom: 3px solid #EEE;
}

.line-xs::after {
	top: 100%;
	left: 30px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(51,51,51,0);
	border-top-color: #EEE;
	border-width: 8px;
	margin-left: -8px;
	z-index: 1;
	background: none;
}

/* Line Colors */
.line-home { border-bottom-color:  var(--cnvs-themecolor) !important; }
.line-travel { border-bottom-color:  var(--cnvs-color-travel) !important; }
.line-tech { border-bottom-color:  var(--cnvs-color-tech) !important; }
.line-fashion { border-bottom-color:  var(--cnvs-color-fashion) !important; }
.line-sports { border-bottom-color:  var(--cnvs-color-sports) !important; }
.line-lifestyle { border-bottom-color:  var(--cnvs-color-lifestyle) !important; }
.line-food { border-bottom-color:  var(--cnvs-color-food) !important; }
.line-market { border-bottom-color:  var(--cnvs-color-market) !important; }
.line-light { border-bottom-color:  var(--cnvs-color-light, #F8F9FA) !important; }
.line-dark { border-bottom-color:  var(--cnvs-color-dark, #343A40) !important; }

.line-home::after { border-top-color:  var(--cnvs-themecolor) !important; }
.line-travel::after { border-top-color:  var(--cnvs-color-travel) !important; }
.line-tech::after { border-top-color:  var(--cnvs-color-tech) !important; }
.line-fashion::after { border-top-color:  var(--cnvs-color-fashion) !important; }
.line-sports::after { border-top-color:  var(--cnvs-color-sports) !important; }
.line-lifestyle::after { border-top-color:  var(--cnvs-color-lifestyle) !important; }
.line-food::after { border-top-color:  var(--cnvs-color-food) !important; }
.line-market::after { border-top-color:  var(--cnvs-color-market) !important; }
.line-light::after { border-top-color:  var(--cnvs-color-light, #F8F9FA) !important; }
.line-dark::after { border-top-color:  var(--cnvs-color-dark, #343A40) !important; }

.menu-link::before {
	content: '';
	position: absolute;
	top: 0px;
	left: 0;
	width: 100%;
	height: 1px;
	-webkit-transform: scale3d(0, 0, 0);
	transform: scale3d(0, 0, 0);
	-webkit-transition: -webkit-transform 0.1s;
	transition: transform 0.1s;
	-webkit-transition-timing-function: cubic-bezier(1, 0.68, 0.16, 0.9);
	transition-timing-function: cubic-bezier(1, 0.68, 0.16, 0.9);
}

.menu-item:hover > .menu-link::before,
.menu-item.current > .menu-link::before {
	-webkit-transform: scale3d(1, 3, 1);
	transform: scale3d(1, 3, 1);
	-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
}

.slide .slider-caption-bg { opacity: 1; }

.owl-carousel.fixed-nav:hover .owl-nav [class*=owl-],
.owl-carousel.fixed-nav .owl-nav [class*=owl-] {
	top: auto;
	margin-top: 0;
	left: auto;
	bottom: 10px;
	right: 30px;
	font-size: 14px;
	width: 26px;
	height: 26px;
	border-radius: 3px;
	line-height: 25px;
	opacity: 1;
}

.owl-carousel.fixed-nav:hover .owl-nav .owl-next,
.owl-carousel.fixed-nav .owl-nav .owl-next {
	left: auto;
	right: 0;
}

.owl-carousel.fixed-nav .owl-nav .disabled {
	opacity: .4 !important;
	display: block !important;
	cursor: auto;
}

.owl-carousel.fixed-nav.top-nav:hover .owl-nav [class*=owl-],
.owl-carousel.fixed-nav.top-nav .owl-nav [class*=owl-] {
	top: -44px;
	bottom: auto;
}

.owl-carousel.fixed-nav .owl-nav [class*=owl-]:hover {
	background-color: inherit !important;
	color: inherit !important;
}

.device-xs #primary-menu-trigger {margin-left: 25px;}

.scroll-wrap {
	width: 100%;
	overflow-y: scroll;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
}

.scroll	{ width: calc(100% - 10px); }

.scroll-wrap::-webkit-scrollbar {
	background: rgba(0, 0, 0, 0.04);
	border-radius: 4px;
	height: 10px;
	width: 6px;
}

.scroll-wrap::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.4);
	border-radius: 4px;
}

.owl-carousel .owl-dots .owl-dot { background-color: #5cba51; }

.entry-meta ul + ul li:first-child::before { content: none; }

.content-wrap .breadcrumb {
	position: relative !important;
	top: auto !important;
    right: auto !important;
    transform: none;
}

.si-sticky {
	width: 32px;
	left: 0;
}

.si-sticky .social-icon {
	margin: 0;
	border-radius: 0;
}

/* [data-bs-toggle="collapse"][aria-expanded="true"] { display: none; } */

/*  Larger Device View
-----------------------------------------------------------------*/
@media (min-width: 992px) {

	/* Primary Menu Header size */
	#header { border-bottom: 1px solid #e7e7e7 }

	#header.full-header #logo,
	#header.full-header .menu-container {
		border-right: 0;
		padding-right: 0;
		margin-right: 0;
	}
	
}
#header.sticky-header #header-wrap {
	-webkit-transition: left .4s ease;
	-o-transition: left .4s ease;
	transition: left .4s ease;
}
.content-wrap{
	overflow: visible !important;
}
.profile-banner { 
            overflow: visible !important;
            margin-top: -50px !important;
        }

body.side-panel-open #header.sticky-header #header-wrap { left: -300px; }

body #side-panel .widget {
	opacity: 0;
	-webkit-transform: scale(0.9);
	-ms-transform: scale(0.9);
	-o-transform: scale(0.9);
	transform: scale(0.9);
	-webkit-transition: transform .3s ease, opacity .3s ease;
	-o-transition: transform .3s ease, opacity .3s ease;
	transition: transform .3s ease, opacity .3s ease;
}

body.side-panel-open #side-panel .widget {
	opacity: 1;
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}

/* ----------------------------------------------------------------
	Shared UI Components + Utilities
	Grouped by component type for easier maintenance.
-----------------------------------------------------------------*/

/* Typography Helpers */
.main-subheadline {
  font-family: 'Montserrat', Arial, sans-serif;
  font-size: 2.2vw !important;
  font-weight: 600;
  margin-bottom: 38px;
  letter-spacing: -0.5px;
  line-height: .90;
}
@media (max-width: 991px) {
	.login-heading {
	  font-size: 1.4rem !important;
	}
	.main-subheadline {
	  font-size: 1.5rem !important;
	}
}

/* ----------------------------------------------------------------
	Buttons
	Use `.btn-mtm-*` classes to apply donations/accounts button styles
	on any page without page-specific selectors.
-----------------------------------------------------------------*/
.btn-block {
  display: block;
  width: 100%;
  box-sizing: border-box;
}

/* Shared transition + shadow baseline for button-like controls */
.btn,
.button,
.btn-mtm-primary,
.btn-mtm-secondary,
.btn-mtm-danger,
.btn-mtm-info,
.btn-mtm-outline {
	box-shadow: var(--mtm-btn-base-shadow, rgba(99, 99, 99, 0.50) 0 2px 8px 0) !important;
	transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background-color .12s ease, color .12s ease;
}
.btn:hover,
.btn:focus {
	background-color: var(--cnvs-color-darkest) !important;
}

/* Primary green pill style (legacy selectors + reusable class) */
.btn-outlines,
.btn.bg-color,
.upload-btn,
.btn-mtm-primary {
	border: 1px solid var(--mtm-btn-primary-border, rgba(106, 144, 108, 0.80)) !important;
	background-color: var(--mtm-brand-green, #6a906c) !important;
	color: var(--mtm-btn-primary-text, #fff) !important;
	border-radius: 999px !important;
	font-weight: 800;
	letter-spacing: .2px;
	box-shadow: var(--mtm-btn-shadow, 0 4px 12px rgba(0, 0, 0, 0.18)) !important;
}

.btn-outlines:hover,
.btn-outlines:focus,
.btn.bg-color:hover,
.btn.bg-color:focus,
.upload-btn:hover,
.upload-btn:focus,
.btn-mtm-primary:hover,
.btn-mtm-primary:focus {
	border-color: var(--mtm-brand-green-dark, #5b7d5d) !important;
	background-color: var(--mtm-brand-green-dark, #5b7d5d) !important;
	color: var(--mtm-btn-primary-text, #fff) !important;
	transform: translateY(-1px);
	box-shadow: var(--mtm-btn-shadow-hover, 0 8px 18px rgba(106, 144, 108, 0.28)) !important;
}

/* Outline variant */
.btn-outline-custom,
.btn-mtm-outline {
  color: var(--mtm-btn-outline-color, #1fe557);
  border: 1px solid var(--mtm-btn-outline-color, #1fe557);
  border-radius: 999px !important;
  font-weight: 800;
  letter-spacing: .2px;
}
.btn-outline-custom:hover,
.btn-outline-custom:focus,
.btn-mtm-outline:hover,
.btn-mtm-outline:focus {
  background-color: var(--mtm-btn-outline-color, #1fe557);
  color: var(--mtm-btn-primary-text, #fff);
  border-color: var(--mtm-btn-outline-color, #1fe557);
  transform: translateY(-1px);
}

.upload-btn {
	padding: 10px 15px;
	font-size: 1rem;
	cursor: pointer;
	border-width: 1px !important;
}

.nav-profile-img {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 50%;
    border: 2px solid #fff;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
    background: #eaeaea;
}
.profile-info-mega-menu .fw-bold {
    font-size: 1rem;
    color: #333;
    margin-top: 4px;
    margin-bottom: 0;
}

/* Legacy .content-wrap compatibility + reusable .btn-mtm-* bridge */
	.content-wrap .btn,
	.content-wrap button.btn,
	.content-wrap .button.button-rounded,
	.btn-mtm-pill {
		border-radius: 999px !important;
		font-weight: 800;
		letter-spacing: .2px;
	}
	.content-wrap .btn-outlines,
	.content-wrap .btn.bg-color,
	.content-wrap .btn.btn-secondary,
	.content-wrap .btn.btn-danger,
	.content-wrap .btn.btn-info,
	.content-wrap .btn-outline-custom,
	.btn-mtm-primary,
	.btn-mtm-secondary,
	.btn-mtm-danger,
	.btn-mtm-info,
	.btn-mtm-outline {
		box-shadow: var(--mtm-btn-shadow, 0 4px 12px rgba(0, 0, 0, 0.18));
	}
	.content-wrap .btn-outlines,
	.content-wrap .btn.bg-color,
	.content-wrap .btn-outline-custom,
	.btn-mtm-primary {
		background: var(--mtm-brand-green, #6a906c) !important;
		border: 1px solid var(--mtm-btn-primary-border, rgba(106, 144, 108, 0.80)) !important;
		color: var(--mtm-btn-primary-text, #fff) !important;
	}
	.content-wrap .btn-outlines:hover,
	.content-wrap .btn.bg-color:hover,
	.content-wrap .btn-outline-custom:hover,
	.content-wrap .btn-outlines:focus,
	.content-wrap .btn.bg-color:focus,
	.content-wrap .btn-outline-custom:focus,
	.btn-mtm-primary:hover,
	.btn-mtm-primary:focus {
		background: var(--mtm-brand-green-dark, #5b7d5d) !important;
		border-color: var(--mtm-brand-green-dark, #5b7d5d) !important;
		box-shadow: var(--mtm-btn-shadow-hover, 0 8px 18px rgba(106, 144, 108, 0.28));
		transform: translateY(-1px);
	}
	.content-wrap .btn.btn-secondary,
	.btn-mtm-secondary {
		background: var(--mtm-btn-secondary-bg, rgba(255, 255, 255, 0.08)) !important;
		border: 1px solid var(--mtm-btn-secondary-border, rgba(248, 228, 136, 0.22)) !important;
		color: var(--mtm-btn-primary-text, #fff) !important;
	}
	.content-wrap .btn.btn-secondary:hover,
	.content-wrap .btn.btn-secondary:focus,
	.btn-mtm-secondary:hover,
	.btn-mtm-secondary:focus {
		background: var(--mtm-btn-secondary-bg-hover, rgba(255, 255, 255, 0.14)) !important;
		border-color: var(--mtm-btn-secondary-border-hover, rgba(248, 228, 136, 0.45)) !important;
		transform: translateY(-1px);
	}
	.content-wrap .btn.btn-danger,
	.btn-mtm-danger {
		background: var(--mtm-btn-danger-bg, rgba(201, 74, 74, 0.16)) !important;
		border: 1px solid var(--mtm-btn-danger-border, rgba(201, 74, 74, 0.55)) !important;
		color: var(--mtm-btn-danger-text, #ffdada) !important;
	}
	.content-wrap .btn.btn-danger:hover,
	.content-wrap .btn.btn-danger:focus,
	.btn-mtm-danger:hover,
	.btn-mtm-danger:focus {
		background: var(--mtm-btn-danger-bg-hover, rgba(201, 74, 74, 0.28)) !important;
		border-color: var(--mtm-btn-danger-border-hover, rgba(201, 74, 74, 0.75)) !important;
		transform: translateY(-1px);
	}
	.content-wrap .btn.btn-info,
	.btn-mtm-info {
		background: var(--mtm-btn-info-bg, rgba(75, 198, 202, 0.16)) !important;
		border: 1px solid var(--mtm-btn-info-border, rgba(75, 202, 149, 0.55)) !important;
		color: var(--mtm-btn-info-text, #ffdada) !important;
	}
	.content-wrap .btn.btn-info:hover,
	.content-wrap .btn.btn-info:focus,
	.btn-mtm-info:hover,
	.btn-mtm-info:focus {
		background: var(--mtm-btn-info-bg-hover, rgba(75, 202, 143, 0.28)) !important;
		border-color: var(--mtm-btn-info-border-hover, rgba(75, 202, 137, 0.75)) !important;
		transform: translateY(-1px);
	}
	.tagcloud a {
		padding: 4px 8px !important;
		border: 1px solid #678068 !important;
		font-size: 14px !important;
		color: #a7f8bb !important;
	}

/* ----------------------------------------------------------------
	Cards
-----------------------------------------------------------------*/
	.card,
	.card-mtm {
		box-shadow: var(--mtm-card-shadow, rgba(0, 0, 0, 0.36) 0 2px 6px) !important;
		/* background-color: rgba(0, 0, 0, 0.2) !important; */
	}
	.comment-wrap {
		background-color: var(--mtm-comment-bg, rgba(0, 0, 0, 0.20)) !important;
		box-shadow: var(--mtm-comment-shadow, rgba(0, 0, 0, 0.16) 0 1px 4px) !important;
	}
	.comment-author {
		color: var(--mtm-comment-author-text, #ebebeb) !important;
	}
	.comment-verbiage {
		color: var(--mtm-comment-body-text, #a8a8a8) !important;
	}

/* Toggle Switch Styling */
.toggle {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}
.toggle input {
  display: none;
}
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  transition: 0.4s;
  border-radius: 34px;
}
.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: #fff;
  transition: 0.4s;
  border-radius: 50%;
}
input:checked + .slider {
  background-color: var(--cnvs-border);
}
input:checked + .slider:before {
  transform: translateX(26px);
}

/* ----------------------------------------------------------------
	Loaders + Overlays
-----------------------------------------------------------------*/
	.loader,
	.loader-mtm {
	    display: none;
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    width: 52px;
	    height: 52px;
	    margin-left: -26px;
	    margin-top: -26px;
	    border: 4px solid var(--mtm-loader-ring, rgba(106, 144, 108, 0.24));
	    border-radius: 50%;
	    border-top-color: var(--mtm-loader-ring-active, #6a906c);
	    animation: spin .85s linear infinite;
	    box-shadow: var(--mtm-loader-ring-shadow, 0 0 0 4px rgba(0, 0, 0, 0.16), 0 0 18px rgba(106, 144, 108, 0.35));
	    z-index: 9999;
	}
	.loader::after,
	.loader-mtm::after {
	    content: "";
	    position: absolute;
	    inset: 6px;
	    border-radius: 50%;
	    border: 3px solid transparent;
	    border-top-color: var(--mtm-loader-ring-accent, rgba(248, 228, 136, 0.75));
	    animation: spin 1.4s linear infinite reverse;
	}

	@keyframes spin {
	    0% { transform: rotate(0deg); }
	    100% { transform: rotate(360deg); }
	}

	.overlay_g,
	.overlay,
	.overlay-mtm {
	    display: none;
	    position: fixed;
	    top: 0;
	    left: 0;
	    width: 100%;
	    height: 100%;
	    background: var(--mtm-loader-overlay, rgba(4, 10, 6, 0.78)) !important;
	    z-index: 9999;
	    justify-content: center;
	    align-items: center;
	    padding: 1rem;
	    backdrop-filter: blur(2px);
	}
	.spinner-container,
	.progress-container,
	.spinner-panel,
	.progress-panel {
	    text-align: center;
	    color: var(--mtm-loader-panel-text, #e9ecef);
	    background: var(--mtm-loader-panel-bg, linear-gradient(180deg, rgba(16, 16, 16, 0.92), rgba(26, 26, 26, 0.86))) !important;
	    border: 1px solid var(--mtm-loader-panel-border, rgba(106, 144, 108, 0.45));
	    border-radius: 16px;
	    box-shadow: var(--mtm-loader-panel-shadow, 0 18px 40px rgba(0, 0, 0, 0.42));
	}
	.spinner-container,
	.spinner-panel {
	    min-width: 220px;
	    max-width: min(92vw, 420px);
	    padding: 1rem 1.2rem;
	}
	.spinner-container p,
	.spinner-panel p {
	    margin: .55rem 0 0;
	    color: var(--mtm-loader-panel-subtext, #dce3e8);
	    font-weight: 600;
	}
	.progress-container,
	.progress-panel {
	    width: 90%;
	    max-width: 430px;
	    padding: 1rem 1rem 1.1rem;
	}
	.progress-message {
	    font-size: 1rem;
	    margin-bottom: .45rem;
	    color: var(--mtm-loader-progress-label, #fff);
	    font-weight: 700;
	}
	.progress-container small {
	    display: block;
	    margin-top: .45rem;
	    margin-bottom: .75rem;
	    color: var(--mtm-loader-progress-meta, rgba(229, 231, 235, 0.82));
	}
	.progress-bar-wrapper {
	    width: 100%;
	    background: var(--mtm-loader-progress-track, rgba(233, 236, 239, 0.28));
	    border: 1px solid var(--mtm-loader-progress-border, rgba(106, 144, 108, 0.35));
	    border-radius: 999px;
	    overflow: hidden;
	    position: relative;
	    height: 1.05rem;
	}
	.progress-bar {
	    height: 100%;
	    width: 0;
	    background: var(--mtm-loader-progress-fill, linear-gradient(90deg, #5b7d5d 0%, #6a906c 45%, #7ca87f 100%)) !important;
	    transition: width .35s ease;
	}
	.progress-text {
	    position: absolute;
	    top: 0;
	    left: 0;
	    right: 0;
	    bottom: 0;
	    display: flex;
	    justify-content: center;
	    align-items: center;
	    font-size: .78rem;
	    font-weight: 700;
	    color: var(--mtm-loader-progress-text, #d5f7df) !important;
	    text-shadow: var(--mtm-loader-progress-shadow-text, 0 1px 2px rgba(0, 0, 0, 0.55));
	}
	.overlay_g .spinner-border,
	.overlay_g .spinner-grow,
	.overlay .spinner-border,
	.overlay .spinner-grow,
	.overlay-mtm .spinner-border,
	.overlay-mtm .spinner-grow {
	    color: var(--cnvs-border) !important;
	    width: 2.2rem;
	    height: 2.2rem;
	}

/* ----------------------------------------------------------------
	Messages + Alerts
-----------------------------------------------------------------*/
	#messageBox {
	    position: fixed;
	    top: 20px;
	    right: 20px;
	    z-index: 9999;
	    max-width: min(92vw, 460px);
	    padding: .65rem .85rem;
	    backdrop-filter: blur(4px);
	}
	.message,
	.message-box,
	#messageBox,
	.message-mtm {
	    border-radius: var(--mtm-msg-radius, 14px);
	    font-weight: 700;
	}
	.message-box,
	#messageBox,
	.message-mtm {
	    border: 1px solid var(--mtm-msg-neutral-border, rgba(248, 228, 136, 0.22));
	    background: var(--mtm-msg-neutral-bg, linear-gradient(180deg, rgba(0, 0, 0, 0.42), rgba(0, 0, 0, 0.28))) !important;
	    color: var(--mtm-msg-neutral-text, #e9ecef);
	    box-shadow: var(--mtm-msg-neutral-shadow, 0 12px 30px rgba(0, 0, 0, 0.28));
	}
	.message-box {
	    padding: .6rem .85rem;
	}
	.message {
	    padding: .65rem .8rem;
	    margin-top: 10px;
	    text-align: center;
	    border: 1px solid var(--mtm-msg-neutral-border, rgba(248, 228, 136, 0.22));
	}
	.alert-outline-success,
	.alert-outline-danger {
	    padding: 2px 10px;
	    border-radius: 999px;
	    border-style: solid;
	    border-width: 1px;
	    font-weight: 700;
	}
	.message-box.success,
	.message.success,
	.message-mtm-success,
	.alert-outline-success,
	.content-wrap .message.success,
	.content-wrap .alert-outline-success {
	    border-color: var(--mtm-msg-success-border, rgba(31, 229, 87, 0.35)) !important;
	    background: var(--mtm-msg-success-bg, rgba(31, 229, 87, 0.08)) !important;
	    color: var(--mtm-msg-success-text, #d6ffdf) !important;
	}
	.message-box.error,
	.message.error,
	.message-mtm-error,
	.alert-outline-danger,
	.content-wrap .message.error,
	.content-wrap .alert-outline-danger {
	    border-color: var(--mtm-msg-error-border, rgba(201, 74, 74, 0.55)) !important;
	    background: var(--mtm-msg-error-bg, rgba(201, 74, 74, 0.10)) !important;
	    color: var(--mtm-msg-error-text, #ffd5d5) !important;
	}
    
/* Profile Image */
	.profile-img {
	    width: 50px;
	    height: 50px;
	    border-radius: 50%;
	    object-fit: cover; /* Ensures the image is cropped to fit the circle */
	    object-position: center; /* Center the cropped image */
	    border: 2px solid #ddd;
	}
	.profile-img-small {
	    width: 24px;
	    height: 24px;
	    border-radius: 50%;
	    object-fit: cover; /* Ensures the image is cropped to fit the circle */
	    object-position: center; /* Center the cropped image */
	    border: 2px solid #ddd;
	}
	
/* Dropzone */
	.dropzone {
	    border: 2px dashed #007bff;
	    padding: 20px;
	    text-align: center;
	    margin-bottom: 20px;
	    cursor: pointer;
	    background-color: rgba(27, 27, 27) !important;
	    transition: background-color 0.3s ease-in-out;
	    border-radius: 5px;
	}
	
	.dropzone.dragover {
	    background-color: #e6f7ff;
	}
	
	.file-preview-wrapper {
	    display: grid;
	    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
	    gap: 10px;
	    justify-content: center;
	    margin-top: 20px;
	}
	
	.file-preview-tile {
	    width: 100px;
	    height: 100px;
	    background-color: #fff;
	    border: 1px solid #ddd;
	    border-radius: 5px;
	    display: flex;
	    flex-direction: column;
	    align-items: center;
	    justify-content: center;
	    text-align: center;
	    overflow: hidden;
	    position: relative;
	    transition: transform 0.2s ease, box-shadow 0.2s ease;
	}
	
	.file-preview-tile:hover {
	    transform: scale(1.05);
	    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	}
	
	.file-preview-tile i {
	    font-size: 1.5rem;
	    color: #007bff;
	}
	
	.file-preview-tile img {
	    max-width: 80%;
	    max-height: 50px;
	    margin-bottom: 5px;
	}
	
	.file-preview-tile .file-name {
	    font-size: 0.8rem;
	    color: #333;
	    text-overflow: ellipsis;
	    white-space: nowrap;
	    overflow: hidden;
	    width: 90%;
	    text-align: center;
	    margin: 0 auto;
	}
	.upload-form-row {
        display: flex;
        justify-content: center; /* Center items horizontally */
        align-items: center; /* Center items vertically */
        gap: 20px; /* Add space between items */
        flex-wrap: wrap; /* Allow wrapping for smaller screens */
    }

    .upload-form-row p {
        margin: 0; /* Remove default margin from paragraphs */
    }
/* File grid/list and items */
	.file-grid {
	    display: grid;
	    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	    gap: 15px;
	}
	.file-list-container {
	    width: 100%;
	    border-radius: 5px; /* list container radius */
	    overflow: hidden;   /* hide any overflow from rounded corners */
	    border: 1px solid #ddd;
	    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
	}
	
	.file-row {
	    display: flex;
	    align-items: center;
	    height: 60px;
	    padding: 8px;
	    border-bottom: 1px solid #ddd;
	    background: rgba(250, 250, 250, 0.60) !important;
	    transition: background 0.3s ease-in-out;
	    flex-wrap: nowrap;
	}
	
	.file-row:hover {
	    background: #e6f7ff;
	}
	
	.folder-item {
	    cursor: pointer;
	}
	
	.file-checkbox {
	    width: 20px;
	    height: 20px;
	    margin-right: 10px;
	}
	
	.file-icon, .folder-icon {
	    font-size: 24px;
	    color: #555;
	    margin-right: 10px;
	}
	
	.file-thumbnail {
	    width: 40px;
	    height: 40px;
	    border-radius: 5px;
	    object-fit: cover;
	    margin-right: 10px;
	}
	
	.file-name {
	    flex-grow: 1;
	    flex-shrink: 1;
	    flex-basis: 0;
	    min-width: 0; /* allow shrinking */
	    font-size: 12px; /* smaller font */
	    text-align: center;
	    color: #333;
	    white-space: nowrap;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    margin: 0 10px;
	}
	.folder-description {
	    flex-grow: 1;
	    flex-shrink: 1;
	    flex-basis: 0;
	    min-width: 0; /* allow shrinking */
	    font-size: 12px; /* smaller font */
	    color: #333;
	    white-space: nowrap;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    margin: 0 10px;
	}
	
	.button-row {
	    flex-shrink: 0; /* keep button container intact */
	    display: flex;
	    gap: 10px;
	}
	
	/* Ensure inline forms inside the button row have no extra margins */
	.button-row form {
	    margin: 0;
	}
	
	/* Uniform button styling */
	.view-btn, .download-btn, .delete-btn {
	    padding: 5px 10px;
	    font-size: 12px;
	    border-radius: 5px;
	    text-decoration: none;
	    text-align: center;
	    color: white;
	    display: inline-block;
	}
	
	.view-btn {
	    background-color: #007bff;
	}
	
	.download-btn {
	    background-color: #28a745;
	}
	
	.delete-btn {
	    background-color: #dc3545;
	    border: none;
	    cursor: pointer;
	}
	
	.view-btn:hover {
	    background-color: #0056b3;
	}
	
	.download-btn:hover {
	    background-color: #218838;
	}
	
	.delete-btn:hover {
	    background-color: #c82333;
	}
	
	/* Full-width search bar */
	.search-container {
	    width: 100%;
	    margin-bottom: 10px;
	}
	
	.search-container input {
	    width: 100%;
	    padding: 8px;
	    font-size: 14px;
	    border: 1px solid #ccc;
	    border-radius: 5px;
	}
/* Gold star icon for the newest file */
	.newest-icon {
	    font-size: 1.5rem;
	    color: gold;
	    z-index: 2;
	}

	/* Share Styling */
    .shared-files-container {
        text-align: center;
        margin-top: 20px;
        background: #fff;
        padding: 20px;
        border-radius: 10px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }
    .shared-files-list {
        list-style: none;
        padding: 0;
        margin: 20px 0;
    }
    .shared-file-item {
        margin-bottom: 20px;
        padding: 15px;
        border: 1px solid #ddd;
        border-radius: 8px;
        background: #f9f9f9;
    }
    .file-list {
        list-style: disc;
        padding-left: 20px;
        margin-top: 10px;
    }
    .action-buttons {
        margin-top: 15px;
        display: flex;
        gap: 10px;
        justify-content: center;
    }
    .action-btn {
        padding: 8px 15px;
        border: none;
        border-radius: 5px;
        cursor: pointer;
        font-size: 14px;
    }
    .edit-btn {
        background: #007bff;
        color: #fff;
    }
    
/* shared display section */
    .shared-files-list {
        list-style-type: none;
        padding: 0;
        margin: 0;
    }

    .shared-file-header {
        margin-bottom: 0px;
        font-size: 16px;
        color: #333;
    }

    .file-list {
        list-style: none;
        padding: 0;
        margin: 0;
        font-size: 11px;
    }

    .file-list li {
        display: flex;
        align-items: center;
        color: #555;
    }

    .shared-file-footer {
        margin-top: 5px;
        font-size: 14px;
        color: #555;
    }

    .action-btn.delete-btn {
        background-color: #f44336;
        color: white;
    }

    .action-btn.delete-btn:hover {
        background-color: #c62828;
    }

    .action-btn.edit-btn {
        background-color: #007bff;
        color: white;
    }

    .action-btn.edit-btn:hover {
        background-color: #0056b3;
    }
    
/* ----------------------------------------------------------------
	my_donations shared design tokens + components
-----------------------------------------------------------------*/
body.my-donations-view-page,
body.my-donations-settings-page {
	--brand-green: var(--mtm-brand-green);
	--brand-green-dark: var(--mtm-brand-green-dark);
	--brand-accent: var(--mtm-brand-accent);
	--tile-border: var(--mtm-tile-border);
	--tile-border-hover: var(--mtm-tile-border-hover);
	--tile-bg-top: var(--mtm-tile-bg-top);
	--tile-bg-bot: var(--mtm-tile-bg-bot);
	--tile-shadow: var(--mtm-tile-shadow);
	--tile-shadow-hover: var(--mtm-tile-shadow-hover);
}
body.my-donations-view-page .label-cell {
	position: relative;
	padding-top: 1.6em;
}
body.my-donations-view-page .label-cell .cell-label {
	position: absolute;
	top: -1px;
	left: -1px;
	background: rgba(0, 0, 0, 0.20);
	color: #b1b1b1;
	padding: 5px 4px;
	font-size: 0.60em;
	line-height: 1;
	border-radius: 3px;
}
body.my-donations-view-page .alert-outline-success,
body.my-donations-settings-page .alert-outline-success {
	border: 1px solid #1fe557;
	color: #d7ffd2;
	background: rgba(31,229,87,.08);
	padding: 6px 10px;
	border-radius: 999px;
	font-weight: 700;
}
body.my-donations-view-page .alert-outline-danger,
body.my-donations-settings-page .alert-outline-danger {
	border: 1px solid rgba(201,74,74,.75);
	color: #ffd2d2;
	background: rgba(255,0,0,.08);
	padding: 6px 10px;
	border-radius: 999px;
	font-weight: 700;
}
body.my-donations-view-page .mono,
body.my-donations-settings-page .mono {
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	font-size: 0.72rem;
	opacity: .95;
}
body.my-donations-view-page .badge-status,
.badge-status-mtm {
	border: 1px solid rgba(92, 186, 81, 0.55);
	color: #d7ffd2;
	background: rgba(0, 0, 0, 0.20);
	font-weight: 700;
	letter-spacing: .04rem;
}
body.my-donations-view-page .content-wrap {
	padding-top: .75rem !important;
	background: radial-gradient(1200px 700px at 15% -10%, rgba(106,144,108,.16), transparent 60%),
				radial-gradient(1000px 640px at 100% 0%, rgba(248,228,136,.08), transparent 60%);
}
body.my-donations-view-page .content-wrap > .container-fluid > .line,
body.my-donations-view-page .donation-card .line {
	border-top-color: rgba(248,228,136,.14) !important;
}
body.my-donations-view-page .entry-meta ul {
	gap: .35rem;
}
body.my-donations-view-page .entry-meta span,
body.my-donations-view-page .entry-meta li {
	color: #e9ecef;
}
body.my-donations-view-page .content-wrap .container-fluid > .row .dark {
	border: 1px solid var(--tile-border);
	border-radius: 16px;
	background: linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,.15));
	padding: .75rem;
	box-shadow: var(--tile-shadow);
}
body.my-donations-view-page .input-group .form-control {
	background: rgba(0,0,0,.28);
	color: #fff;
	border: 1px solid var(--tile-border) !important;
	border-radius: 999px 0 0 999px !important;
}
body.my-donations-view-page .input-group .form-control::placeholder {
	color: rgba(255,255,255,.65);
}
body.my-donations-view-page .input-group .form-control:focus {
	box-shadow: 0 0 0 3px var(--brand-accent);
	border-color: var(--tile-border-hover) !important;
}
body.my-donations-view-page .input-group .btn {
	border-radius: 0 999px 999px 0 !important;
}
body.my-donations-view-page .content-wrap .btn,
body.my-donations-view-page .content-wrap button.btn,
body.my-donations-view-page .content-wrap .button.button-rounded {
	border-radius: 999px !important;
	font-weight: 800;
	letter-spacing: .2px;
}
body.my-donations-view-page .content-wrap .btn-outlines,
body.my-donations-view-page .content-wrap .btn.bg-color,
body.my-donations-view-page .content-wrap .btn.btn-secondary,
body.my-donations-view-page .content-wrap .btn.btn-danger,
body.my-donations-view-page .content-wrap .btn.btn-info {
	transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background-color .12s ease;
	box-shadow: var(--mtm-btn-shadow);
}
body.my-donations-view-page .content-wrap .btn-outlines,
body.my-donations-view-page .content-wrap .btn.bg-color {
	background: var(--brand-green) !important;
	border: 1px solid var(--mtm-btn-primary-border) !important;
	color: var(--mtm-btn-primary-text) !important;
}
body.my-donations-view-page .content-wrap .btn-outlines:hover,
body.my-donations-view-page .content-wrap .btn.bg-color:hover {
	background: var(--brand-green-dark) !important;
	border-color: var(--brand-green-dark) !important;
	transform: translateY(-1px);
	box-shadow: var(--mtm-btn-shadow-hover);
}
body.my-donations-view-page .content-wrap .btn.btn-secondary {
	background: var(--mtm-btn-secondary-bg) !important;
	border: 1px solid var(--mtm-btn-secondary-border) !important;
	color: var(--mtm-btn-primary-text) !important;
}
body.my-donations-view-page .content-wrap .btn.btn-secondary:hover {
	background: var(--mtm-btn-secondary-bg-hover) !important;
	border-color: var(--mtm-btn-secondary-border-hover) !important;
	transform: translateY(-1px);
}
body.my-donations-view-page .content-wrap .btn.btn-danger {
	background: var(--mtm-btn-danger-bg) !important;
	border: 1px solid var(--mtm-btn-danger-border) !important;
	color: var(--mtm-btn-danger-text) !important;
}
body.my-donations-view-page .content-wrap .btn.btn-danger:hover {
	background: var(--mtm-btn-danger-bg-hover) !important;
	border-color: var(--mtm-btn-danger-border-hover) !important;
	transform: translateY(-1px);
}
body.my-donations-view-page .content-wrap .btn.btn-info {
	background: var(--mtm-btn-info-bg) !important;
	border: 1px solid var(--mtm-btn-info-border) !important;
	color: var(--mtm-btn-info-text) !important;
}
body.my-donations-view-page .content-wrap .btn.btn-info:hover {
	background: var(--mtm-btn-info-bg-hover) !important;
	border-color: var(--mtm-btn-info-border-hover) !important;
	transform: translateY(-1px);
}
body.my-donations-view-page .content-wrap .input-group .btn.btn-outline-custom {
	font-weight: 800 !important;
	letter-spacing: .2px !important;
	line-height: 1.1 !important;
	padding: .55rem .95rem !important;
	background: rgba(0,0,0,.20) !important;
	color: var(--brand-green) !important;
	border: 1px solid rgba(106,144,108,.65) !important;
	box-shadow: 0 2px 10px rgba(106,144,108,.12) !important;
	transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background-color .12s ease, color .12s ease !important;
}
body.my-donations-view-page .content-wrap .input-group .btn.btn-outline-custom:hover,
body.my-donations-view-page .content-wrap .input-group .btn.btn-outline-custom:focus {
	background: var(--brand-green) !important;
	color: #fff !important;
	border-color: var(--brand-green) !important;
	box-shadow: 0 6px 16px rgba(106,144,108,.28) !important;
	transform: translateY(-1px);
}
body.my-donations-view-page .donation-filter-btn .badge {
	border-radius: 999px;
}
body.my-donations-view-page .donation-filter-btn {
	position: relative;
}
body.my-donations-view-page .donation-filter-btn.active,
body.my-donations-view-page .donation-filter-btn:active,
body.my-donations-view-page .donation-filter-btn[aria-pressed="true"] {
	background: var(--brand-green) !important;
	border-color: rgba(106,144,108,.9) !important;
	color: #fff !important;
	box-shadow: 0 0 0 2px rgba(248,228,136,.16) inset, 0 8px 18px rgba(106,144,108,.24) !important;
	transform: translateY(-1px);
}
body.my-donations-view-page .donation-filter-btn.active .badge,
body.my-donations-view-page .donation-filter-btn[aria-pressed="true"] .badge {
	background: rgba(0,0,0,.55) !important;
	color: #fff !important;
}
body.my-donations-view-page .card-table {
	overflow: hidden;
	border: none;
}
body.my-donations-view-page .donation-cards .donation-card > .card,
body.my-donations-view-page .donation-card .card,
.card-mtm-tile {
	border: 1px solid var(--tile-border);
	background: linear-gradient(180deg, var(--tile-bg-top), var(--tile-bg-bot));
	border-radius: 14px;
	box-shadow: var(--tile-shadow);
	overflow: hidden;
	position: relative;
	transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
body.my-donations-view-page .donation-cards .donation-card > .card::before,
body.my-donations-view-page .donation-card .card::before,
.card-mtm-tile.card-mtm-accent::before {
	content: "";
	position: absolute;
	left: 8px;
	top: 10px;
	bottom: 10px;
	width: 4px;
	border-radius: 8px;
	background: var(--card-status-accent, var(--brand-green));
	box-shadow: 0 0 0 1px rgba(0,0,0,.35) inset, 0 0 10px rgba(255,255,255,.14);
}
body.my-donations-view-page .donation-cards .donation-card > .card:hover,
body.my-donations-view-page .donation-card .card:hover,
.card-mtm-tile:hover {
	transform: translateY(-2px);
	box-shadow: var(--tile-shadow-hover);
	border-color: var(--tile-border-hover);
}
body.my-donations-view-page .donation-card .card .card-body,
.card-mtm-tile .card-body {
	padding: 12px 12px 12px 16px;
}
body.my-donations-view-page .donation-card strong {
	color: #fff;
	font-weight: 700;
}
body.my-donations-view-page .donation-card .line {
	border-top: 1px solid rgba(255,255,255,.08) !important;
}
body.my-donations-view-page .btn-outline-light {
	border-radius: 999px;
	border-color: rgba(255,255,255,.18) !important;
	background: rgba(255,255,255,.04);
}
body.my-donations-view-page .btn-outline-light:hover {
	background: rgba(255,255,255,.08);
	border-color: var(--tile-border-hover) !important;
}
body.my-donations-view-page .badge.bg-dark {
	background: rgba(0,0,0,.45) !important;
}
body.my-donations-view-page .custom-thead {
	background: rgba(33, 36, 40, 0.95) !important;
	color: #fff;
	font-weight: 900 !important;
	font-size: 0.8rem !important;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.4);
}
body.my-donations-view-page .custom-thead th {
	padding: 16px 12px;
	vertical-align: middle;
	border: none;
	text-align: left;
}
body.my-donations-view-page .custom-thead tr:first-child th {
	border-bottom: 0.5px solid rgba(255, 255, 255, 0.5);
}
body.my-donations-view-page td {
	font-size: 0.8rem !important;
	font-weight: 500 !important;
	letter-spacing: .03rem !important;
	text-shadow: 0 1px 1px #000000 !important;
}
body.my-donations-view-page .table-responsive {
	width: 100%;
	overflow-x: auto;
	-ms-overflow-style: none;
	scrollbar-width: none;
}
body.my-donations-view-page .table-responsive::-webkit-scrollbar {
	display: none;
}
body.my-donations-view-page .responsive-table {
	width: 100%;
}
body.my-donations-view-page .responsive-table th,
body.my-donations-view-page .responsive-table td {
	padding: 12px 10px;
	vertical-align: middle;
	word-wrap: break-word;
	border: 1px solid rgba(27, 27, 27, 0.76);
}
body.my-donations-view-page .tdt {
	border-radius: 0px;
}
body.my-donations-view-page .tdtr {
	border-top-right-radius: 10px;
	border-bottom-right-radius: 0px;
}
body.my-donations-view-page .tdb {
	border-radius: 0px;
}
body.my-donations-view-page .tdbr {
	border-bottom-right-radius: 10px;
}
body.my-donations-view-page .tdboth {
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}
body.my-donations-view-page .responsive-table thead {
	background-color: #f8f9fa;
}
body.my-donations-view-page .responsive-table th {
	font-weight: bold;
}
body.my-donations-view-page th.sortable {
	cursor: pointer;
	position: relative;
}
body.my-donations-view-page th.sortable:hover {
	background-color: rgba(35, 228, 80, 0.58);
}
body.my-donations-view-page th.sortable::after {
	content: " ▼";
	font-size: 0.8em;
	position: absolute;
	right: 10px;
	opacity: 0.6;
}
body.my-donations-view-page th.sortable.asc::after {
	content: " ▲";
}
body.my-donations-view-page .cell-content {
	margin-top: 6px;
	text-align: center;
}
body.my-donations-view-page .cell-content-name {
	margin-top: 6px;
}
@media (max-width: 812px) {
	body.my-donations-view-page .card-table.mb-3 {
		border: 1px solid var(--tile-border);
		border-radius: 14px;
		margin-bottom: 15px;
		box-shadow: var(--tile-shadow);
	}
	body.my-donations-view-page .card-body {
		padding: 10px 15px;
	}
	body.my-donations-view-page .card-body div {
		margin-bottom: 5px;
	}
	body.my-donations-view-page .content-wrap .container-fluid > .row .dark {
		padding: .55rem;
	}
}
body.my-donations-view-page .content-wrap .form-control,
body.my-donations-view-page .content-wrap .form-select,
body.my-donations-view-page .content-wrap select,
body.my-donations-view-page .content-wrap textarea {
	font-size: 1rem !important;
}
body.my-donations-view-page .content-wrap label,
body.my-donations-view-page .content-wrap .form-label,
body.my-donations-view-page .content-wrap .form-label-group > label,
body.my-donations-view-page .content-wrap .form-group label {
	font-size: 1rem !important;
	font-weight: 600;
}
body.my-donations-view-page .content-wrap .donation-card .card .card-body {
	font-size: 1rem;
}
body.my-donations-view-page .content-wrap .donation-card .badge,
body.my-donations-view-page .content-wrap .badge-status {
	font-size: .92rem;
}
body.my-donations-view-page .content-wrap .mono {
	font-size: .9rem;
	line-height: 1.5;
}
body.my-donations-view-page .content-wrap .small {
	font-size: .95rem !important;
	line-height: 1.45;
}

/* my_donations/settings.php (migrated inline styles) */
body.my-donations-settings-page .content-wrap {
	padding-top: .75rem !important;
	background: radial-gradient(1200px 700px at 15% -10%, rgba(106,144,108,.16), transparent 60%),
				radial-gradient(1000px 640px at 100% 0%, rgba(248,228,136,.08), transparent 60%);
}
body.my-donations-settings-page .content-wrap > .container-fluid > .line,
body.my-donations-settings-page .content-wrap .card .line {
	border-top-color: rgba(248,228,136,.14) !important;
}
body.my-donations-settings-page .content-wrap .entry-meta ul {
	gap: .35rem;
}
body.my-donations-settings-page .content-wrap .entry-meta span,
body.my-donations-settings-page .content-wrap .entry-meta li {
	color: #e9ecef;
}
body.my-donations-settings-page .content-wrap .card.card-table.dark {
	border: 1px solid var(--tile-border);
	border-radius: 16px;
	background: linear-gradient(180deg, var(--tile-bg-top), var(--tile-bg-bot));
	box-shadow: var(--tile-shadow);
	overflow: hidden;
}
body.my-donations-settings-page .content-wrap .card.card-table.dark:hover {
	border-color: var(--tile-border-hover);
	box-shadow: var(--tile-shadow-hover);
}
body.my-donations-settings-page .content-wrap .card.card-table.dark .card-body {
	padding: 1rem;
}
body.my-donations-settings-page .content-wrap .card.card-table.dark h3 {
	color: #fff;
	font-weight: 700;
}
body.my-donations-settings-page .content-wrap .form-label {
	color: #e9ecef;
	font-weight: 600;
}
body.my-donations-settings-page .content-wrap .form-text {
	color: rgba(233,236,239,.85) !important;
}
body.my-donations-settings-page .content-wrap .form-control,
body.my-donations-settings-page .content-wrap .form-select {
	border: 1px solid var(--tile-border) !important;
	background: rgba(0,0,0,.28);
	color: #fff;
	border-radius: 12px;
}
body.my-donations-settings-page .content-wrap .form-control::placeholder {
	color: rgba(255,255,255,.65);
}
body.my-donations-settings-page .content-wrap .form-control:focus,
body.my-donations-settings-page .content-wrap .form-select:focus {
	box-shadow: 0 0 0 3px var(--brand-accent);
	border-color: var(--tile-border-hover) !important;
}
body.my-donations-settings-page .content-wrap .form-select:disabled {
	opacity: 1;
	color: rgba(255,255,255,.9);
}
body.my-donations-settings-page .content-wrap .btn-outline-custom {
	border-radius: 999px;
	font-weight: 800;
	letter-spacing: .2px;
	line-height: 1.1;
	padding: .55rem .95rem;
	background: rgba(0,0,0,.20);
	color: var(--brand-green);
	border: 1px solid rgba(106,144,108,.65);
	box-shadow: 0 2px 10px rgba(106,144,108,.12);
	transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background-color .12s ease, color .12s ease;
}
body.my-donations-settings-page .content-wrap .btn-outline-custom:hover,
body.my-donations-settings-page .content-wrap .btn-outline-custom:focus {
	background: var(--brand-green);
	color: #fff;
	border-color: var(--brand-green);
	box-shadow: 0 6px 16px rgba(106,144,108,.28);
	transform: translateY(-1px);
}
body.my-donations-settings-page .content-wrap .btn-outline-custom:active {
	transform: translateY(0);
}
@media (max-width: 812px) {
	body.my-donations-settings-page .content-wrap .card.card-table.dark {
		border-radius: 14px;
	}
	body.my-donations-settings-page .content-wrap .card.card-table.dark .card-body {
		padding: .9rem;
	}
}

/* my_donations/faq.php (migrated inline styles) */
body.my-donations-faq-page {
	--accent: var(--mtm-faq-accent);
	--accent-soft: var(--mtm-faq-accent-soft);
	--accent-strong: var(--mtm-faq-accent-strong);
	--gold: var(--mtm-faq-gold);
	--text: var(--mtm-faq-text);
	--muted: var(--mtm-faq-muted);
	--muted-2: var(--mtm-faq-muted-2);
	--border: var(--mtm-faq-page-border);
	--border-strong: var(--mtm-faq-page-border-strong);
	--bar-bg: var(--mtm-faq-bar-bg);
	--overlay-grad: var(--mtm-faq-overlay-grad);
	--card-grad: var(--mtm-faq-card-grad);
	--accent-cycle: var(--mtm-faq-accent-cycle);
}
@keyframes accentShift {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 50% 50%;
	}
	100% {
		background-position: 100% 50%;
	}
}
@keyframes glowCycle {
	0% {
		border-color: rgba(254,202,202,0.9);
		box-shadow: 0 22px 70px rgba(15,23,42,.5), 0 0 0 1px rgba(15,23,42,.6), 0 0 30px rgba(254,202,202,0.25);
	}
	25% {
		border-color: rgba(187,247,208,0.9);
		box-shadow: 0 22px 70px rgba(15,23,42,.5), 0 0 0 1px rgba(15,23,42,.6), 0 0 30px rgba(187,247,208,0.25);
	}
	50% {
		border-color: rgba(191,219,254,0.9);
		box-shadow: 0 22px 70px rgba(15,23,42,.5), 0 0 0 1px rgba(15,23,42,.6), 0 0 30px rgba(191,219,254,0.25);
	}
	75% {
		border-color: rgba(233,213,255,0.9);
		box-shadow: 0 22px 70px rgba(15,23,42,.5), 0 0 0 1px rgba(15,23,42,.6), 0 0 30px rgba(233,213,255,0.25);
	}
	100% {
		border-color: rgba(249,168,212,0.9);
		box-shadow: 0 22px 70px rgba(15,23,42,.5), 0 0 0 1px rgba(15,23,42,.6), 0 0 30px rgba(249,168,212,0.25);
	}
}
body.my-donations-faq-page .body-bg {
	background: radial-gradient(circle at 0% 0%, rgba(106,144,108,0.18), transparent 55%),
				radial-gradient(circle at 100% 120%, rgba(248,228,136,0.10), transparent 55%),
				linear-gradient(to bottom, #0b0b0b, #0b0b0b 55%, #000 100%);
	color: var(--text);
}
body.my-donations-faq-page .content-wrap.dark {
	background: transparent;
}
body.my-donations-faq-page .text-charcoal {
	color: #e5e7eb !important;
}
body.my-donations-faq-page .text-soft {
	color: rgba(148,163,184,0.9) !important;
}
body.my-donations-faq-page .profile-banner {
	position: relative;
	height: 250px;
	overflow: hidden;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
body.my-donations-faq-page .profile-header {
	text-align: center;
	position: relative;
}
body.my-donations-faq-page .banner {
	width: 100%;
	height: 200px;
	background-color: #333;
}
body.my-donations-faq-page .banner img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
body.my-donations-faq-page .profile-picture {
	position: absolute;
	bottom: -50px;
	left: 50%;
	transform: translateX(-50%);
	border: 5px solid #fff;
	border-radius: 50%;
	overflow: hidden;
}
body.my-donations-faq-page .profile-picture img {
	width: 100px;
	height: 100px;
	object-fit: cover;
}
body.my-donations-faq-page .user-name {
	margin-top: 60px;
}
body.my-donations-faq-page .profile-image {
	position: absolute;
	top: 136px !important;
	left: 50%;
	transform: translateX(-50%);
	width: 150px;
	height: 150px;
	border-radius: 50%;
	border: 5px solid #fff;
	overflow: hidden;
	background: transparent;
	box-shadow: 0 10px 30px rgba(0,0,0,.65);
}
body.my-donations-faq-page .profile-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
body.my-donations-faq-page .profile-info {
	text-align: center;
	margin-top: 8px !important;
}
body.my-donations-faq-page .profile-image .qr-overlay-btn {
	position: absolute;
	right: 6px;
	bottom: 6px;
	width: 38px;
	height: 38px;
	border-radius: 999px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0,0,0,0.72);
	border: 1px solid rgba(248,228,136,0.55);
	color: var(--text);
	box-shadow: 0 14px 34px rgba(0,0,0,0.65);
	z-index: 9 !important;
	cursor: pointer;
}
body.my-donations-faq-page .profile-image .qr-overlay-btn i {
	font-size: 1.1rem;
	line-height: 1;
}
body.my-donations-faq-page .profile-image .qr-overlay-btn:hover {
	border-color: var(--accent);
	color: rgba(248,228,136,0.95);
	box-shadow: 0 0 18px rgba(106,144,108,0.55);
}
body.my-donations-faq-page .accordion-item {
	background: transparent;
	border: none;
}
body.my-donations-faq-page .accordion-item + .accordion-item {
	margin-top: 1rem;
}
body.my-donations-faq-page .accordion-button {
	background: rgba(17,17,17,0.72);
	color: var(--text);
	border-radius: 16px !important;
	border: 1px solid rgba(106,144,108,0.85);
	box-shadow: 0 10px 24px rgba(0,0,0,0.35);
	font-weight: 700;
	letter-spacing: .2px;
}
body.my-donations-faq-page .accordion-button::after {
	filter: invert(1) brightness(0.9);
}
body.my-donations-faq-page .accordion-button:not(.collapsed) {
	background: rgba(0,0,0,0.38);
	border-color: rgba(248,228,136,0.85);
	color: var(--text);
	box-shadow: 0 14px 30px rgba(0,0,0,0.45);
}
body.my-donations-faq-page .accordion-collapse {
	border-radius: 0 0 16px 16px;
}
body.my-donations-faq-page .accordion-body {
	background: rgba(17,17,17,0.65);
	border: 1px solid rgba(106,144,108,0.60);
	border-top: none;
	color: var(--text);
	border-radius: 0 0 16px 16px;
	box-shadow: 0 10px 24px rgba(0,0,0,0.35);
}
body.my-donations-faq-page .faq-section ul,
body.my-donations-faq-page .faq-section ol {
	list-style: none !important;
	padding-left: 0 !important;
	margin-left: 0 !important;
}
body.my-donations-faq-page .faq-section li {
	margin: 0 !important;
}
body.my-donations-faq-page .overlay_g {
	position: fixed;
	inset: 0;
	display: none;
	align-items: center;
	justify-content: center;
	background: rgba(2,6,23,.78);
	z-index: 2000;
	color: var(--text);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}
body.my-donations-faq-page .spinner-container {
	text-align: center;
}
body.my-donations-faq-page .button,
body.my-donations-faq-page .btn {
	transition: background .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease, filter .18s ease;
}
body.my-donations-faq-page .button:hover,
body.my-donations-faq-page .btn:hover {
	transform: translateY(-1px);
	filter: brightness(1.08) saturate(1.2) hue-rotate(6deg);
}
body.my-donations-faq-page #qrModal .modal-content {
	border-radius: 24px;
	border: 1px solid rgba(148,163,184,0.7);
	background: radial-gradient(circle at 0% 0%, rgba(15,23,42,0.95), #020617);
	color: #e5e7eb;
	box-shadow: 0 22px 70px rgba(0,0,0,1), 0 0 26px rgba(191,219,254,0.45);
	backdrop-filter: blur(22px);
	-webkit-backdrop-filter: blur(22px);
}
body.my-donations-faq-page #qrModal .modal-header {
	border-bottom: 1px solid rgba(31,41,55,1);
}
body.my-donations-faq-page #qrModal .modal-body {
	background: transparent;
}
body.my-donations-faq-page #qrModal .qr-code-img {
	border-radius: 18px;
	box-shadow: 0 18px 40px rgba(0,0,0,0.9);
}

/* /accounts/accounts.css + /accounts/nav.css merged into global app.css
   Scoped to accounts pages via body.accounts-page to preserve existing behavior. */

/* accounts.css */
body.accounts-page .bumble-carousel-wrap {
  position: relative;
  width: 100%;
  max-width: 390px;
  margin: 0 auto 2.5rem auto;
  /* Remove fixed height */
  perspective: 900px;
  overflow: visible;
  display: flex;
  flex-direction: column;
  align-items: center;
}

body.accounts-page .bumble-carousel-inner {
  display: flex;
  justify-content: center;
  align-items: flex-start; /* align to top so cards expand down */
  /* Remove fixed height */
  position: relative;
  touch-action: pan-y;
  user-select: none;
  width: 100%;
  min-height: 320px; /* fallback min-height if needed */
  margin-bottom: 2.2rem; /* space for arrows below cards */
}
body.accounts-page .bumble-card {
  position: absolute;
  top: 0;
  left: 50%;
  width: 72%;
  max-width: 310px;
  min-width: 220px;
  background: #fff;
  border-radius: 2.3rem;
  box-shadow: 0 8px 32px rgba(101, 101, 101, 0.31) !important;
  border: 1px solid #6e8f6c;
  padding: 2.3rem 1.2rem 1.6rem;
  opacity: 0;
  transform: translateX(-50%) scale(0.86);
  transition:
    transform 0.38s cubic-bezier(.83,.01,.14,.99),
    opacity 0.34s cubic-bezier(.7,.09,.44,.99),
    z-index 0s;
  z-index: 1;
  pointer-events: auto; /* Important: allow clicks/taps on partially visible cards */
  cursor: pointer;
}
body.accounts-page .bumble-card.active {
  opacity: 1;
  transform: translateX(-50%) scale(1.0);
  z-index: 5;
  pointer-events: auto;
  box-shadow: 0 16px 48px #ffdf5980, 0 2px 12px rgba(0,0,0,0.04);
  cursor: default;
}
body.accounts-page .bumble-card.left,
body.accounts-page .bumble-card.right {
  opacity: 1;
  z-index: 3;
}
body.accounts-page .bumble-card.left {
  transform: translateX(-135%) scale(0.93) rotateY(17deg);
}
body.accounts-page .bumble-card.right {
  transform: translateX(35%) scale(0.93) rotateY(-17deg);
}
body.accounts-page .bumble-popular {
  position: absolute;
  top: -22px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--mtm-bumble-yellow);
  color: #ffffff;
  font-weight: 800;
  border-radius: 0.7rem;
  width: 190px;
  padding: 6px 32px;
  font-size: 1.04rem;
  box-shadow: 0 2px 8px rgba(76, 72, 66, 1)50;
  z-index: 99;
}
body.accounts-page .bumble-price {
  font-size: 2.2rem;
  font-weight: 800;
  color: #232323;
  line-height: 1.05;
}
body.accounts-page .bumble-interval {
  font-size: 1.18rem;
  color: #888;
  font-weight: 500;
}
body.accounts-page .bumble-arrows {
  display: flex;
  justify-content: center;
  gap: 2rem;
  margin: 2rem 0 1.2rem;
}
body.accounts-page .bumble-arrow-btn {
  background: var(--mtm-bumble-yellow);
  border: none;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  box-shadow: 0 4px 16px #ffe06660;
  font-size: 2rem;
  color: #232323;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .18s;
}
body.accounts-page .bumble-arrow-btn:active {
  background: #fffbe6;
}
body.accounts-page .bumble-pagination {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin: 1.1rem 0 0.8rem;
}
body.accounts-page .bumble-dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #ececec;
  border: 2.4px solid #fff8;
  transition: .2s;
}
body.accounts-page .bumble-dot.active {
  background: var(--mtm-bumble-yellow);
  border: 2.4px solid var(--mtm-bumble-yellow);
}

@media(max-width:600px) {
  body.accounts-page .bumble-carousel-wrap { max-width: 100vw; }
  body.accounts-page .bumble-card { max-width: 95vw; }
}

@media (max-width: 991px) {
  body.accounts-page .desktop-only {
    /* Fade to transparent at the top of the bar */
		.bumble-add-bar {
		  position: fixed;
		  bottom: 0;
		  left: 0;
		  width: 100%;
		  /* solid for the bottom ~60px, then fade over the top ~40px */
		  background: linear-gradient(
		    to top,
		    rgba(35,35,35,0.98)   0%,    /* fully solid at very bottom */
		    rgba(35,35,35,0.98)  60px,   /* keep it solid until 60px up */
		    rgba(35,35,35,0)    100%     /* then fade to transparent by the top */
		  );
		  padding: 1.2rem 1rem 1.4rem;
		  display: flex;
		  justify-content: center;
		  z-index: 3000;
		}
  }
}

@media (min-width: 991px) {
  body.accounts-page .mobile-only {

  }

}

/* nav.css */
/* Base: mobile = pills in a column */
body.accounts-page #tabmenu .nav-pills {
  display: flex !important;
  flex-direction: column !important;
  gap: .75rem !important;
}

body.accounts-page #tabmenu .nav-pills .nav-link {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  border-radius: 50px !important;
  background: var(--mtm-tab-bg) !important;
  border: 2px solid var(--mtm-tab-border) !important;
  padding: .75rem 1rem !important;
  color: var(--mtm-tab-text) !important;
  font-weight: 600 !important;
}

body.accounts-page #tabmenu .nav-pills .nav-link:hover {
  background: var(--mtm-tab-hover-bg-pill) !important;
}

body.accounts-page #tabmenu .nav-pills .nav-link.active {
  border-color: var(--mtm-tab-active-border) !important;
  color: var(--mtm-tab-active-text) !important;
}

/* Desktop: switch to row + bottom-underline */
@media (min-width: 768px) {
  body.accounts-page #tabmenu .nav-pills {
    flex-direction: row !important;
    justify-content: center !important;
    border-bottom: 2px solid var(--mtm-tab-border) !important;
    gap: 2rem !important;
  }
  body.accounts-page #tabmenu .nav-pills .nav-link {
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: .5rem .9rem !important;
    width: auto !important;
    color: var(--mtm-tab-active-text) !important;
  }
  /* underline for the active link */
  body.accounts-page #tabmenu .nav-pills .nav-link.active::after {
    content: "" !important;
    position: absolute !important;
    bottom: -3px !important;
    left: 0 !important;
    right: 0 !important;
    height: 5px !important;
    background: var(--mtm-tab-underline) !important;
    border-radius: 2px !important;
  }
  body.accounts-page #tabmenu .nav-pills .nav-link:hover {
	  background: none !important;
	  color: var(--mtm-tab-hover-bg) !important;
	}
	body.accounts-page #tabmenu .nav-pills .nav-link.active {
		color: var(--mtm-tab-hover-bg) !important;
	}
}