/* AutoSync logo-aligned dark modal + brand polish
   Added 2026-06-06: removes white modal backgrounds on homepage modals. */
:root{
  --as-black:#05070a;
  --as-deep:#081018;
  --as-panel:rgba(10,16,24,.96);
  --as-panel-soft:rgba(255,255,255,.055);
  --as-line:rgba(255,255,255,.13);
  --as-text:#eef7ff;
  --as-muted:rgba(238,247,255,.72);
  --as-cyan:#00d7ff;
  --as-blue:#0072ff;
  --as-blue-dark:#004d9a;
}

/* Header/footer logo sizing */
#logo img.as-autosync-logo,
#logo img.logo-main.as-autosync-logo,
#logo img.logo-mobile.as-autosync-logo{
  width:68px !important;
  height:68px !important;
  object-fit:contain !important;
  max-width:68px !important;
  filter:drop-shadow(0 8px 22px rgba(0,215,255,.26));
}
@media (max-width:767.98px){
  #logo img.as-autosync-logo,
  #logo img.logo-main.as-autosync-logo,
  #logo img.logo-mobile.as-autosync-logo{
    width:58px !important;
    height:58px !important;
    max-width:58px !important;
  }
}
.as-footer-logo{
  width:132px !important;
  height:132px !important;
  object-fit:contain !important;
  max-width:132px !important;
  filter:drop-shadow(0 14px 28px rgba(0,215,255,.20));
}

/* Brand buttons / accents */
.btn-main,
.btn-primary,
.bg-color,
.id-color.circle{
  background:linear-gradient(135deg,var(--as-cyan),var(--as-blue)) !important;
  border-color:rgba(0,215,255,.46) !important;
}
.btn-main:hover,
.btn-primary:hover{
  background:linear-gradient(135deg,var(--as-blue),var(--as-cyan)) !important;
  border-color:rgba(0,215,255,.72) !important;
  color:#fff !important;
}
.id-color,
a:hover,
.widget a:hover{
  color:var(--as-cyan) !important;
}

/* Target all homepage helper modals that used white Bootstrap backgrounds */
#signupLoginModal .modal-content,
#forgotPasswordModal .modal-content,
#contactUsModal .modal-content,
#requestPartModal .modal-content,
#sellVehicleOptionModal .modal-content,
#sellVehiclePrivateModal .modal-content,
#sellVehicleModal .modal-content,
#termsModal .modal-content,
#companyJoinModal .modal-content,
#financeCalculatorModal .modal-content,
#privacyModal .modal-content,
#safetyModal .modal-content,
#imageModal .modal-content,
#inquireModal .modal-content{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(780px 330px at 8% 0%, rgba(0,215,255,.20), transparent 62%),
    radial-gradient(640px 300px at 92% 12%, rgba(0,114,255,.18), transparent 64%),
    linear-gradient(180deg, rgba(10,16,24,.98), rgba(5,7,10,.98)) !important;
  border:1px solid var(--as-line) !important;
  border-radius:22px !important;
  color:var(--as-text) !important;
  box-shadow:0 28px 90px rgba(0,0,0,.62), 0 0 34px rgba(0,215,255,.10) !important;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}

#signupLoginModal .modal-header,
#forgotPasswordModal .modal-header,
#contactUsModal .modal-header,
#requestPartModal .modal-header,
#sellVehicleOptionModal .modal-header,
#sellVehiclePrivateModal .modal-header,
#sellVehicleModal .modal-header,
#termsModal .modal-header,
#companyJoinModal .modal-header,
#financeCalculatorModal .modal-header,
#privacyModal .modal-header,
#safetyModal .modal-header,
#imageModal .modal-header,
#inquireModal .modal-header{
  background:
    radial-gradient(720px 260px at 12% 0%, rgba(0,215,255,.24), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.025)) !important;
  border-bottom:1px solid var(--as-line) !important;
  color:#fff !important;
}

