/*
 Theme Name:   TheFox Child
 Theme URI:    http://example.com/thefox-child
 Description:  TheFox Child Theme
 Author:       Your Name
 Author URI:   http://example.com
 Template:     thefox
 Version:      1.0.0
 Text Domain:  thefox-child
*/



/* sign up popup start */

.modal::-webkit-scrollbar {width: 3px;border-radius: 20px;}
.modal::-webkit-scrollbar-thumb {  background: #888888ab;}
  .modal {display: none; position: fixed;  z-index: 3;  left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); overflow-y: auto;overflow-x: hidden;}
 .modal-content {position: relative;max-width: 931px;background-color: #fefefe;margin: 0 auto;padding: 30px 24px; width: 90%;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); animation-name: modalopen;animation-duration: 0.4s; position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
 .sign-up-model .close{position: absolute;top: -10px;right: -10px;background-color:#F68D2B ;transition: .8s ease; color: #fff;height: 30px;width: 30px;font-size: 24px; border-radius: 100%;line-height: normal; text-align: center; display: flex;cursor: pointer; justify-content: center;align-items: center;}
  @keyframes modalopen {from { opacity: 0 } to { opacity: 1}}

.sign-up-model .sign-up-top-detail{text-align: center;}
.sign-up-model .sign-up-top-detail h2{font-size: 32px; line-height: 30px;font-weight: 700;color: #000;margin-top: 12px;margin-bottom: 15px;}
.sign-up-model .sign-up-top-detail p{ line-height: 21px;font-weight: 600;color: #000;    font-size: 14px;    margin-bottom: 10px;}
.sign-up-model .sign-up-top-detail p span{color: #FF0000;}

.sign-up-model .close:hover{transform: rotate(180deg);background-color: #00103e;}
.sign-up-model .communication-option select{appearance: auto; width: 100%;font-size: 14px; padding: 13px 17px;color: #000;font-weight: 400; border: 0.25px solid #242426;background-color: #33333314;}
.sign-up-model .communication-option label{font-size: 10px; font-weight: 700; line-height: 16px; }
.sign-up-model .communication-option label span{color: #FF0000;}
.sign-up-model  .communication-checkbox label{font-size: 14px;line-height: 26px;color: #000;font-weight: 400; }
.sign-up-model  .communication-checkbox label a{transition: .5s ease;}
.sign-up-model  .communication-checkbox label a:hover{color: #95d55a;}
.sign-up-model  .communication-checkbox label span{color:#FF0000;}
.sign-up-model .communication-checkbox label:after{ border-radius: 3px; border: 1px solid #B6B6B6;  content: "";  width: 12px;  height: 12px;  position: absolute;  left: 0px; top: 6px; }
.sign-up-model .communication-checkbox input{opacity: 0;position: absolute;}
.sign-up-model .communication-checkbox input:checked + label::after{background-color: #007BFF;border-color: #007BFF;}
.sign-up-model .communication-checkbox input:checked + label::before{content: "\f00c";font-family: FontAwesome;left: 3px; position: absolute;font-size: 9px;top: 0px;color: #fff;z-index: 1;}
.sign-up-model .communication-checkbox .custom-sign-up-checkbox{padding-left: 22px;margin-bottom: 8px;}
.sign-up-model .communication-checkbox .communication-option{display: flex;}
.sign-up-model .communication-checkbox .communication-option .custom-sign-up-checkbox{margin-right: 30px;}
.sign-up-model .proceed-btn {text-align: center;}
.sign-up-model .proceed-btn  .custom-btn{min-width: 164px !important; text-transform: inherit; font-size: 14px !important; font-weight: 400; background-color: #00103e!important;    margin-top: 8px;    padding: 15px 20px !important;}

.sign-up-model .proceed-btn  .custom-btn:hover{background-color:#F68D2B !important;}

.sign-up-model .sign-up-model-err span{color: #ff0000;font-size: 14px;font-weight: 600;text-align: center; padding-top: 15px; padding-bottom: 8px;display: block;}
.sign-up-model form div{margin-top: 0;}

@media  (max-width:575px) {
.sign-up-model .sign-up-top-detail h2 {font-size: 26px;line-height: 36px;	margin-top: 8px;margin-bottom: 12px;}
.modal-content {top: 0;	transform: translate(-50%, -0%);margin: 30px auto;}
	}




input#idNumber,
input#firstName,
input#lastName,
input#mobileNumber,
input#employerName,
input#employeeNumber,
.bestTime,
input[type="radio"],
.consent
{
	margin-top: 5px;
	margin-bottom: 15px;
}

input#mobileNumber {
	color: #000 !important;
}

select#bestDay,
select#bestTime 
{
	padding: 10px;
}

.consent {
	display: flex;
	gap: 10px;
	align-items: flex-start;
}

#formMessage {
	margin-bottom: 5px;
}

button#submitBtn {
	margin-top: 5px;
}

/* =====================================================
   FONT-DISPLAY: SWAP — TheFox 4k Icon Fonts
   Override theme @font-face declarations to fix the
   PageSpeed "Font display" warning.
   MAINTENANCE NOTE: If TheFox theme is updated, check
   these font paths still match:
   /themes/thefox/includes/4k-icons/icons/4k-icons-pack03/icons/fonts/
   /themes/thefox/includes/4k-icons/icons/4k-icons-pack02/icons/fonts/
   /themes/thefox/includes/4k-icons/icons/4k-icons-pack01/icons/fonts/
   ===================================================== */

@font-face {
    font-family: "ion";
    src: url("../thefox/includes/4k-icons/icons/4k-icons-pack03/icons/fonts/ion.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "ft";
    src: url("../thefox/includes/4k-icons/icons/4k-icons-pack03/icons/fonts/ft.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "ec";
    src: url("../thefox/includes/4k-icons/icons/4k-icons-pack02/icons/fonts/ec.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "imf";
    src: url("../thefox/includes/4k-icons/icons/4k-icons-pack03/icons/fonts/imf.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "bk";
    src: url("../thefox/includes/4k-icons/icons/4k-icons-pack01/icons/fonts/bk.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}



.connect-block {
  text-align: center;
}

.connect-block h3 {
  font-size: 18px;
  margin-bottom: 15px;
  font-weight: 600;
}

.social-links {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  justify-content: center;
  gap: 12px;
}

.social-links li {
  display: inline-block;
}

.social-links a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 27px;
  width: 27px;
  border-radius: 50%;
  color: #fff;
  font-size: 17px;
  text-decoration: none;
  transition: all 0.3s ease;
  position: relative;
}

/* Icons using Font Awesome (recommended) */
.social-links a::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 16px;
}

/* Individual Icons */
.facebook { background: #1877f2; }


.twitter { background: #000000; }

.linkedin { background: #0a66c2; }

.instagram { 
  background: radial-gradient(circle at 30% 30%, #feda75, #d62976, #962fbf);
}

.youtube { background: #ff0000; }


.whatsapp { background: #22D741; }

.tiktok { background: #fff; color: #000000; }

  transform: scale(1.1);
/* Hover Effect */
.social-links a:hover {
  opacity: 0.9;
}
/* sign up popup end */
.btn {
  display: inline-block;
  padding: 10px 20px;
  background-color: #f68d2b;
  color: white;
  font-size: 15px;
  font-weight: 900;
  margin-top: 10px;
}

.btn:hover{
	background-color: #009FE3;
	color: white;
}

[name="your-subject"] {
  margin-bottom: 23px;
  
}
.wpcf7-select {
  position: relative;
  display: inline-block;
}

.wpcf7-select select {
  appearance: none;
  padding: 10px 40px 10px 10px;
}

.wpcf7-select::after {
  content: "?"; /* arrow */
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none; /* click passes through */
}
