/* Variablat CSS - ngjyra, background, border */
:root { 
	--bg-primary: #588157; 
	--bg-secondary: #A3B18A; 
	--bg-third: #345e42; 
	--bg-light: #d8e8ba; 
	--bg-dark: #191919; 
	--bg-white: #fff; 
	--bg-black: #000; 
	--bg-grey: #F0F2F8; 
	--bg-stats: #344E41; 
	--text-primary: #588157; 
	--text-secondary: #A3B18A; 
	--text-white: #fff; 
	--text-black: #000; 
	--text-grey: #9c9c9c; 
	--border: #588157; 
	--button-primary: #345e42; 
	--button-secondary: #A3B18A; }

/* Container */
.container { width: 1100px; margin: 0 auto; }
.max-container { margin: 0 auto; max-width: 1100px; }
.mobile-container { max-width: 414px; margin: 0 auto; }

/* Clear */
.clear { clear: both !important; }

/* Display */
.block { display: block; }
.inline-block { display: inline-block; }
.hidden { display: none; }

/* Floats */
.float-left { float: left; }
.float-right { float: right; }
.left { float: left !important; }
.right { float: right !important; }
.clearfix::after { content: ""; display: table; clear: both; }

/* Backgrounds */
.bg-white { background: var(--bg-white); }
.bg-black { background: var(--bg-black); }
.bg-grey { background: var(--bg-grey); }
.bg-dark { background-color: var(--bg-dark); }
.bg-primary { background: var(--bg-primary); }
.bg-secondary { background: var(--bg-secondary); }
.bg-third { background: var(--bg-third); }
.bg-light { background: var(--bg-light); }

/* Colors */
.text-white { color: var(--text-white); }
.text-black { color: var(--text-black); }
.text-grey { color: var(--text-grey); }
.text-primary { color: var(--text-primary); }
.text-secondary { color: var(--text-secondary); }

/* Borders */
.border-1 { border: 1px solid var(--border); }
.border-2 { border: 2px solid var(--border); }
.border-3 { border: 3px solid var(--border); }
.border-4 { border: 4px solid var(--border); }
.border-5 { border: 5px solid var(--border); }
.border-t { border-top: 1px solid var(--border); }
.border-b { border-bottom: 1px solid var(--border); }
.border-l { border-left: 1px solid var(--border); }
.border-r { border-right: 1px solid var(--border); }
.border-b-2 { border: 2px solid var(--border); }

/* Border Radius */
.border-radius-0 { border-radius: 0px; }
.border-radius-2 { border-radius: 2px; }
.border-radius-3 { border-radius: 3px; }
.border-radius-4 { border-radius: 4px; }
.border-radius-5 { border-radius: 5px; }
.border-radius-6 { border-radius: 6px; }
.border-radius-7 { border-radius: 7px; }
.border-radius-8 { border-radius: 8px; }
.border-radius-9 { border-radius: 9px; }
.border-radius-10 { border-radius: 10px; }
.border-bottom-left-radius-10 { border-bottom-left-radius: 10px; }
.border-bottom-right-radius-10 { border-bottom-right-radius: 10px; }
.border-radius-100 { border-radius: 100px; }

/* Padding */
.p-5 { padding: 5px; }
.p-10 { padding: 10px; }
.p-12 { padding: 12px; }
.p-15 { padding: 15px; }
.p-20 { padding: 20px; }
.p-30 { padding: 30px; }
.pt-5 { padding-top: 5px; }
.pt-10 { padding-top: 10px; }
.pt-15 { padding-top: 15px; }
.pt-20 { padding-top: 20px; }
.pt-30 { padding-top: 30px; }
.pt-50 { padding-top: 50px; }
.pb-5 { padding-bottom: 5px; }
.pb-10 { padding-bottom: 10px; }
.pb-15 { padding-bottom: 15px; }
.pb-20 { padding-bottom: 20px; }
.pb-30 { padding-bottom: 30px; }
.pb-50 { padding-bottom: 50px; }
.pl-5 { padding-left: 5px; }
.pl-10 { padding-left: 10px; }
.pl-12 { padding-left: 12px; }
.pl-20 { padding-left: 20px; }
.pr-5 { padding-right: 5px; }
.pr-10 { padding-right: 10px; }
.pr-12 { padding-right: 12px; }
.pr-20 { padding-right: 20px; }
.px-12 { padding-left: 12px; padding-right: 12px; }
.px-15 { padding-left: 15px; padding-right: 15px; }
.px-20 { padding-left: 20px; padding-right: 20px; }
.py-5 { padding-top: 5px; padding-bottom: 5px; }
.py-12 { padding-top: 12px; padding-bottom: 12px; }

/* Margin */
.m-5 { margin: 5px; }
.m-10 { margin: 10px; }
.m-20 { margin: 20px; }
.mt-5 { margin-top: 5px; }
.mt-10 { margin-top: 10px; }
.mt-20 { margin-top: 20px; }
.mt-30 { margin-top: 30px; }
.mb-5 { margin-bottom: 5px; }
.mb-10 { margin-bottom: 10px; }
.mb-20 { margin-bottom: 20px; }
.mb-30 { margin-bottom: 30px; }
.ml-5 { margin-left: 5px; }
.ml-10 { margin-left: 10px; }
.ml-20 { margin-left: 20px; }
.mr-5 { margin-right: 5px; }
.mr-10 { margin-right: 10px; }
.mr-20 { margin-right: 20px; }
.mb-1 { margin-bottom: 1px; }
.mt-1 { margin-top: 1px; }

/* Text Alignment */
.text-left { text-align: left; }
.text-center, .center { text-align: center; }
.text-right { text-align: right; }

/* Text Size */
.text-uppercase { text-transform: uppercase; }
.text-10 { font-size: 10px; }
.text-12 { font-size: 12px; }
.text-14 { font-size: 14px; }
.text-16 { font-size: 16px; }
.text-18 { font-size: 18px; }
.text-20 { font-size: 20px; }
.text-22 { font-size: 22px; }
.text-24 { font-size: 24px; }
.text-26 { font-size: 26px; }
.text-28 { font-size: 28px; }
.text-30 { font-size: 30px; }
.text-32 { font-size: 32px; }
.text-34 { font-size: 34px; }
.text-36 { font-size: 34px; }
.text-38 { font-size: 36px; }

/* Font Weight */
.weight-100 { font-weight: 100; }
.weight-200 { font-weight: 200; }
.weight-300 { font-weight: 300; }
.weight-400 { font-weight: 400; }
.weight-500 { font-weight: 500; }
.weight-600 { font-weight: 600; }
.weight-700 { font-weight: 700; }
.weight-800 { font-weight: 800; }
.weight-900 { font-weight: 900; }

/* White Space */
.space-nowrap { white-space: nowrap; }

/* Flexbox */
.flex { display: flex; }
.flex-row { flex-direction: row; }
.flex-col { flex-direction: column; }
.justify-start { justify-content: flex-start; }
.justify-items-center { justify-items: center; }
.justify-center { justify-content: center; }
.justify-end { justify-content: flex-end; }
.justify-between { justify-content: space-between; }
.items-start { align-items: flex-start; }
.items-center { align-items: center; }
.items-end { align-items: flex-end; }
.items-stretch { align-items: stretch; }
.items-baseline { align-items: baseline; }
.mx-auto { margin-left: auto; margin-right: auto; }

/* Grid */
.grid { display: grid; }
.grid-cols-1 { grid-template-columns: repeat(1, 1fr); }
.grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
.grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
.grid-cols-4 { grid-template-columns: repeat(4, 1fr); }
.gap-5 { gap: 5px; }
.gap-8 { gap: 8px; }
.gap-10 { gap: 10px; }
.gap-15 { gap: 15px; }
.gap-20 { gap: 20px; }
.gap-30 { gap: 30px; }
.align-space-between { align-content: space-between; }

/* Positioning */
.relative { position: relative; }
.absolute { position: absolute; }
.fixed { position: fixed; }
.sticky { position: sticky; }
.top-0 { top: 0; }
.bottom-0 { bottom: 0; }
.left-0 { left: 0; }
.right-0 { right: 0; }

/* Overflow */
.overflow-auto { overflow: auto; }
.overflow-hidden { overflow: hidden; }
.overflow-x-scroll { overflow-x: scroll; }
.overflow-y-scroll { overflow-y: scroll; }
.transition-all { transition: all 0.3s ease; }
.transition-colors { transition: background-color 0.3s ease, color 0.3s ease; }
.transition-opacity { transition: opacity 0.3s ease; }

/* Cursor */
.cursor-pointer { cursor: pointer; }
.cursor-default { cursor: default; }
.cursor-not-allowed { cursor: not-allowed; }

/* Z-Index */
.z-10 { z-index: 10; }
.z-20 { z-index: 20; }
.z-30 { z-index: 30; }
.z-100 { z-index: 100; }
.z-999 { z-index: 999; }
.z-9999 { z-index: 9999; }
.z-99999 { z-index: 99999; }

/* Min-width */
.min-w-100 { min-width: 100px; }

/* Width & Height */
.width-full { width: 100%; }
.max-w-600 { max-width: 600px; margin-left: auto; margin-right: auto; }
.height-full { height: 100vh; }

/* Line Clamp */
.line-clamp-1 { display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.4; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.4; }
.line-clamp-4 { display: -webkit-box; -webkit-line-clamp: 4; line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.4; }
.line-clamp-5 { display: -webkit-box; -webkit-line-clamp: 5; line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.4; }

/* Dark Mode Switcher */
.wpnm-button-inner-left:before, .wpnm-button-inner-left:after { box-sizing: border-box; margin: 0; padding: 0; transition: .2s ease-in-out; outline: none; }
.wpnm-button .wpnm-button-inner-left:before { content: ''; display: block; position: absolute; z-index: 1; height: 20px; width: 20px; margin: 4px; border-radius: 100%; right: 22px; bottom: 0px; background: #FFB200; transform: rotate(-45deg); box-shadow: 0 0 .625em #fff; }
.wpnm-button .wpnm-button-inner-left:after { content: ''; display: inline-block; width: 50px; height: 28px; border-radius: 100px; background: rgba(255,255,255,0.15); vertical-align: middle; border: 2px solid var(--border); }
.wpnm-button { border: none; background: none; padding: 0; }
.dark-mode-active .wpnm-button-inner-left:before { right: 6px; box-shadow: 4px 4px 0 0 #eee; background: transparent; }
.dark-mode-active .wpnm-button-inner-left:after { background: #000; border: .125em solid var(--border); }
.dark-mode { background: #505050; }
.dark-mode .bg-white { background: #303030; color: #ececec; }
.dark-mode .bg-grey { background: #3e3e3e; color: #ececec; }
.dark-mode .bg-dark-mode { background: #505050; color: white; border: 1px solid var(--border); }
.dark-mode a, .dark-mode .text-black { color: white; }
.dark-mode .svg-icon { filter: brightness(0) saturate(100%) invert(1); }

/* Coming Soon - vetëm stilizimet unike (utilities: flex, p-20, m-20, border-radius-10, border-5, text-center, text-38, text-white, text-uppercase, text-24, relative, pt-20, pb-20, text-16 në HTML) */
.coming-soon-warpper { background: #d00000; }
.coming-soon-title { margin: 0; }
.coming-soon-domain { background: -webkit-gradient(linear, right top, left top, from(#ffffff00), color-stop(50%, #ab0000), to(#ffffff00)); background: linear-gradient(to left, #ffffff00 0%, #ab0000 50%, #ffffff00 100%); }
.coming-soon-domain:before { content: ''; position: absolute; top: 0; left: 0; height: 3px; width: 100%; background: -webkit-gradient(linear, right top, left top, from(rgba(255, 0, 0, 0)), color-stop(50%, #ab0000), to(rgba(255, 0, 0, 0))); background: linear-gradient(to left, rgba(255, 0, 0, 0) 0%, #ab0000 50%, rgba(255, 0, 0, 0) 100%); }
.coming-soon-domain:after { content: ''; position: absolute; bottom: 0; left: 0; height: 3px; width: 100%; background: -webkit-gradient(linear, right top, left top, from(rgba(255, 0, 0, 0)), color-stop(50%, #ab0000), to(rgba(255, 0, 0, 0))); background: linear-gradient(to left, rgba(255, 0, 0, 0) 0%, #ab0000 50%, rgba(255, 0, 0, 0) 100%); }
.coming-soon-paragraf { font-family: Arial, sans-serif; }

/* Booking - Hero & Layout (media queries) */
@media (max-width: 768px) { #themex-booking-hero .grid { grid-template-columns: 1fr; align-items: stretch; } }
.themex-booking-layout { display: grid; grid-template-columns: 300px 1fr; gap: 20px; }
@media (max-width: 768px) { .themex-booking-layout { grid-template-columns: 1fr; } }
@media (max-width: 414px) { .my-bookings-wrapper input[type="email"], .my-bookings-wrapper input[type="text"] { min-width: 0; box-sizing: border-box; } }
