<?php

include_once 'casafari.class.php';

//$client_url = 'https://crmapi.proppydev.com';
//$client_secret = 'ZXh0ZXJuYWxkZXY6Rml0aDVmQmRmZ3NkeEhWTUF4aXpkNW9yNjhn';
$client_url = 'https://crmapi.casafaricrm.com';
$client_secret = 'dGVuIEhvb3BlbiAtIENyZWF0aW9uIE1lZGlhOnRlbkhvb3BlbjIwMjQq';

$casafari_api = new CasafariAPI($client_url, $client_secret);

$orderby = $_GET['orderby'] ? $_GET['orderby'] : 'DateDesc';
if ($orderby == 'Sold') $orderby = 'DateDesc';
$sold = $_GET['orderby'] && $_GET['orderby'] == 'Sold' ? true : false;
if ($orderby == 'Exclusive') $orderby = 'DateDesc';
$exclusive = $_GET['orderby'] && $_GET['orderby'] == 'Exclusive' ? true : false;

$page = !empty($_GET['pg']) ? (int) $_GET['pg'] : 1;

$params = [
    'PropertyIncludes' => [
        'IncludeFeatures' => true,
        'IncludeBrokers' => true,
        'IncludeAgency' => true,
        'UseHtmlDescription' => false
    ],
    'PropertyId' => ($_GET['id'] ?: null),
    'Reference' => ($_GET['reference'] ?: null),
    'BusinessTypeIds' => [
        'Sale'
    ],
    'PropertyTypeIds' => ($_GET['type'] ? [$_GET['type']] : []),
    'PriceFrom' => ($_GET['price_from'] ?: null),
    'PriceTo' => ($_GET['price_to'] ?: null),
    'MinBedrooms' => ($_GET['bedrooms'] == 'Studio' ? null : $_GET['bedrooms']),
    'MaxBedrooms' => ($_GET['bedrooms'] != 6 ? ($_GET['bedrooms'] == 'Studio' ? 0 : $_GET['bedrooms']) : null),
    'HasExclusive' => $exclusive ? true : null,
    'PropertyListSorts' => [
        'SortBy' => $orderby
    ],
    'InnertLocations' => [
        'RegionIds' => [],
        'CityIds' => ($_GET['location'] ? [$_GET['location']] : []),
        'LocalityIds' => [],
        'Zonenames' => []
    ],
    'CorrelationId' => 'string',
    'EchoToken' => 'string',
    'PrimaryLangId' => 0,
    'RetransmissionIndicator' => true,
    'TimeStamp' => 'string',
    'Version' => 0,
    'Lang' => 'pt',
    'Sold' => $sold ? true : ($exclusive ? false : null),
    'Active' => true,
    'VisibleOnWebsite' => true,
    'SequenceNmbr' => $sold ? 1 : $page,
    'MaxResponses' => $sold ? 100 : 12
];

$properties_json = $casafari_api->getProperties($params);
$totalproperties = $properties_json->Count;

$properties = $properties_json->PropertyList;
if($sold) {
    //Get Sold Properties Active Not Visible on Website
    $params['Active'] = true;
    $params['VisibleOnWebsite'] = false;
    $params['SequenceNmbr'] = 1;
    $properties_json = $casafari_api->getProperties($params);
    $totalproperties += $properties_json->Count;
    $properties = array_merge($properties, $properties_json->PropertyList);
    //Get Sold Properties Inactive Visible on Website
    $params['Active'] = false;
    $params['VisibleOnWebsite'] = true;
    $params['SequenceNmbr'] = 1;
    $properties_json = $casafari_api->getProperties($params);
    $totalproperties += $properties_json->Count;
    $properties = array_merge($properties, $properties_json->PropertyList);
    //Get Sold Properties Inactive Not Visible on Website
    $params['Active'] = false;
    $params['VisibleOnWebsite'] = false;
    $params['SequenceNmbr'] = 1;
    $properties_json = $casafari_api->getProperties($params);
    $totalproperties += $properties_json->Count;
    $properties = array_merge($properties, $properties_json->PropertyList);
}

