/* Import Work Sans as a fallback in case Worksan isn't available */
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400&display=swap');

/* Bhaya Cruises – Form styles */
.bhaya-form { max-width: 780px; margin: 30px 0px; font-family: 'Worksan', 'Work Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Inter', sans-serif; }
.bhaya-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.bhaya-grid .bhaya-pair-2 { grid-column: auto; }
.bhaya-full { grid-column: 1 / -1; }
.bhaya-field { display:flex; flex-direction:column; gap:8px; }
.bhaya-label {
    font-family: 'Worksan', 'Work Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Inter', sans-serif;
    font-weight: 400; /* Regular */
    font-style: normal;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0;
    text-transform: uppercase;
    color:#333333;
}
.bhaya-input, .bhaya-select, .bhaya-textarea {
    width:100%;
    padding:20px 0; /* vertical only for underline style */
    border:none;
    border-bottom: 0.5px solid #333333;
    border-radius:0;
    background: transparent;
    color:#111827;
}

.bhaya-input:focus, .bhaya-select:focus, .bhaya-textarea:focus {
    outline: none;
    border-bottom-color:#111827;
    color:#111827
}
.bhaya-input::placeholder, .bhaya-textarea::placeholder {
    font-family: 'Worksan', 'Work Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Inter', sans-serif;
    font-weight: 300; /* Light */
    font-style: normal;
    font-size: 14px;
    line-height: 140%;
    letter-spacing: -0.01em; /* ~ -1% */
    color:#9ca3af;
}
/* WebKit */
.bhaya-input::-webkit-input-placeholder, .bhaya-textarea::-webkit-input-placeholder {
    font-family: 'Worksan', 'Work Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Inter', sans-serif;
    font-weight: 300; font-style: normal; font-size: 14px; line-height: 140%; letter-spacing: -0.01em; color:#9ca3af;
}
/* Firefox */
.bhaya-input::-moz-placeholder, .bhaya-textarea::-moz-placeholder {
    font-family: 'Worksan', 'Work Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Inter', sans-serif;
    font-weight: 300; font-style: normal; font-size: 14px; line-height: 140%; letter-spacing: -0.01em; color:#9ca3af;
}
.bhaya-input:-moz-placeholder, .bhaya-textarea:-moz-placeholder { /* older Firefox */
    font-family: 'Worksan', 'Work Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Inter', sans-serif;
    font-weight: 300; font-style: normal; font-size: 14px; line-height: 140%; letter-spacing: -0.01em; color:#9ca3af;
}
/* Legacy placeholder fallbacks */
::-ms-input-placeholder { font-family: 'Worksan', 'Work Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Inter', sans-serif; font-weight:300; font-size:14px; }
:-ms-input-placeholder { font-family: 'Worksan', 'Work Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Inter', sans-serif; font-weight:300; font-size:14px; }
.bhaya-textarea { min-height:140px; resize:vertical; }
.bhaya-help { font-size:12px; color:#9ca3af; }
.bhaya-field [data-error]:not(:empty){ color:#b91c1c; }
.bhaya-field-error .bhaya-label { color:#b91c1c; }
.bhaya-field-error .bhaya-input,
.bhaya-field-error .bhaya-select,
.bhaya-field-error .bhaya-textarea { border-bottom-color:#b91c1c; }
.bhaya-actions { margin-top:50px; }
.bhaya-btn {
    display:inline-flex; align-items:center; justify-content:center; gap:10px;
    width:56px; height:39px;
    padding-top:10px; padding-bottom:10px; padding-left:0; padding-right:0;
    border:none; border-bottom:1px solid #333333; border-radius:0;
    background:transparent; color:#333333; cursor:pointer;
    opacity:1;
}
.bhaya-note { font-size:16px; color:#333333; }
.bhaya-error { color:#b91c1c; font-size:13px; margin-top:8px; }
.bhaya-success { color:#065f46; font-size:14px; }
/* Stack to single column a bit later to keep paired fields side-by-side longer */
@media (max-width: 640px){ .bhaya-grid{ grid-template-columns:1fr; } }

/* Custom checkbox: white box with black checkmark */
.bhaya-form input[type="checkbox"]{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width:16px; height:16px;
    border:1px solid #333333;
    border-radius:2px;
    background:#ffffff;
    display:inline-block;
    position:relative;
    vertical-align:middle;
    cursor:pointer;
}
.bhaya-form .bhaya-note input[type="checkbox"]{ margin-right:8px; }
.bhaya-form input[type="checkbox"]:focus{ outline:none; box-shadow:0 0 0 2px rgba(17,24,39,0.15); }
.bhaya-form input[type="checkbox"]:checked::after{
    content:"";
    position:absolute;
    left:4px; top:1px;
    width:5px; height:9px;
    border: solid #000;
    border-width:0 2px 2px 0;
    transform: rotate(45deg);
}

/* Style the date input like other Bhaya fields */
.bhaya-input[type="date"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 100%;
    padding: 20px 0;
    border: none;
    border-bottom: 0.5px solid #333333;
    border-radius: 0;
    background: transparent;
    font-family: 'Worksan', 'Work Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Inter', sans-serif;
    font-weight: 300;
    font-size: 14px;
    color: #111827;
    cursor: pointer;
    position: relative;
    padding-right: 28px; /* space for arrow */
}

/* Focus style */
.bhaya-input[type="date"]:focus {
    outline: none;
    border-bottom-color: #111827;
    color: #111827;
}

/* Add a custom ▼ arrow on the right */
.bhaya-input[type="date"] {
    background: transparent url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'></polyline></svg>") no-repeat right 0.5rem center;
    background-size: 14px;
}

/* Keep native picker clickable in Chrome/Edge */
.bhaya-input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0;          /* hide default icon */
    position: absolute;
    right: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}


/* Bhaya select styling (dropdown list) */
.bhaya-select {
    width: 100%;
    padding: 20px 0; /* underline spacing like inputs */
    border: none;
    border-bottom: 0.5px solid #333333;
    border-radius: 0;
    background: transparent;
    font-family: 'Worksan', 'Work Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Inter', sans-serif;
    font-weight: 300;
    font-size: 14px;
    color: #111827;
    cursor: pointer;
    appearance: none;            /* reset browser UI */
    -webkit-appearance: none;    /* Safari/Chrome */
    -moz-appearance: none;       /* Firefox */
    background-image: none;      /* remove default arrow */
}

/* Focus style */
.bhaya-select:focus {
    outline: none;
    border-bottom-color: #111827;
    color: #111827;
}

/* Placeholder (first option “Select”) style */
.bhaya-select option[value=""] {
    color: #9ca3af;
    font-weight: 300;
}

/* Custom dropdown arrow */
.bhaya-select {
    background: transparent url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'></polyline></svg>") no-repeat right 0.5rem center;
    background-size: 14px;
}

.bhaya-actions .bhaya-btn {
    padding: 12px 50px;                /* spacing like your panel */
    font-family: 'Work Sans', sans-serif;
    font-size: 14px;
    font-weight: 600;                  /* bold text */
    color: #ffffff;                    /* white text */
    background-color: #333333;         /* dark gray background */
    border: none;                      /* no border */
    border-radius: 0;                  /* sharp corners */
    cursor: pointer;
    text-transform: none;              /* keep natural casing */
    transition: background-color 0.3s ease;
}



