/* ===================== VARIABLES ===================== */
@import url('https://fonts.googleapis.com/css2?family=Shantell+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Onest:wght@100..900&display=swap'); 
:root { --primary:#FFDF00; --secondary:#FFF8EB; --primary-font-family:"Shantell Sans", cursive; --mask-background-color:rgba(0,0,0,0.4); --placeholder:var(--gray); --white:#ffffff; --gray:#707070; --silver:#f7f7f7; --black:#000000; --green:#006300; --red:#bd0000; --blue:#387bbe; --orange:#FF7700; --inbound-price:var(--primary); --outbound-price:var(--silver) }
html,body { font-family:var(--primary-font-family); }
.onest-font { font-family: "Onest", sans-serif; }
.shantell-font { font-family: "Shantell Sans", cursive; }
/* ===================== HEADER ===================== */
#header-categories { white-space:nowrap; }
#header-categories div[type="button"]:hover + div { display:block; left:170px; height:fit-content; }
#header-categories:has(+ div:hover) { display:block; }
/* ===================== BUTTON ===================== */
.button-loader { animation:rotate 2s linear infinite; z-index:2; width:20px; height:20px; display:none; }
button.active,button.active:hover { color:var(--black); background-color:var(--primary); border:1px solid var(--primary); }
button.disabled,.button.disabled,button.disabled:hover, button.disabled.active { background: var(--silver)!important; color: rgba(0, 0, 0, 0.3)!important; cursor: not-allowed!important; border: var(--black); }
/* primary button */
.primary-button { display:flex; color:var(--black); background-color:var(--primary); border:1px solid var(--primary); }
.primary-button.activе, .primary-button:hover { color:var(--black); background-color:var(--primary); }
.primary-button:hover svg path { fill:var(--black); stroke:var(--black); }
.primary-button.active .button-loader { color:var(--primary); stroke-linecap:round; }
.primary-button.active .button-loader .path { stroke:var(--primary); }
.primary-button.active, .primary-button:hover {
    background-color: var(--white);
    color: var(--black);
    border-color: var(--primary);
}
.primary-button.inverted { display:flex; color:var(--black); background-color:var(--white); border:1px solid var(--primary); }
.primary-button.inverted.active, .primary-button.inverted:hover { color:var(--black); background-color:var(--primary); }
.primary-button.inverted:hover svg path { fill:var(--primary); stroke:var(--primary); }
.primary-button.inverted.active .button-loader { color:var(--black); stroke-linecap:round; }
.primary-button.inverted.active .button-loader .path { stroke:var(--black); }
/* secondary button  */
.secondary-button { display:flex; color:var(--black); background-color:var(--primary); border:1px solid var(--primary); }
.secondary-button.activе,.secondary-button:hover { color:var(--black); background-color:var(--white); }
.secondary-button:hover svg path { fill:var(--black); stroke:var(--black); }
.secondary-button.active .button-loader { color:var(--black); stroke-linecap:round; }
.secondary-button.active .button-loader .path { stroke:var(--black); }
.secondary-button.inverted { display:flex; color:var(--black); background-color:var(--white); border:1px solid var(--primary); }
.secondary-button.inverted.activе,.secondary-button.inverted:hover { color:var(--black); background-color:var(--primary); }
.secondary-button.inverted:hover svg path { fill:var(--black); stroke:var(--black); }
.secondary-button.inverted.active .button-loader { color:var(--black); stroke-linecap:round; }
.secondary-button.inverted.active .button-loader .path { stroke:var(--black); }
/* ===================== SLICK ===================== */
.index-vendors-carousel .slick-track { align-items: center; }
.slick-track { display:flex !important; padding-block: 10px; }
.slick-slide { margin:0 10px; height:inherit !important; }
.slick-dots { display:flex !important; flex-wrap:wrap; justify-content:center; align-items:center; list-style:none; padding:0; margin:10px 0 10px 0; }
.slick-dots li { display:inline-block; margin:0 4px; }
.slick-dots li button { font-size:0; border:none; background:transparent; padding:0; cursor:pointer; }
.slick-dots li button:before { content:''; display:block; width:7px; height:7px; background-color:var(--black); border-radius:50%; transition:background-color 0.3s ease,transform 0.3s ease; }
.slick-dots li.slick-active button:before { background-color:var(--orange); transform:scale(1.2); }
.review-slider .slick-track { margin-top: 80px; }
/* ===================== TABS ===================== */
.tab-button { position:relative; }
.tab-button.active { cursor:not-allowed; font-weight: bold; }
.tab-line-primary.active::before { content:""; background:var(--primary); position:absolute; top:-2.2rem; left:0; width:90%; height:0.5rem; border-radius:10px; }
/* ===================== ANIMATIONS ===================== */
@keyframes rotate {
 100% { transform: rotate(360deg); }
 }
@keyframes dash {
 0% { stroke-dasharray: 1,150; stroke-dashoffset: 0; }
50% { stroke-dasharray: 90,150; stroke-dashoffset: -35; }
100% { stroke-dasharray: 90,150; stroke-dashoffset: -124; }
 }
/* ===================== FORM ELEMENTS ===================== */
.range_container { position: relative; display: flex; flex-direction: column; }
.sliders_control { position: relative; min-height: 25px; }
.form_control { position: relative; color: var(--gray); }
.slider-wrapper { position: relative; }
/* Range Inputs */
input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:all;width:24px;height:24px;background-color:var(--primary);border-radius:50%;border: 2px solid var(--primary);box-shadow: none;}
input[type="range"]::-moz-range-thumb{-webkit-appearance:none;pointer-events:all;width:24px;height:24px;background-color:var(--primary);border-radius:50%;border: 2px solid var(--primary);box-shadow: none;}
input[type="range"]::-webkit-slider-thumb:hover{background:#f7f7f7;}
input[type="range"]::-webkit-slider-thumb:active{box-shadow:inset 0 0 3px var(--primary),0 0 9px var(--primary);-webkit-box-shadow:inset 0 0 3px var(--primary),0 0 9px var(--primary)}
input[type="range"] { -webkit-appearance: none; appearance: none; height: 2px; width: 100%; position: absolute; background-color: var(--gray); pointer-events: none; }
#fromSlider { height: 0; z-index: 1; }
input[type="range"]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;outline:none;position:absolute;margin:auto;top:0;bottom:0;background-color:transparent;pointer-events:none;}
/* Number Inputs */
input[type="number"] { width: 50px; height: 30px; font-size: 20px; border: none; }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { opacity: 1; }
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }
/* Checkboxes */
input[type="checkbox"] { accent-color: var(--primary); width: 20px; }
/* ===================== VALIDATION STATES ===================== */
.invalid { border-color: var(--red) !important; }
.valid { border-color: var(--green) !important; }
/* ===================== AUTOCOMPLETE & MENUS ===================== */
.ui-menu { width: 50%; overflow-x: hidden; box-shadow: rgba(0,0,0,0.2) 0px 0px 10px; background-color: var(--white) !important; position: relative; margin-top: 2rem; border-radius: 0.5rem; border-width: 1px; --tw-border-opacity: 1; border-color: var(--black); max-height: 200px; }
.ui-menu .ui-menu-item { padding: 0.5rem; cursor: pointer; }
.ui-menu .ui-menu-item:hover { background-color: var(--white); }
.ui-helper-hidden-accessible { display: none; }
.autocomplete-option.selected { border-color: var(--black); background-color: var(--white); color: var(--black); border-width: 2px; }
.autocomplete-option.selected span { font-weight: bold; }
#search-autocomplete-wrapper { position: absolute; top: 100%; background-color: var(--white); z-index: 1000; height: 70vh;max-height: fit-content; width: 100%; overflow-y: auto; display: none; }
.autocomplete-item { display: flex; padding: 1rem; gap: 1rem; align-items: center; cursor: pointer; border-bottom: 1px solid var(--black); }
.autocomplete-item:hover { background-color: var(--red); color: var(--white); border-color: 1px solid var(--red); }
/* ===================== COMPONENTS ===================== */
.client-address.selected { font-weight: 700; border-width: 2px; }
.variant-select:hover { background-color: var(--primary); border-color: var(--white); color: var(--black); cursor: pointer; }
.variant-select.active { border-color: var(--white); color: var(--black); }
.star { fill: var(--white); stroke: var(--primary); }
.star.active { fill: var(--primary); stroke: var(--primary); }
.index-vendors-carousel img { max-height: 60px; width: auto; }
/* ===================== DECORATIVE & LAYOUT ===================== */
.line-primary { position: relative; margin-bottom: 2rem; }
.line-primary:after { content: ""; background: var(--primary); position: absolute; bottom: -1rem; left: 0; width: 50%; height: 0.4rem; }
/* ===================== TABLES ===================== */
.details table { width: 100% !important; border: solid 1px var(--gray); font-size: 0.9em; }
.details table tr { border: solid 1px var(--gray); }
.details table td { padding: 5px; }
.details table tr td:last-child { text-align: left; min-width: 150px; font-weight: bold; }
/* ===================== POST CONTENT (VEditor output) ===================== */
/* Restore defaults removed by preflight so TinyMCE indent/outdent renders properly */
#post_content { line-height: 1.8; }
#post_content p { margin: 0 0 1rem 0; }
#post_content ul,
#post_content ol { list-style-position: outside; padding-left: 1.5rem; margin: 0 0 1rem 0; }
#post_content ul { list-style-type: disc; }
#post_content ol { list-style-type: decimal; }
#post_content ul ul { list-style-type: circle; padding-left: 1.25rem; }
#post_content ol ol { list-style-type: lower-alpha; padding-left: 1.25rem; }
#post_content li { margin: 0.25rem 0; }
#post_content blockquote { border-left: 4px solid var(--gray); padding-left: 1rem; margin: 1rem 0; }
/* TinyMCE Accordion */
#post_content details { margin: 0 0 1rem 0; padding: 0.5rem 0.75rem; border: 1px solid var(--gray); border-radius: 0.5rem; background: transparent; }
#post_content details > summary { font-weight: 600; cursor: pointer; }
/* Column rows built by the editor */
#post_content #col_droppable_row { column-gap: 1rem; row-gap: 1rem; }
/* Headings */
#post_content h1 { font-size: 1.75rem; font-weight: 700; margin: 0 0 1rem 0; }
#post_content h2 { font-size: 1.5rem; font-weight: 700; margin: 0 0 0.875rem 0; }
#post_content h3 { font-size: 1.25rem; font-weight: 700; margin: 0 0 0.75rem 0; }
#post_content h4 { font-size: 1.125rem; font-weight: 600; margin: 0 0 0.5rem 0; }
#post_content h5 { font-size: 1rem; font-weight: 600; margin: 0 0 0.5rem 0; }
#post_content h6 { font-size: 0.875rem; font-weight: 600; margin: 0 0 0.5rem 0; }
/* Links */
#post_content a { color: var(--secondary); text-decoration: underline; }
#post_content a:hover { color: var(--primary); }
/* Images and figures */
#post_content img { max-width: 100%; height: auto; }
#post_content figure { margin: 1rem 0; }
#post_content figcaption { text-align: center; font-size: 0.9em; color: #555; }
/* Alignment helpers TinyMCE may output */
#post_content .alignleft { float: left; margin: 0 1rem 1rem 0; }
#post_content .alignright { float: right; margin: 0 0 1rem 1rem; }
#post_content .aligncenter { display: block; margin: 1rem auto; text-align: center; }
#post_content::after { content: ''; display: table; clear: both; }
/* Tables from editor */
#post_content table { width: 100%; border-collapse: collapse; margin: 1rem 0; }
#post_content th,
#post_content td { border: 1px solid var(--gray); padding: 0.5rem; }
#post_content th { background: var(--silver); text-align: left; }
/* Code blocks */
#post_content code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono',
    monospace; background: #f5f5f5; padding: 0 0.25rem; border-radius: 4px; }
#post_content pre { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono',
    monospace; background: #f5f5f5; padding: 1rem; overflow-x: auto; border-radius: 6px; }
#post_content pre code { background: transparent; padding: 0; }
/* Horizontal rule */
#post_content hr { border: 0; border-top: 1px solid var(--gray); margin: 2rem 0; }
/* Definition lists */
#post_content dl { margin: 1rem 0; }
#post_content dt { font-weight: 600; }
#post_content dd { margin: 0 0 0.5rem 1rem; }
/* Superscript / subscript */
#post_content sup { vertical-align: super; font-size: 0.75em; }
#post_content sub { vertical-align: sub; font-size: 0.75em; }
/* Mark */
#post_content mark { background-color: #fff3a6; padding: 0 0.2em; }
/* Embedded media */
#post_content iframe,
#post_content video,
#post_content audio { max-width: 100%; }