$total = $totalproperties; //total items in array    
$limit = 12; //per page    
$totalPages = ceil($total / $limit); //calculate total pages
$page = max($page, 1); //get 1 page when $_GET['page'] <= 0
$page = min($page, $totalPages); //get last page when $_GET['page'] > $totalPages
$offset = ($page - 1) * $limit;
if ($offset < 0) $offset = 0;

$link = '/properties/?type=' . $_GET['type'] . '&location=' . $_GET['location'] . '&reference=' . $_GET['reference'] . '&price_from=' . $_GET['price_from'] . '&price_to=' . $_GET['price_to'] . '&bedrooms=' . $_GET['bedrooms'] . '&orderby=' . $_GET['orderby'] . '&pg=%d';
$pagerContainer = '<div style="width: 100%;text-align: center;margin-top: 50px;">';
if ($totalPages != 0) {
    if ($page == 1) {
        $pagerContainer .= '';
    } else {
        $pagerContainer .= sprintf('<a href="' . $link . '" style="color: #192A67"> &#171; Prev Page</a>', $page - 1);
    }
    $pagerContainer .= ' &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span> Page <strong>' . $page . '</strong> of ' . $totalPages . '</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;';
    if ($page == $totalPages) {
        $pagerContainer .= '';
    } else {
        $pagerContainer .= sprintf('<a href="' . $link . '" style="color: #192A67"> Next Page &#187; </a>', $page + 1);
    }
}
$pagerContainer .= '</div>';

if($sold) $properties = array_slice($properties, $offset, $limit);

//header('Content-type: application/json; charset=utf-8');
//echo json_encode($properties);
//echo '<pre>'.print_r($properties_json, true).'</pre>';
//echo '<pre>'.print_r($totalproperties, true).'</pre>';

?>

<section class="elementor-section elementor-top-section elementor-element elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-element_type="section" style="margin-top: 20px;">
    <div class="elementor-container elementor-column-gap-default">
        <div class="elementor-column elementor-col-80 elementor-top-column elementor-element" data-element_type="column">
        </div>
        <div class="elementor-column elementor-col-20 elementor-top-column elementor-element" data-element_type="column" style="padding:10px;">
                <div class="select-caret-down-wrapper" style="    font-size: 11px;
    inset-inline-end: 20px;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);">
                    <i aria-hidden="true" class="eicon-caret-down"></i>
                </div>
                <select name="orderby" id="orderby" class="elementor-field-textual elementor-size-sm" onchange="updateform()" style="
    box-sizing: border-box;

    width: 100%;
    max-width: 100%;
    border: 1px solid #69727d;
    background-color: transparent;
    color: #1f2124;
    vertical-align: middle;
    flex-grow: 1;
    
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: inherit;
    font-size: inherit;
    font-family: inherit;
    font-weight: inherit;
    font-style: inherit;
    text-transform: inherit;
    letter-spacing: inherit;
    line-height: inherit;
    flex-basis: 100%;
    padding-inline-end: 20px;

    background-color: #fff;
    border-width: 0;
    border-radius: 0;">
                    <option value="" <?php if ($_GET['orderby'] == '') echo 'selected'; ?>>Ordenar por</option>
                    <option value="DateDesc" <?php if ($_GET['orderby'] == 'DateDesc') echo 'selected'; ?>>Recentes Primeiro</option>
                    <option value="DateAsc" <?php if ($_GET['orderby'] == 'DateAsc') echo 'selected'; ?>>Antigas Primeiro</option>
                    <option value="Sold" <?php if ($_GET['orderby'] == 'Sold') echo 'selected'; ?>>Vendidas</option>
                    <option value="Exclusive" <?php if ($_GET['orderby'] == 'Exclusive') echo 'selected'; ?>>Exclusivas</option>
                    <option value="PriceDesc" <?php if ($_GET['orderby'] == 'PriceDesc') echo 'selected'; ?>>Preço Mais Alto para Mais Baixo</option>
                    <option value="PriceAsc" <?php if ($_GET['orderby'] == 'PriceAsc') echo 'selected'; ?>>Preço Mais Baixo para Mais Alto</option>
                </select>
            </div>


    </div>
</section>

