* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
.site-bg1{

    background: radial-gradient(35.36% 35.36% at 100% 25%, #0000 66%, #def3ff 68% 70%, #0000 72%) 32px 32px / calc(2* 32px) calc(2* 32px), radial-gradient(35.36% 35.36% at 0 75%, #0000 66%, #def3ff 68% 70%, #0000 72%) 32px 32px / calc(2* 32px) calc(2* 32px), radial-gradient(35.36% 35.36% at 100% 25%, #0000 66%, #def3ff 68% 70%, #0000 72%) 0 0 / calc(2* 32px) calc(2* 32px), radial-gradient(35.36% 35.36% at 0 75%, #0000 66%, #def3ff 68% 70%, #0000 72%) 0 0 / calc(2* 32px) calc(2* 32px), repeating-conic-gradient(#ffffff 0 25%, #0000 0 50%) 0 0 / calc(2* 32px) calc(2* 32px), radial-gradient(#0000 66%, #def3ff 68% 70%, #0000 72%) 0 calc(32px / 2) / 32px 32px #ffffff;

}
ul,
ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

img {
    max-width: 100%;
}

body {
    font-family: "Be Vietnam Pro", sans-serif;
    font-size: 16px;
    line-height: 28px;
    color: #505050;
    background: #f9f9f9;
    background-attachment: fixed;
    background-size: cover;
    background: radial-gradient(35.36% 35.36% at 100% 25%, #0000 66%, #def3ff 68% 70%, #0000 72%) 32px 32px / calc(2* 32px) calc(2* 32px), radial-gradient(35.36% 35.36% at 0 75%, #0000 66%, #def3ff 68% 70%, #0000 72%) 32px 32px / calc(2* 32px) calc(2* 32px), radial-gradient(35.36% 35.36% at 100% 25%, #0000 66%, #def3ff 68% 70%, #0000 72%) 0 0 / calc(2* 32px) calc(2* 32px), radial-gradient(35.36% 35.36% at 0 75%, #0000 66%, #def3ff 68% 70%, #0000 72%) 0 0 / calc(2* 32px) calc(2* 32px), repeating-conic-gradient(#ffffff 0 25%, #0000 0 50%) 0 0 / calc(2* 32px) calc(2* 32px), radial-gradient(#0000 66%, #def3ff 68% 70%, #0000 72%) 0 calc(32px / 2) / 32px 32px #ffffff;
}

.header {
    background-color: #ffffff;
    padding: 10px 0;
    box-shadow: 0px 6px 28px -8px rgb(143 57 144 / 21%);
}

.footer {
    background-color: #ffffff;
    box-shadow: 0px -6px 28px -8px rgb(143 57 144 / 21%);
}

.form-box,
.invoice-box {
    box-shadow: 0px 2px 10px -5px rgb(0 0 0 / 38%);
    overflow: hidden;
    border-radius: 15px;
    background-color: #ffffff;
}

.form-box h2,
.invoice-box h2 {
    font-size: 24px;
    text-align: center;
    margin: 0 0 20px;
    border-bottom: 1px solid rgb(0 0 0 / 6%);
    background: linear-gradient(90deg, #3e4096, #3e4096);
    padding: 1em;
    color: #fff;
}

.form-box h3 {
    font-size: 18px;
    color: #000;
    /* background-color: #28409b; */
}

.form-box tr h3 {
    font-size: 22px;
    color: #ffffff;
    line-height: 32px;
    background: #f87a4b;
    margin: 0;
    text-align: center;
    padding: 10px;
}

.form-box .form-control {
    border: 1px solid #dadada;
    border-radius: 8px;
}

.form-check-input {
    width: 18px;
    height: 18px;
    margin-right: .5rem;
}

label.error {
    color: #f00;
    font-size: 12px;
}

.info.bg-warning {
    padding: 20px;
    border-radius: 10px;
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 18px;
}

.info ul {
    list-style: disc;
    margin: 0 0 0 20px;
}

.info ul li {
    padding: 5px 0;
}

.accompany-details .acc-bg {
    background: #f5f5f5;
    padding: 10px 0;
    border-bottom: 2px dashed #e1e1e1;
}

.accompany-details li:last-child {
    border: none;
}

label.pg_upload {
    padding: 20px 10px;
    background: #fff;
    border: 2px dashed #2196f3;
    display: block;
    text-align: center;
    margin: 0 0 20px;
    color: #2196f3;
    cursor: auto;
}

.workshop-list {
    padding: 15px;
    background-color: #f5eef5;
    border: 2px solid #d3c2d3;
    border-radius: 15px;
}

.workshop-list li {
    display: block;
    padding: 8px 0;
    font-size: 14px;    
    vertical-align: top;
    line-height: 23px;
}

.reg-table th,
.reg-table td {
    padding: 1em;
    font-size: 14px;
}
/* ================ */
.footer-menu{
    display: flex; text-align: center!important;
}

.footer-menu li a{color: black; padding: 5px 10px; text-align: center; font-weight: bold;}

.footer-menu li a:hover{color: #2f5e8e;}

/* ---------- Form Container ---------- */
.form-box {
  background: #ffffff;
  border-radius: 15px;
  box-shadow: 0px 4px 20px rgba(0,0,0,0.1);
  padding: 20px;
}

/* ---------- Labels ---------- */
.form-box label {
  font-weight: 600;
  color: #333;
  margin-bottom: 5px;
}

/* ---------- Inputs Always Colored ---------- */
input[type="text"], input[type="email"], input[type="tel"], input[type="number"], textarea {
  /* background-color: #e6f0ff; light blue */
  border-radius: 10px;
  border: 2px solid #d0e4ff;
  padding: 10px;
}

select {
  /* background-color: #fff0f5; light pink */
  border-radius: 10px;
  border: 2px solid #f5c2e7;
  padding: 10px;
}

input[type="file"] {
  background-color: #e8ffe6; /* light green */
  border-radius: 10px;
  border: 2px solid #c2f5c2;
  padding: 8px;
}

textarea {
  background-color: #fffde6; /* light yellow */
  border: 2px solid #f5e8a3;
}

/* ---------- Keep Hover/Focus Glow ---------- */
.form-control:hover, .form-select:hover {
  border-color: #0d6efd;
  box-shadow: 0px 0px 6px rgba(13, 110, 253, 0.2);
}

.form-control:focus, .form-select:focus {
  border-color: #198754;
  box-shadow: 0px 0px 8px rgba(25, 135, 84, 0.3);
}

/* ---------- Submit Button ---------- */
#submit {
  width: 100%;
  font-size: 18px;
  font-weight: 600;
  padding: 12px;
  border-radius: 50px;
  background: linear-gradient(90deg, #0d6efd, #6610f2);
  border: none;
  color: #fff;
  transition: 0.3s;
}

#submit:hover {
  background: linear-gradient(90deg, #6610f2, #0d6efd);
  transform: scale(1.02);
  box-shadow: 0px 4px 12px rgba(0,0,0,0.2);
}

/* ----- General styling ----- */
.form-control, .form-select {
  border-radius: 10px;
  border: 2px solid transparent;
  padding: 10px;
  font-size: 15px;
  transition: 0.3s;
  color: #333;
  font-weight: 500;
  border-color: #809cc5;
}



/* ----- Hover/Focus glow ----- */
.form-control:hover, .form-select:hover,
.form-control:focus, .form-select:focus {
  box-shadow: 0px 0px 8px rgba(0,0,0,0.15);
  border-color: #0d6efd;
}



.photo-frame {
  width: 180px;
  height: auto;
  display: inline-block;
}
.photo-frame img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border: 2px solid #ccc;
  border-radius: 10px;
}