/* GJGT E-Commerce V3 - site styles (Bootstrap 5 augmentations, matched to V3 mockups) */

:root {
	--gjgt-red: #e8401c;        /* header stripe + action buttons (mockup red) */
	--gjgt-red-dark: #c63312;
	--gjgt-blue: #1f6fc5;       /* table header / heading blue from mockups */
	--gjgt-blue-dark: #17549a;
}

/* ----- Header ----- */
.header-logo { height: 56px; width: auto; }
@media (max-width: 575px) { .header-logo { height: 42px; } }

.brand-stripe { height: 5px; background: var(--gjgt-red); }

.gap-6 { gap: 4rem !important; }

.main-nav .nav-link { color: #111; }
.main-nav .nav-link.active,
.main-nav .nav-link:hover { color: var(--gjgt-blue); }

/* ----- Buttons (red pill SAVE / CONTINUE / SUBMIT per mockups) ----- */
.btn-gjgt {
	background: var(--gjgt-red);
	border-color: var(--gjgt-red);
	color: #fff;
	border-radius: 50rem;
	font-weight: 600;
}
.btn-gjgt:hover, .btn-gjgt:focus { background: var(--gjgt-red-dark); border-color: var(--gjgt-red-dark); color: #fff; }
.btn-gjgt:disabled { background: #adb5bd; border-color: #adb5bd; }  /* greyed until form complete, per spec */

/* ----- Blue panel/table headers per mockups ----- */
.table-gjgt thead th,
.panel-gjgt-header {
	background: var(--gjgt-blue);
	color: #fff;
}

/* ----- Card headers (accounts/orders/invoices/etc. -- all bootstrap
   .card-header divs site-wide) ----- */
.card-header {
	background-color: #cff4fc;
}

/* ----- Login page ----- */
.login-wrap { max-width: 460px; }
.login-logo { max-width: 380px; width: 100%; height: auto; }
.login-heading { color: var(--gjgt-blue); letter-spacing: .02em; }
.login-tabs .nav-link { color: #444; font-weight: 600; }
.login-tabs .nav-link.active { color: var(--gjgt-blue); }

/* ----- Drag-and-drop image upload zones (admin family/product image managers) ----- */
.image-dropzone {
	display: block;
	cursor: pointer;
	border: 2px dashed #adb5bd;
	transition: border-color .15s, background-color .15s;
}
.image-dropzone:hover { border-color: var(--gjgt-blue); }
[data-dropzone].uploading { opacity: .6; pointer-events: none; }
/* Drag-active state lives on the whole drop target (the card), which is
   larger than the visible dashed box, so a drop anywhere in the card
   registers -- not just inside the small label. */
[data-dropzone].dragover {
	outline: 2px dashed var(--gjgt-blue);
	outline-offset: -4px;
	background-color: #eaf2fc;
}

/* ----- Cookie consent widget ----- */
.cookie-consent {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	background: #1d1d1f;
	color: #f1f1f1;
	z-index: 1080;
}
.cookie-consent a { color: #9ec9ff; }