/* Exporters United Connect - front-end styles
   Namespaced with .eu- prefix throughout to avoid clashing with
   Dokan / WooCommerce / theme classes. */

.eu-contact-supplier-wrap { display: flex; gap: 10px; margin: 15px 0; }

.eu-modal {
	display: none;
	position: fixed; top: 0; left: 0; width: 100%;
	height: 100vh; height: 100dvh;
	background: rgba(0,0,0,.55); z-index: 100000;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: 20px; box-sizing: border-box;
}
.eu-modal.eu-modal-visible { display: flex; }
.eu-modal-content {
	margin: auto;
	background: #fff; padding: 30px; border-radius: 10px;
	max-width: 480px; width: 90%; max-height: 85vh; overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	touch-action: pan-y;
	position: relative;
	box-shadow: 0 20px 60px rgba(0,0,0,.25);
	opacity: 0; transform: scale(.95) translateY(8px);
	transition: opacity .2s ease, transform .2s ease;
}
.eu-modal.eu-modal-open .eu-modal-content { opacity: 1; transform: scale(1) translateY(0); }
.eu-modal-content--wide { max-width: 700px; }
.eu-modal-close {
	position: absolute; top: 10px; right: 14px; background: none; border: none;
	font-size: 24px; cursor: pointer; line-height: 1; color: #888;
}
.eu-modal-close:hover { color: #222; }
body.eu-modal-active { overflow: hidden; }
.eu-modal-content form label { display: block; margin-top: 12px; font-weight: 600; }
.eu-modal-content form input,
.eu-modal-content form select,
.eu-modal-content form textarea { width: 100%; padding: 8px; margin-top: 4px; box-sizing: border-box; }
.eu-modal-content form button[type="submit"] { margin-top: 16px; }
.eu-form-response { margin-top: 10px; font-size: .9em; }
.eu-form-response.success { color: #1a7f37; }
.eu-form-response.error { color: #d63638; }

.eu-status {
	display: inline-block; padding: 3px 10px; border-radius: 12px;
	font-size: .8em; font-weight: 600; background: #eee; color: #333;
}
.eu-status--submitted, .eu-status--processing, .eu-status--draft, .eu-status--sent { background: #e0ecff; color: #1b4ed8; }
.eu-status--quoted, .eu-status--ready, .eu-status--in_transit, .eu-status--customs { background: #fff3cd; color: #8a6300; }
.eu-status--accepted, .eu-status--approved, .eu-status--paid, .eu-status--delivered { background: #d7f5df; color: #1a7f37; }
.eu-status--declined, .eu-status--cancelled, .eu-status--expired, .eu-status--exception { background: #fde2e1; color: #b32d2e; }
.eu-status--negotiating, .eu-status--revision_requested, .eu-status--shipped { background: #ece5ff; color: #5b21b6; }

.eu-table { width: 100%; border-collapse: collapse; margin: 15px 0; }
.eu-table th, .eu-table td { padding: 10px; border-bottom: 1px solid #eee; text-align: left; }

.eu-line-items-table input { width: 100%; }
.eu-line-items-table td { padding: 4px; }

.eu-shipment-card { border: 1px solid #e2e2e2; border-radius: 6px; padding: 16px; margin: 12px 0; }
.eu-shipment-card--compact { padding: 10px; }
.eu-shipment-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.eu-shipment-meta td { padding: 4px 8px; border: none; }
.eu-shipment-timeline { list-style: none; margin: 12px 0 0; padding: 0; border-left: 2px solid #ddd; }
.eu-shipment-timeline li { padding: 6px 0 6px 16px; position: relative; }
.eu-shipment-timeline li::before {
	content: ""; position: absolute; left: -5px; top: 12px;
	width: 8px; height: 8px; border-radius: 50%; background: #5b21b6;
}
.eu-timeline-time { display: block; font-size: .8em; color: #777; }
.eu-timeline-location { font-weight: 600; }
.eu-timeline-note { display: block; font-size: .9em; color: #555; }

.eu-shipment-actions { display: flex; gap: 20px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 10px; }
.eu-add-checkpoint-form { display: flex; gap: 8px; }

.eu-vendor-dashboard h1 { margin-bottom: 20px; }
.eu-quote-form-row form,
.eu-vendor-quote-form { max-width: 500px; }

.eu-inquiry-box { border: 1px solid #e2e2e2; border-radius: 6px; padding: 16px; max-width: 320px; }
.eu-inquiry-box-shipping-note { font-size: .85em; color: #555; margin-top: 0; }
.eu-inquiry-box-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.eu-inquiry-box-actions .eu-inquiry-box-chat-now { display: inline-flex; }
.eu-inquiry-box-trust-badges { list-style: none; margin: 14px 0 0; padding: 0; font-size: .8em; color: #555; }
.eu-inquiry-box-trust-badges li { padding: 3px 0 3px 18px; position: relative; }
.eu-inquiry-box-trust-badges li::before { content: "✓"; position: absolute; left: 0; color: #1a7f37; font-weight: 700; }

.eu-public-tracking { max-width: 640px; margin: 60px auto; padding: 0 20px; }

.eu-hp-field { position: absolute !important; left: -9999px !important; top: -9999px !important; height: 0; width: 0; overflow: hidden; }

.eu-enquiry-status-new { color: #b45309; font-weight: 600; }
.eu-enquiry-status-replied { color: #1a7f37; font-weight: 600; }
.eu-enquiry-status-closed { color: #6b7280; font-weight: 600; }

/* -----------------------------------------------------------
   Buyer auth gate (#eu-auth-modal) — intro / register / login /
   vendor-blocked views. Desktop 650-750px, tablet 90%, mobile 95%,
   per spec.
   ----------------------------------------------------------- */

.eu-auth-modal-content {
	max-width: 700px; width: 90%; padding: 32px 36px 0; overflow: hidden;
	border-radius: 14px;
}
@media (min-width: 782px) {
	.eu-auth-modal-content { width: 700px; }
}
@media (max-width: 600px) {
	.eu-auth-modal-content { width: 95%; padding: 26px 20px 0; }
}

.eu-auth-header { display: flex; align-items: center; justify-content: center; gap: 8px; margin-bottom: 4px; }
.eu-auth-icon { font-size: 22px; line-height: 1; }
.eu-auth-title { text-align: center; margin: 0; font-size: 1.05em; }
.eu-auth-subtitle { text-align: center; color: #555; font-size: .85em; margin: 0 0 12px; }
.eu-auth-info { color: #555; font-size: .8em; line-height: 1.5; margin: 0 0 14px; }
.eu-auth-benefits-label { font-weight: 600; font-size: .82em; margin: 14px 0 6px; }
.eu-auth-benefits {
	list-style: none; margin: 0 0 4px; padding: 0;
	display: grid; grid-template-columns: 1fr 1fr; grid-auto-flow: row; gap: 4px 14px;
}
.eu-auth-benefits li { padding-left: 20px; position: relative; font-size: .78em; color: #333; line-height: 1.4; }
.eu-auth-benefits li::before { content: "✔"; position: absolute; left: 0; color: #1a9c4b; font-weight: 700; }

.eu-auth-btn-primary {
	display: block; width: 100%; background: #1a9c4b; border-color: #1a9c4b; color: #fff;
	font-size: 1.05em; font-weight: 600; padding: 13px; border-radius: 8px;
	transition: background .15s ease;
}
.eu-auth-btn-primary:hover { background: #158a41; border-color: #158a41; color: #fff; }
.eu-auth-btn-primary:disabled { opacity: .6; }

.eu-auth-switch { text-align: center; font-size: .9em; margin: 16px 0 0; }
.eu-auth-back { display: inline-block; font-size: .85em; color: #666; margin-bottom: 10px; text-decoration: none; }
.eu-auth-back:hover { color: #1a9c4b; }

.eu-auth-social { margin-bottom: 4px; }
.eu-auth-divider { text-align: center; color: #999; font-size: .8em; margin: 14px 0; position: relative; }
.eu-auth-divider::before { content: ""; position: absolute; top: 50%; left: 0; right: 0; border-top: 1px solid #e2e2e2; }
.eu-auth-divider span { background: #fff; position: relative; padding: 0 10px; }

.eu-buyer-register-form,
.eu-auth-login-form { display: flex; flex-direction: column; gap: 10px; }
.eu-auth-row { display: flex; gap: 10px; }
.eu-auth-row input { flex: 1; }
.eu-buyer-register-form input,
.eu-buyer-register-form select,
.eu-auth-login-form input {
	padding: 11px 12px; border: 1px solid #d5d5d5; border-radius: 8px; font-size: .95em; box-sizing: border-box; width: 100%;
}
.eu-buyer-register-form input:focus,
.eu-buyer-register-form select:focus,
.eu-auth-login-form input:focus { outline: none; border-color: #1a9c4b; box-shadow: 0 0 0 2px rgba(26,156,75,.15); }
.eu-auth-terms-check { font-size: .85em; color: #555; display: flex; gap: 8px; align-items: flex-start; font-weight: 400; }
.eu-auth-terms-check input { width: auto; margin-top: 3px; }
.eu-auth-hp-field { position: absolute !important; left: -9999px !important; top: -9999px !important; height: 0; width: 0; overflow: hidden; }

.eu-auth-login-row { display: flex; align-items: center; justify-content: space-between; font-size: .88em; }
.eu-auth-remember { display: flex; align-items: center; gap: 6px; font-weight: 400; }
.eu-auth-remember input { width: auto; }

.eu-auth-footer { margin: 22px -36px 0; padding: 16px 36px 22px; background: #fafafa; border-top: 1px solid #eee; }
@media (max-width: 600px) { .eu-auth-footer { margin: 22px -20px 0; padding: 16px 20px 22px; } }
.eu-auth-footer-terms { text-align: center; font-size: .8em; color: #777; margin: 0 0 10px; }
.eu-auth-footer-terms a { color: #555; }
.eu-auth-trust { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px; font-size: .78em; color: #777; }
.eu-auth-trust-title { font-weight: 600; color: #333; width: 100%; text-align: center; margin-bottom: 4px; }

.eu-comm-violation { border-color: #d63638 !important; box-shadow: 0 0 0 1px #d63638; }
.eu-comm-warning { color: #d63638; font-size: .85em; margin: 4px 0 0; }