<section class="elementor-section elementor-top-section elementor-element elementor-element-df25517 elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="df25517" data-element_type="section">
    <div class="elementor-container elementor-column-gap-default">
        <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-f49faa6" data-id="f49faa6" data-element_type="column">
            <div class="elementor-widget-wrap elementor-element-populated">
                <section class="elementor-section elementor-inner-section elementor-element elementor-element-3bd87ab elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="3bd87ab" data-element_type="section">
                    <?php
                    //echo count($properties);
                    $count = 0;
                    foreach ($properties as $property) {
                        $label = '';
                        if (isset($property->locale[0]) && isset($property->locale[0]->labels[0]) && $property->locale[0]->labels[0]) $label = '<span style="background-color: ' . $property->locale[0]->labels[0]->backgroundColor . ';color: white;padding:3px 10px;position:absolute;top: 15px;z-index:1;">' . $property->locale[0]->labels[0]->text . '</span>';
                        if($exclusive) $label = '<span style="background-color:#210f5e;color: white;padding:3px 10px;position:absolute;top: 15px;z-index:1;">Exclusivo</span>';
                        if($sold) $label = '<span style="background-color:#d81010;color: white;padding:3px 10px;position:absolute;top: 15px;z-index:1;">Vendido</span>';
                        if ($count % 3 == 0) {
                            echo '</div></section><section class="section class="elementor-section elementor-inner-section elementor-element elementor-element-3bd87ab elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="3bd87ab" data-element_type="section"><div class="elementor-container elementor-column-gap-default">';
                        }
                        //echo '<pre>'.print_r($property, true).'</pre>';
                    ?>
                        <div class="elementor-column elementor-col-33 elementor-inner-column elementor-element elementor-element-b8c945d" data-id="b8c945d" data-element_type="column">
                            <div class="elementor-widget-wrap elementor-element-populated">
                                <div class="elementor-element elementor-element-0cc08ff elementor-pagination-position-inside elementor-invisible elementor-widget elementor-widget-image-carousel" data-id="0cc08ff" data-element_type="widget" data-settings="{&quot;slides_to_show&quot;:&quot;1&quot;,&quot;navigation&quot;:&quot;dots&quot;,&quot;autoplay&quot;:&quot;no&quot;,&quot;_animation&quot;:&quot;slideInUp&quot;,&quot;infinite&quot;:&quot;yes&quot;,&quot;effect&quot;:&quot;slide&quot;,&quot;speed&quot;:500}" data-widget_type="image-carousel.default">
                                    <div class="elementor-widget-container">
                                        <div class="elementor-image-carousel-wrapper swiper" dir="ltr">
                                            <div class="elementor-image-carousel swiper-wrapper swiper-image-stretch" aria-live="polite">
                                                <?php for ($i = 0; $i < 3; $i++) { ?>
                                                    <div class="swiper-slide" role="group" aria-roledescription="slide" aria-label="<?php echo $i; ?> of 3"><a data-elementor-open-lightbox="yes" data-elementor-lightbox-slideshow="0cc08ff" data-elementor-lightbox-title="property-1" data-e-action-hash="#elementor-action%3Aaction%3Dlightbox%26settings%3DeyJpZCI6OTcsInVybCI6Imh0dHBzOlwvXC9uZXcudGVuaG9vcGVucmVhbHR5LmNvbVwvd3AtY29udGVudFwvdXBsb2Fkc1wvMjAyM1wvMDhcL3Byb3BlcnR5LTEuanBnIiwic2xpZGVzaG93IjoiMGNjMDhmZiJ9" href="https://new.tenhoopenrealty.com/pt/property-details-pt?reference=<?php echo $property->reference; ?>&property_id=<?php echo $property->id; ?>" class="elementor-lightbox-link">
                                                            <figure class="swiper-slide-inner"><img decoding="async" class="swiper-slide-image" src="<?php echo $property->photos[$i]->Url; ?>" alt="property-1" style="height:200px;" /></figure>
                                                        </a></div>
                                                <?php } ?>
                                            </div>

                                            <div class="swiper-pagination"></div>
                                        </div>
                                        <?php echo $label; ?>
                                    </div>
                                </div>
                                <div class="elementor-element elementor-element-5a95e1a elementor-invisible elementor-widget elementor-widget-heading" data-id="5a95e1a" data-element_type="widget" data-settings="{&quot;_animation&quot;:&quot;slideInUp&quot;,&quot;_animation_delay&quot;:200}" data-widget_type="heading.default">
                                    <div class="elementor-widget-container">
                                        <span class="elementor-heading-title elementor-size-default"><a href="https://new.tenhoopenrealty.com/pt/property-details-pt?reference=<?php echo $property->reference; ?>&property_id=<?php echo $property->id; ?>"><?php echo $property->price ? number_format($property->price, 0, ',', ' ') . ' ' . $property->currency : 'P. O. A.'; ?></a></span>
                                    </div>
                                </div>
                                <div class="elementor-element elementor-element-de40227 elementor-invisible elementor-widget elementor-widget-heading" data-id="de40227" data-element_type="widget" data-settings="{&quot;_animation&quot;:&quot;slideInUp&quot;,&quot;_animation_delay&quot;:300}" data-widget_type="heading.default">
                                    <div class="elementor-widget-container">
                                        <span class="elementor-heading-title elementor-size-default"><a href="https://new.tenhoopenrealty.com/pt/property-details-pt?reference=<?php echo $property->reference; ?>&property_id='<?php echo $property->id; ?>"><?php echo $property->reference . ' - ' . $property->location->zone . ', ' . $property->location->City; ?></a></span>
                                    </div>
                                </div>
                                <div class="elementor-element elementor-element-9c44974 elementor-icon-list--layout-inline elementor-align-center elementor-list-item-link-full_width elementor-invisible elementor-widget elementor-widget-icon-list" data-id="9c44974" data-element_type="widget" data-settings="{&quot;_animation&quot;:&quot;slideInUp&quot;,&quot;_animation_delay&quot;:500}" data-widget_type="icon-list.default">
                                    <div class="elementor-widget-container">
                                        <ul class="elementor-icon-list-items elementor-inline-items">
                                            <li class="elementor-icon-list-item elementor-inline-item">
                                                <span class="elementor-icon-list-icon">
                                                    <svg xmlns="http://www.w3.org/2000/svg" width="34.479" height="24.467" viewBox="0 0 34.479 24.467">
                                                        <path id="Path_29" data-name="Path 29" d="M-11.578-6.363c.111.005.179.01.246.011.768.011.866.112.866.894q0,.869,0,1.738c0,.529-.176.7-.707.7h-.4c0,.713,0,1.394,0,2.074,0,.529-.177.7-.706.705q-.713,0-1.425,0c-.405,0-.567-.125-.653-.518-.141-.655-.287-1.309-.4-1.969-.04-.238-.13-.3-.356-.3-1.621.008-3.243,0-4.864,0h-20.6c-.135.665-.274,1.318-.4,1.973-.14.736-.219.807-.978.807-.416,0-.834,0-1.25,0a.545.545,0,0,1-.619-.616c0-.705,0-1.411,0-2.163-.2,0-.379.007-.56,0a.522.522,0,0,1-.549-.545q-.014-1.111,0-2.223a.526.526,0,0,1,.565-.563c.171-.007.341,0,.544,0V-7.765q0-1.46,0-2.919A2.238,2.238,0,0,1-41.6-13.041v-.4q0-4.482,0-8.964a2.2,2.2,0,0,1,2.286-2.3h23.244a2.2,2.2,0,0,1,2.271,2.28q0,4.482,0,8.964v.4a2.267,2.267,0,0,1,2.179,1.8,2.531,2.531,0,0,1,.044.552c0,1.434,0,2.869,0,4.34m-3.336-6.669v-.373q0-4.431,0-8.861a1.167,1.167,0,0,0-1.321-1.324H-39.17a1.167,1.167,0,0,0-1.323,1.321q0,4.431,0,8.861v.367h1.113c0-.731,0-1.446,0-2.161a2.2,2.2,0,0,1,2.281-2.27c2.154,0,4.31.036,6.463-.013a2.3,2.3,0,0,1,2.383,2.4c-.041.677-.007,1.359-.007,2.039h1.113c0-.753,0-1.482,0-2.21a2.2,2.2,0,0,1,2.2-2.212q3.354-.007,6.707,0a2.2,2.2,0,0,1,2.214,2.2c0,.649,0,1.3,0,1.947,0,.1.013.2.02.3Zm-27.8,6.658H-12.69v-4.151c0-.977-.413-1.388-1.4-1.388H-41.321c-.1,0-.209,0-.313,0a1.1,1.1,0,0,0-1.075,1.071c-.021,1.48-.007,2.961-.007,4.465m-1.1,2.224H-11.6V-5.223H-43.813Zm14.431-8.892c0-.788.034-1.561-.011-2.33a1.055,1.055,0,0,0-1.077-.983q-3.35-.019-6.7,0a1.058,1.058,0,0,0-1.079.982c-.045.769-.011,1.543-.011,2.331Zm12.243,0c0-.765.016-1.493-.005-2.22a1.1,1.1,0,0,0-1.115-1.1q-3.332-.018-6.664,0a1.019,1.019,0,0,0-1.067.9c-.061.8-.016,1.606-.016,2.414ZM-42.7-1.348a2.558,2.558,0,0,0,.445-.007c.082-.016.2-.086.217-.152.111-.491.2-.986.3-1.488H-42.7Zm29.989-.008V-2.994h-.95c.087.431.2.833.241,1.244.037.346.186.461.511.4a1.779,1.779,0,0,1,.2-.01" transform="translate(44.944 24.702)" fill="#b49968"></path>
                                                    </svg> </span>
                                                <span class="elementor-icon-list-text"><?php echo $property->bedrooms; ?></span>
                                            </li>
                                            <li class="elementor-icon-list-item elementor-inline-item">
                                                <span class="elementor-icon-list-icon">
                                                    <svg xmlns="http://www.w3.org/2000/svg" width="34.548" height="23.62" viewBox="0 0 34.548 23.62">
                                                        <g id="Group_19" data-name="Group 19" transform="translate(0)">
                                                            <path id="Path_30" data-name="Path 30" d="M-9.055-7.31l1.419,1.482a.541.541,0,0,1,.151.684.846.846,0,0,1-.508.384.88.88,0,0,1-.594-.257c-.681-.633-1.33-1.3-2.008-1.939a.814.814,0,0,0-.5-.213q-6.79-.017-13.58,0a.762.762,0,0,0-.471.2c-.685.646-1.344,1.32-2.033,1.963a.836.836,0,0,1-.563.25.865.865,0,0,1-.525-.367.53.53,0,0,1,.134-.687q.609-.609,1.23-1.207a3.44,3.44,0,0,1,.3-.229c-.583-.2-1.111-.341-1.6-.561a7.543,7.543,0,0,1-4.347-5.271c-.821-3.122-1.653-6.242-2.532-9.349a1.433,1.433,0,0,1,1.42-1.869q15.3.035,30.606.014h.468A14.524,14.524,0,0,0-2.6-26.01a1.3,1.3,0,0,0-1.332-1.109c-.736,0-1.471.007-2.206.014-.021,0-.041.016-.1.041,0,.255.007.528,0,.8a.673.673,0,0,1-.633.722.668.668,0,0,1-.638-.716c-.011-.471-.014-.943,0-1.414a.623.623,0,0,1,.693-.679c1.09-.005,2.184-.06,3.269.013a2.515,2.515,0,0,1,2.217,2.354c.025.528.005,1.057.024,1.585a.514.514,0,0,0,.143.348,1.4,1.4,0,0,1,.494,1.6c-.67,2.452-1.323,4.909-1.995,7.361a30.322,30.322,0,0,1-.952,3.225,7.254,7.254,0,0,1-5.14,4.478l-.3.079M-33-19.658c.028.123.049.222.075.32.562,2.089,1.116,4.18,1.688,6.267a6.248,6.248,0,0,0,6.1,4.649q7.288,0,14.576,0a6.21,6.21,0,0,0,6-4.5c.55-1.938,1.06-3.886,1.587-5.831.079-.292.151-.586.234-.9H-17.993v.385c0,1.321.009,2.643,0,3.964a2.221,2.221,0,0,1-2.367,2.337c-2.171,0-4.343-.035-6.512.014a2.339,2.339,0,0,1-2.44-2.437c.024-1.3.005-2.6.005-3.895v-.365Zm4.989-3.362a1.532,1.532,0,0,0-.022.168c0,2.526-.006,5.053,0,7.579a.99.99,0,0,0,1.128,1.053q3.255,0,6.51,0a1.019,1.019,0,0,0,1.144-1.145q0-3.651,0-7.3c0-.112-.01-.223-.016-.352Zm25.626,2.053c.1-.343.192-.672.28-1s.169-.654.265-1.033h-16.12v2.034ZM-29.325-23h-4.594c.19.706.367,1.365.543,2.02h4.05Z" transform="translate(35.148 28.374)" fill="#b49968"></path>
                                                        </g>
                                                    </svg> </span>
                                                <span class="elementor-icon-list-text"><?php echo $property->bathrooms; ?></span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    <?php
                        $count++;
                    }
                    ?>
                </section>
            </div>
        </div>
    </div>