#signupLoginModal .modal-body,
#forgotPasswordModal .modal-body,
#contactUsModal .modal-body,
#requestPartModal .modal-body,
#sellVehicleOptionModal .modal-body,
#sellVehiclePrivateModal .modal-body,
#sellVehicleModal .modal-body,
#termsModal .modal-body,
#companyJoinModal .modal-body,
#financeCalculatorModal .modal-body,
#privacyModal .modal-body,
#safetyModal .modal-body,
#imageModal .modal-body,
#inquireModal .modal-body{
  background:transparent !important;
  color:var(--as-text) !important;
}

#signupLoginModal .modal-footer,
#forgotPasswordModal .modal-footer,
#contactUsModal .modal-footer,
#requestPartModal .modal-footer,
#sellVehicleOptionModal .modal-footer,
#sellVehiclePrivateModal .modal-footer,
#sellVehicleModal .modal-footer,
#termsModal .modal-footer,
#companyJoinModal .modal-footer,
#financeCalculatorModal .modal-footer,
#privacyModal .modal-footer,
#safetyModal .modal-footer,
#imageModal .modal-footer,
#inquireModal .modal-footer{
  background:rgba(255,255,255,.035) !important;
  border-top:1px solid var(--as-line) !important;
}

#signupLoginModal h1,#signupLoginModal h2,#signupLoginModal h3,#signupLoginModal h4,#signupLoginModal h5,#signupLoginModal h6,
#forgotPasswordModal h1,#forgotPasswordModal h2,#forgotPasswordModal h3,#forgotPasswordModal h4,#forgotPasswordModal h5,#forgotPasswordModal h6,
#contactUsModal h1,#contactUsModal h2,#contactUsModal h3,#contactUsModal h4,#contactUsModal h5,#contactUsModal h6,
#requestPartModal h1,#requestPartModal h2,#requestPartModal h3,#requestPartModal h4,#requestPartModal h5,#requestPartModal h6,
#sellVehicleOptionModal h1,#sellVehicleOptionModal h2,#sellVehicleOptionModal h3,#sellVehicleOptionModal h4,#sellVehicleOptionModal h5,#sellVehicleOptionModal h6,
#sellVehiclePrivateModal h1,#sellVehiclePrivateModal h2,#sellVehiclePrivateModal h3,#sellVehiclePrivateModal h4,#sellVehiclePrivateModal h5,#sellVehiclePrivateModal h6,
#sellVehicleModal h1,#sellVehicleModal h2,#sellVehicleModal h3,#sellVehicleModal h4,#sellVehicleModal h5,#sellVehicleModal h6,
#termsModal h1,#termsModal h2,#termsModal h3,#termsModal h4,#termsModal h5,#termsModal h6,
#companyJoinModal h1,#companyJoinModal h2,#companyJoinModal h3,#companyJoinModal h4,#companyJoinModal h5,#companyJoinModal h6,
#financeCalculatorModal h1,#financeCalculatorModal h2,#financeCalculatorModal h3,#financeCalculatorModal h4,#financeCalculatorModal h5,#financeCalculatorModal h6,
#privacyModal h1,#privacyModal h2,#privacyModal h3,#privacyModal h4,#privacyModal h5,#privacyModal h6,
#safetyModal h1,#safetyModal h2,#safetyModal h3,#safetyModal h4,#safetyModal h5,#safetyModal h6,
#imageModal h1,#imageModal h2,#imageModal h3,#imageModal h4,#imageModal h5,#imageModal h6,
#inquireModal h1,#inquireModal h2,#inquireModal h3,#inquireModal h4,#inquireModal h5,#inquireModal h6,
#signupLoginModal label,#forgotPasswordModal label,#contactUsModal label,#requestPartModal label,#sellVehicleOptionModal label,#sellVehiclePrivateModal label,#sellVehicleModal label,#termsModal label,#companyJoinModal label,#financeCalculatorModal label,#privacyModal label,#safetyModal label,#imageModal label,#inquireModal label{
  color:#fff !important;
}

