/*
Theme Name: SVH
Theme URI: https://www.svh.co.uk/
Author: George Iancu
Author URI: http://www.georgeiancu.co.uk
Description: Theme developed for SeederHeights, using a unique design, bespoke, full responsive for three devices.
Version: 1.0
License: GPL v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: svh

This theme, is licensed under the Private and can't be used in any other format or for any other website.
*/


/**********
*
* GLOBAL VARIABLES
*
***********/
html{ font-family: 'Montserrat', Arial;  }
body{ font-family: 'Montserrat', Arial;  }
body.page-id-78 {background-image: url("/wp-content/themes/svh/images/news-page-bg-image.png");background-position: bottom left;background-repeat: no-repeat; }


/** Container **/
:root {
    --container: 1600px;
}


/**********
*
* STRUCTURE
*
***********/
.container{ max-width: var(--container);margin: 0 auto;padding-left: 1rem;padding-right: 1rem; }


/**********
*
* FOOTER
*
***********/
body.home .footer-flower,
body.page-id-84 .footer-flower{ display: none; }


/**********
*
* WPCF7
*
***********/
.wpcf7-form{ }
.wpcf7-form label{width: 100%;}
.wpcf7-form label .wpcf7-form-control-wrap{width: 100%;display: block;}
.wpcf7-form label .wpcf7-form-control-wrap .wpcf7-form-control{width: 100%;border: 1px solid #B1B1B1;padding: 1%;}
.wpcf7-form .wpcf7-submit{font-family: "Montserrat", Sans-serif;font-weight: 500;color: var( --e-global-color-secondary );background: var( --e-global-color-accent );border: none;padding: 1% 2%;}

/**********
*
* ELEMENTOR FORM
*
***********/
.elementor-form{ }
.elementor-form label{width: 100%;}
.elementor-form .elementor-field{width: 100%;border: 1px solid #B1B1B1;padding: 1%;}
.elementor-form .elementor-field-type-submit button{font-family: "Montserrat", Sans-serif;font-weight: 500;color: var( --e-global-color-secondary );background: var( --e-global-color-accent );border: none;padding: 1% 2%;}

/**********
*
* ACF FORM
*
***********/
.acf-form{ }
.acf-form .acf-form-group{display: flex;gap: 2rem;justify-content: flex-start;align-items: flex-start;margin-bottom: 1rem;padding: 1rem 0;}
.acf-form .acf-form-group.isConditional{ display: none; }
.acf-form .acf-form-group label{width: 25%;min-width: 300px;font-weight: 500;margin: 0;/* margin-top: 0.75rem; */}
.acf-form .acf-form-group label .acf-form-control{ width: 100%;border: 1px solid #B1B1B1; padding: 1%; }
.acf-form .acf-form-group input:not([type='checkbox']),
.acf-form .acf-form-group select,
.acf-form .acf-form-group textarea{flex: 1;width: 100%;border: 1px solid #B1B1B1;padding: 1%;}
.acf-form .acf-form-group .acf-form-choice-group{flex: 1;display: flex;flex-wrap: wrap;gap: 0.5rem;}
.acf-form .acf-form-group .acf-form-choice-group .acf-form-choice-group-item{margin-bottom: 0.5rem;width: 45%;}
.acf-form .acf-form-group .instructions{display: block;font-weight: 600;margin-bottom: 0.5rem;}
.acf-form .acf-form-group .acf-form-field-wrapper{display: block;flex: 1;position: relative;}
.acf-form .acf-form-group .acf-form-field-wrapper .acf-form-field-group{ display: flex; gap: 1rem; align-items: center; }
.acf-form .acf-form-group .acf-form-field-wrapper .acf-form-field-group input[type='text']{ flex: 1; }
.acf-form .acf-form-submit{font-family: "Montserrat", Sans-serif;font-weight: 500;color: var( --e-global-color-secondary );background: var( --e-global-color-accent );border: none;padding: 1% 2%;}

.acf-form .passonoff{position: absolute;bottom: 0px;left: -44px;height: 45px;width: 46px;background: var( --e-global-color-accent );border: 1px solid #B1B1B1;border-right: 0;display: flex;align-items: center;justify-content: center;padding: 5px;cursor: pointer;}
.acf-form .passonoff svg{ width: 50%; }


/**********
*
* ELEMENTOR ELEMENTS RE-STYLE
*
***********/
div[data-elementor-type="wp-page"] .elementor-widget-container ul{padding-left: 33px;}
div[data-elementor-type="wp-page"] .elementor-widget-container ul li{margin-top: 10px;margin-bottom: 10px;}
img.alignleft{ float: left; margin: 20px; }
img.alignright{ float: right; margin: 20px; }


/**********
*
* LOGIN PAGE
*
***********/
#login.acf-form .acf-form-group{display: block;background: #fff5e8;padding: 1rem;border-radius: 10px;}
#login.acf-form .acf-form-group label{margin-bottom: 0.5rem;}
#login .orregisterlink{color: #4c3b41;margin: 1rem;font-weight: 600;}


/**********
*
* REGISTER PAGE
*
***********/
#register-volunteer.acf-form .acf-form-group .acf-form-choice-group{  }
#register-volunteer.acf-form .acf-form-group .acf-form-choice-group .acf-form-choice-group-item{width: 100%;display: flex;gap: 0.3rem;}
#register-volunteer.acf-form .acf-form-group .acf-form-choice-group .acf-form-choice-group-item .acf-form-control{ margin-right: 0.5rem; }
#register-volunteer.acf-form .acf-form-control::-webkit-input-placeholder { color: #ddd;}
#register-volunteer.acf-form .acf-form-control::-moz-placeholder { color: #ddd;}
#register-volunteer.acf-form .acf-form-control:-ms-input-placeholder { color: #ddd;}
#register-volunteer.acf-form .acf-form-control:-moz-placeholder { color: #ddd; }


/**********
*
* LOGIN POPUP
*
***********/
.login-button-container{position: relative !important;}
.login-button-container .login-button{ }
.login-button-container .login-button-popup{position: absolute;top: 45px;width: 450px;background: white;padding: 1rem;border: 3px solid #eb8d96;display: none;}
.login-button-container .login-button-popup p{display: flex;align-items: center;gap: 2rem;margin: 0.75rem 0;}
.login-button-container .login-button-popup p span{flex-basis: 60%;color: #00009b;line-height: 1.25;}
.login-button-container .login-button-popup p a{ flex: 1 1 50%; width: 100%; color: #221A42; font-weight: 600; }
.login-button-container .login-button-popup p a.volbtn{ background: var( --e-global-color-6e6ee34 ); }
.login-button-container .login-button-popup p a.orgbtn{ background: var( --e-global-color-accent ); }
.login-button-container .login-button-popup p a.registerlink{color: inherit;text-align: center;font-weight: 500;font-size: 0.85rem;}



/**********
*
* Volunteers Listing Page
*
***********/
.vroles-list-container{ }
.vroles-list-container .vroles-list-item{ display: flex;gap: 1rem;background-color: #FFDFB9;padding: 2rem;margin: 0.5rem 0;border: 2px solid #00009B;align-items: center; }
.vroles-list-container .vroles-list-item.featured{background-color: #F3D9E9;}
.vroles-list-container .vroles-list-item .vroles-list-item-col{font-size: 20px;font-weight: 300;color: #2E34B7;flex: 1;}
.vroles-list-container .vroles-list-item .vroles-list-item-title{font-size: 20px;font-weight: 600;color: #2E34B7;flex: 1;line-height: 1.2;}
.vroles-list-container .vroles-list-item .vroles-list-item-organisation{font-size: 20px;font-weight: 300;color: #2E34B7;flex-basis: 35%;}
.vroles-list-container .vroles-list-item .vroles-list-item-view{ }
.vroles-list-container .vroles-list-item .vroles-list-item-column{ padding-left: 0.5rem; padding-right: 0.5rem; }
.vroles-list-container .vroles-list-item .vroles-list-item-view a{background: white;color: black;padding: 1rem 2rem;font-size: 14px;font-weight: bold;}

.vroles-list-filter{margin-bottom: 2rem;}
.vroles-list-filter .quicksearch{border: 2px solid #00009B;padding: 2rem;display: flex;gap: 2rem;justify-content: space-between; align-items: center;}
.vroles-list-filter .quicksearch input[type="text"]{border: 2px solid #00009B;padding: 1.7rem 1rem;flex-basis: 50%; font-size: 22px;color: #2E34B7;font-weight: 600; }
.vroles-list-filter .quicksearch input[type="text"]::-webkit-input-placeholder { font-size: 18px;color: #2E34B7;font-weight: 600; }
.vroles-list-filter .quicksearch input[type="text"]::-moz-placeholder { font-size: 18px;color: #2E34B7;font-weight: 600; }
.vroles-list-filter .quicksearch input[type="text"]:-ms-input-placeholder { font-size: 18px;color: #2E34B7;font-weight: 600; }
.vroles-list-filter .quicksearch input[type="text"]:-moz-placeholder { font-size: 18px;color: #2E34B7;font-weight: 600; }
.vroles-list-filter .quicksearch button{background: #FFCE3D;color: black;padding: 1rem 2rem;font-size: 17px;font-weight: bold;border: none;}
.vroles-list-filter .quicksearch > div{ text-align: center; }
.vroles-list-filter .quicksearch a.advancedsearch-triggger{margin: 0.5rem 0 0 0;font-size: 18px;color: #2E34B7;font-weight: 600;display: block;}
.vroles-list-filter a.reset-filters{margin: 0.5rem 0 0 0;font-size: 18px;font-weight: 600;color: #2E34B7;display: block;}

.vroles-list-filter .advancedsearch{border: 2px solid #00009B;padding: 2rem;border-top: none; color: #2E34B7; display: none;}
.vroles-list-filter .advancedsearch h3{ margin-bottom: 1rem; }

.vroles-list-filter .advancedsearch .filterparent { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: 0px; grid-row-gap: 0px; }
.vroles-list-filter .advancedsearch .filterparent .div1 { grid-area: 1 / 1 / 2 / 2; }
.vroles-list-filter .advancedsearch .filterparent .div2 { grid-area: 2 / 1 / 3 / 2; }
.vroles-list-filter .advancedsearch .filterparent .div3 { grid-area: 1 / 2 / 3 / 5; }
.vroles-list-filter .advancedsearch .filterparent div label{ display: block; }
.vroles-list-filter .advancedsearch .filterparent .div3 .choices{ display: flex;flex-wrap: wrap;gap: 1rem; }
.vroles-list-filter .advancedsearch .filterparent .div3 .choices label{flex-basis: 31.5%;}

.vroles-pagination{text-align: center;display: flex;margin-top: 2rem;margin-bottom: 2rem;align-items: center;justify-content: center;gap: 10px;}
.vroles-pagination #prevBtn{border: none;padding: 1rem;font-family: "Montserrat", Sans-serif;font-size: 15px;font-weight: 700;line-height: 16px;letter-spacing: 0.19px;fill: #221A42;color: #221A42;background-color: #F9C83D;}
.vroles-pagination #nextBtn{border: none;padding: 1rem;font-family: "Montserrat", Sans-serif;font-size: 15px;font-weight: 700;line-height: 16px;letter-spacing: 0.19px;fill: #221A42;color: #221A42;background-color: #F9C83D;}
.vroles-pagination .pagination-buttons{display: flex;gap: 5px;}
.vroles-pagination .pagination-buttons .pageBtn{border: none;padding: 1rem;font-family: "Montserrat", Sans-serif;font-size: 15px;font-weight: 700;line-height: 16px;letter-spacing: 0.19px;fill: #221A42;color: #221A42;background-color: #F9C83D;}
.vroles-pagination .pagination-buttons .pageBtn:hover,
.vroles-pagination .pagination-buttons .pageBtn:focus{background: #2D2DBB;color: white;}


/**********
*
* Role details page
*
***********/
.role-detail-container{border: 2px solid #00009B;padding: 2rem;display: flex;gap: 4rem;}
.role-detail-container > div{  }

.role-detail-container > div:nth-child(1){width: 50%;}
.role-detail-container > div:nth-child(1) h1{font-size: 24px;color: #2E34B7;font-weight: 600;line-height: 1.2;}
.role-detail-container > div:nth-child(1) .role-description{margin-top: 3rem;}
.role-detail-container > div:nth-child(1) .role-role{background: #F0F0F0;padding: 2rem;border: none;margin-top: 2rem;margin-bottom: 2rem;}

.role-detail-container > div:nth-child(1) .role-when,
.role-detail-container > div:nth-child(1) .role-where,
.role-detail-container > div:nth-child(1) .role-requirements,
.role-detail-container > div:nth-child(1) .role-other,
.role-detail-container > div:nth-child(1) .role-closingdate,
.role-detail-container > div:nth-child(1) .role-whotocontact{margin: 0.5rem 0;padding-bottom: 1rem;}

.role-detail-container > div:nth-child(1) .role-when p,
.role-detail-container > div:nth-child(1) .role-where p,
.role-detail-container > div:nth-child(1) .role-requirements p,
.role-detail-container > div:nth-child(1) .role-other p,
.role-detail-container > div:nth-child(1) .role-closingdate p,
.role-detail-container > div:nth-child(1) .role-whotocontact p{ margin: 0; }

.role-detail-container > div:nth-child(1) .role-when{  }
.role-detail-container > div:nth-child(1) .role-where{  }
.role-detail-container > div:nth-child(1) .role-requirements{  }


.role-detail-container > div:nth-child(2){width: 50%;display: flex;flex-direction: column;flex-wrap: wrap;}
.role-detail-container > div:nth-child(2) h2{font-size: 24px;color: #2E34B7;font-weight: 500;line-height: 1.2;}
.role-detail-container > div:nth-child(2) .org-logo{height: auto;margin: 1rem 0;}
.role-detail-container > div:nth-child(2) .org-logo img{margin: 0;display: block;max-height: 200px;}
.role-detail-container > div:nth-child(2) .org-description{ margin: 1rem 0; }
.role-detail-container > div:nth-child(2) .org-type{ margin: 0.5rem 0; }
.role-detail-container > div:nth-child(2) .org-location{margin: 0.5rem 0 4rem 0;}

.role-detail-container > div:nth-child(2) .org-description p,
.role-detail-container > div:nth-child(2) .org-type p,
.role-detail-container > div:nth-child(2) .org-location p{ margin: 0; }

.role-detail-container > div:nth-child(2) .role-actions{margin-top: auto;}
.role-detail-container > div:nth-child(2) .role-actions .role-save{ display: block; border: 1px solid #FFCE3D; padding: 1rem; text-align: center; font-size: 21px; color: #000000; font-weight: bold; margin-top: 1rem; }
.role-detail-container > div:nth-child(2) .role-actions .role-question{ display: block; border: 1px solid #FFCE3D; padding: 1rem; text-align: center; font-size: 21px; color: #000000; font-weight: bold; margin-top: 1rem; }
.role-detail-container > div:nth-child(2) .role-actions .role-interested{display: block;padding: 1rem;text-align: center;font-size: 21px;color: #000000;font-weight: bold;margin-top: 1rem;background: #FFCE3D;}
.role-detail-container > div:nth-child(2) .role-actions .back-to-search{font-size: 21px;font-weight: bold;display: flex;align-items: center;justify-content: center;gap: 0.5rem;color: #2E34B7;margin-top: 2rem;}
.role-detail-container > div:nth-child(2) .role-actions .back-to-search svg{width: 30px;height: 30px;}


/** Password reset **/
.password-reset-request-container,
.password-reset-container{ text-align: center;padding: 10% 3rem;background-image: url(https://www.stockportvolunteerhub.org.uk/wp-content/uploads/2024/02/gradient.jpg);background-position: center center;background-repeat: no-repeat;background-size: cover;}
.password-reset-request-container .elementor-button,
.password-reset-container .elementor-button { font-family: "Montserrat", Sans-serif; font-size: 15px; font-weight: 700; line-height: 16px; letter-spacing: 0.19px; fill: #221A42; color: #221A42; background-color: #F9C83D; border-style: none; border-radius: 0px 0px 0px 0px; padding: 14.5px 25px 14.5px 25px; }