</section>

<?php echo $pagerContainer; ?>

<section class="elementor-section elementor-top-section elementor-element elementor-element-838dc62  custdiv elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="838dc62" id="custom-form" data-element_type="section">
						<div class="elementor-container elementor-column-gap-default">
					<div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-2404cff" data-id="2404cff" data-element_type="column">
			<div class="elementor-widget-wrap elementor-element-populated">
						<div class="elementor-element elementor-element-386e853 elementor-widget-divider--view-line elementor-widget elementor-widget-divider" data-id="386e853" data-element_type="widget" data-widget_type="divider.default">
				<div class="elementor-widget-container">
							<div class="elementor-divider">
			<span class="elementor-divider-separator">
						</span>
		</div>
						</div>
				</div>
					</div>
		</div>
					</div>
		</section>
<section class="elementor-section elementor-top-section elementor-element elementor-element-307a836d elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="7b0109e0"  data-element_type="section">
					<div class="elementor-container elementor-column-gap-default">
		<div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-7b0109e0" data-id="7b0109e0" data-element_type="column">
			<div class="elementor-widget-wrap elementor-element-populated">
				<div class="elementor-element elementor-element-7b0109e0 elementor-widget elementor-widget-heading animated fadeInUp custtitle" data-id="7b0109e0" data-element_type="widget" data-settings="{&quot;_animation&quot;:&quot;fadeInUp&quot;}" data-widget_type="heading.default">
					<div class="elementor-widget-container">
						<h3 class="elementor-heading-title elementor-size-default">ENQUIRE</h3>
					</div>
						<div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-contact-form-column">
							<div class="elementor-widget-wrap elementor-element-populated">
								<?php
								$wp_path = dirname(__FILE__) . '/../'; 
								require_once($wp_path . 'wp-load.php');
								
								if (class_exists('\Elementor\Plugin')) {
									$contact_form_id = 4261; // Your contact form template ID
									echo \Elementor\Plugin::instance()->frontend->get_builder_content_for_display($contact_form_id, true);
								}
								?>
							</div>
						</div>
				</div>
			</div>
		</div>
	</section>

<a class="floating-button" href="#custom-form">
CONTACTAR AGORA
</a>
<style>
  .floating-button {
    position: fixed;
    top: 45%;
    transform: translateY(-50%) rotate(270deg);
    padding: 10px 20px;
    background-color: #192A67;
    color: white;
    font-weight: 600;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 14px;
    border-radius: 0;
    box-shadow: -2px 2px 5px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    white-space: nowrap;
}
.floating-button:hover{
    color: #fff !important;
}
.custtitle .elementor-heading-title {
    font-family: "Bulter", Sans-serif !important;
    font-weight: 500 !important;
    margin-bottom: 20px;
}
.floating-button {
    right: -50px;
}

@media (max-width: 767px) {
    .floating-button {
        right: -45px;
    }
}
</style>

<script>
    function updateform() {
        var orderby = document.getElementById('orderby').value;
        console.log(orderby);
        document.getElementById('form-field-orderby').value = orderby;
        document.getElementById('form-field-pg').value = '';
        document.getElementById('submitform').click();
    }
</script>