#signupLoginModal p,#forgotPasswordModal p,#contactUsModal p,#requestPartModal p,#sellVehicleOptionModal p,#sellVehiclePrivateModal p,#sellVehicleModal p,#termsModal p,#companyJoinModal p,#financeCalculatorModal p,#privacyModal p,#safetyModal p,#imageModal p,#inquireModal p,
#signupLoginModal li,#forgotPasswordModal li,#contactUsModal li,#requestPartModal li,#sellVehicleOptionModal li,#sellVehiclePrivateModal li,#sellVehicleModal li,#termsModal li,#companyJoinModal li,#financeCalculatorModal li,#privacyModal li,#safetyModal li,#imageModal li,#inquireModal li,
#signupLoginModal .form-text,#forgotPasswordModal .form-text,#contactUsModal .form-text,#requestPartModal .form-text,#sellVehicleOptionModal .form-text,#sellVehiclePrivateModal .form-text,#sellVehicleModal .form-text,#termsModal .form-text,#companyJoinModal .form-text,#financeCalculatorModal .form-text,#privacyModal .form-text,#safetyModal .form-text,#imageModal .form-text,#inquireModal .form-text{
  color:var(--as-muted) !important;
}

#signupLoginModal .form-control,#signupLoginModal .form-select,
#forgotPasswordModal .form-control,#forgotPasswordModal .form-select,
#contactUsModal .form-control,#contactUsModal .form-select,
#requestPartModal .form-control,#requestPartModal .form-select,
#sellVehicleOptionModal .form-control,#sellVehicleOptionModal .form-select,
#sellVehiclePrivateModal .form-control,#sellVehiclePrivateModal .form-select,
#sellVehicleModal .form-control,#sellVehicleModal .form-select,
#companyJoinModal .form-control,#companyJoinModal .form-select,
#financeCalculatorModal .form-control,#financeCalculatorModal .form-select,
#inquireModal .form-control,#inquireModal .form-select{
  background:rgba(255,255,255,.075) !important;
  border:1px solid rgba(255,255,255,.16) !important;
  color:#fff !important;
  border-radius:12px !important;
}
#signupLoginModal .form-control::placeholder,#forgotPasswordModal .form-control::placeholder,#contactUsModal .form-control::placeholder,#requestPartModal .form-control::placeholder,#sellVehiclePrivateModal .form-control::placeholder,#sellVehicleModal .form-control::placeholder,#companyJoinModal .form-control::placeholder,#inquireModal .form-control::placeholder{
  color:rgba(238,247,255,.48) !important;
}
#signupLoginModal .form-control:focus,#signupLoginModal .form-select:focus,
#forgotPasswordModal .form-control:focus,#forgotPasswordModal .form-select:focus,
#contactUsModal .form-control:focus,#contactUsModal .form-select:focus,
#requestPartModal .form-control:focus,#requestPartModal .form-select:focus,
#sellVehiclePrivateModal .form-control:focus,#sellVehiclePrivateModal .form-select:focus,
#sellVehicleModal .form-control:focus,#sellVehicleModal .form-select:focus,
#companyJoinModal .form-control:focus,#companyJoinModal .form-select:focus,
#financeCalculatorModal .form-control:focus,#financeCalculatorModal .form-select:focus,
#inquireModal .form-control:focus,#inquireModal .form-select:focus{
  background:rgba(255,255,255,.10) !important;
  border-color:rgba(0,215,255,.72) !important;
  box-shadow:0 0 0 .22rem rgba(0,215,255,.16) !important;
  color:#fff !important;
}
#signupLoginModal .form-select option,
#requestPartModal .form-select option,
#sellVehiclePrivateModal .form-select option,
#sellVehicleModal .form-select option,
#companyJoinModal .form-select option,
#financeCalculatorModal .form-select option,
#inquireModal .form-select option{
  background:#081018 !important;
  color:#fff !important;
}

#signupLoginModal .input-group .btn,
#forgotPasswordModal .input-group .btn,
#requestPartModal .input-group .btn,
#sellVehiclePrivateModal .input-group .btn,
#sellVehicleModal .input-group .btn{
  border-color:rgba(255,255,255,.16) !important;
  color:#fff !important;
  background:rgba(255,255,255,.08) !important;
}

#signupLoginModal .nav-tabs,
#requestPartModal .nav-tabs,
#sellVehicleModal .nav-tabs{
  border-bottom:1px solid rgba(255,255,255,.12) !important;
}
#signupLoginModal .nav-tabs .nav-link,
#requestPartModal .nav-tabs .nav-link,
#sellVehicleModal .nav-tabs .nav-link{
  color:var(--as-muted) !important;
  border:0 !important;
  border-bottom:2px solid transparent !important;
  background:transparent !important;
  font-weight:900;
}
#signupLoginModal .nav-tabs .nav-link.active,
#requestPartModal .nav-tabs .nav-link.active,
#sellVehicleModal .nav-tabs .nav-link.active{
  color:#fff !important;
  border-bottom-color:var(--as-cyan) !important;
  background:rgba(0,215,255,.08) !important;
}

/* Bootstrap and Select2 white areas inside request/sell modals */
#requestPartModal .select2-container--default .select2-selection--single,
#requestPartModal .select2-container--default .select2-selection--multiple,
#sellVehicleModal .select2-container--default .select2-selection--single,
#sellVehicleModal .select2-container--default .select2-selection--multiple{
  background:rgba(255,255,255,.075) !important;
  border:1px solid rgba(255,255,255,.16) !important;
  color:#fff !important;
  border-radius:12px !important;
  min-height:42px;
}
#requestPartModal .select2-selection__rendered,
#sellVehicleModal .select2-selection__rendered{
  color:#fff !important;
}
.select2-dropdown{
  background:#081018 !important;
  border:1px solid rgba(0,215,255,.25) !important;
  color:#fff !important;
}
.select2-results__option{ color:#fff !important; }
.select2-results__option--highlighted{ background:rgba(0,215,255,.20) !important; }

/* Table/list/card blocks inside modals */
#termsModal ul,
#termsModal .modal-body > div,
#contactUsModal .alert,
#requestPartModal .card,
#sellVehicleModal .card,
#companyJoinModal .card{
  background:rgba(255,255,255,.045) !important;
  border-color:rgba(255,255,255,.12) !important;
  color:var(--as-text) !important;
}

#signupLoginModal a,
#forgotPasswordModal a,
#contactUsModal a,
#requestPartModal a,
#sellVehicleOptionModal a,
#sellVehiclePrivateModal a,
#sellVehicleModal a,
#termsModal a,
#companyJoinModal a,
#financeCalculatorModal a,
#privacyModal a,
#safetyModal a,
#imageModal a,
#inquireModal a{
  color:var(--as-cyan) !important;
}

#signupLoginModal .btn-close,
#forgotPasswordModal .btn-close,
#contactUsModal .btn-close,
#requestPartModal .btn-close,
#sellVehicleOptionModal .btn-close,
#sellVehiclePrivateModal .btn-close,
#sellVehicleModal .btn-close,
#termsModal .btn-close,
#companyJoinModal .btn-close,
#financeCalculatorModal .btn-close,
#privacyModal .btn-close,
#safetyModal .btn-close,
#imageModal .btn-close,
#inquireModal .btn-close,
#faqModal .btn-close{
  filter:invert(1) grayscale(100%) brightness(200%) !important;
  opacity:.82 !important;
}

/* Finance/other cards in footer modals occasionally set inline white backgrounds */
.modal .bg-light,
.modal .table-light,
.modal .card-header{
  background:rgba(255,255,255,.065) !important;
  color:#fff !important;
}
.modal .table{
  --bs-table-bg:transparent;
  --bs-table-color:#eef7ff;
  --bs-table-border-color:rgba(255,255,255,.14);
  --bs-table-striped-bg:rgba(255,255,255,.035);
  --bs-table-striped-color:#eef7ff;
}