/**
 * Urbanexa GROUP — Django admin theme (aligned with storefront palette).
 */
:root {
  --uxg-ivory: #faf7f2;
  --uxg-espresso: #1c1714;
  --uxg-gold: #c8a96a;
  --uxg-taupe: #b8a99a;
  --uxg-burgundy: #6e1e2f;
  --uxg-burgundy-deep: #4a1420;
  --uxg-muted: #6f6a64;
  --uxg-white: #ffffff;

  /* Django admin variables (Django 4.2+) */
  --primary: var(--uxg-burgundy);
  --secondary: var(--uxg-gold);
  --accent: var(--uxg-gold);
  --selected-row: rgba(200, 169, 106, 0.18);
  --selected-bg: rgba(110, 30, 47, 0.08);
  --hairline-color: rgba(184, 169, 154, 0.45);
  --border-color: rgba(184, 169, 154, 0.5);
  --body-quiet-color: var(--uxg-muted);
  --body-medium-color: var(--uxg-espresso);
  --body-loud-color: var(--uxg-espresso);
  --link-fg: var(--uxg-burgundy);
  --link-hover-color: var(--uxg-burgundy-deep);
  --header-color: var(--uxg-white);
  --header-branding-color: var(--uxg-white);
  --header-bg: linear-gradient(
    135deg,
    var(--uxg-burgundy-deep) 0%,
    var(--uxg-burgundy) 42%,
    #7a2840 100%
  );
  --breadcrumbs-fg: var(--uxg-muted);
  --breadcrumbs-link-fg: var(--uxg-burgundy);
}

html[data-theme="dark"],
html[data-theme="auto"] {
  --primary: var(--uxg-gold);
  --header-bg: linear-gradient(135deg, #2a1810 0%, var(--uxg-burgundy-deep) 100%);
  /* Default burgundy links are invisible on charcoal — use light link colour in dark UI */
  --link-fg: #ede4d9;
  --link-hover-color: #e8d4a8;
  --breadcrumbs-link-fg: #ede4d9;
}

body {
  font-family: "DM Sans", system-ui, sans-serif;
  background: radial-gradient(circle at top right, #352126 0%, #1f1713 48%, #15100d 100%);
  color: #efe7dd;
}

/* Header */
#header {
  background: var(--header-bg);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 8px 32px -12px rgba(28, 23, 20, 0.35);
}

#header a:link,
#header a:visited {
  color: var(--uxg-white);
}

#user-tools a:focus,
#user-tools a:hover {
  color: var(--uxg-gold);
  text-decoration: underline;
}

/* Branding */
.uxg-branding {
  padding: 0;
}

.uxg-branding__link {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  color: inherit !important;
  text-decoration: none !important;
}

.uxg-branding__link:hover .uxg-branding__wordmark {
  color: var(--uxg-white);
}

.uxg-branding__mark {
  display: flex;
  color: var(--uxg-gold);
  flex-shrink: 0;
}

.uxg-branding__svg {
  width: 2.35rem;
  height: 2.35rem;
  display: block;
}

.uxg-branding__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.1rem;
}

.uxg-branding__wordmark {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600;
  font-size: 1.35rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--uxg-white);
  line-height: 1.1;
}

.uxg-branding__em {
  font-style: italic;
  color: var(--uxg-gold);
}

.uxg-branding__tag {
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(250, 247, 242, 0.72);
}

/* Storefront shortcut */
.uxg-nav-storefront {
  display: inline-block;
  margin-right: 1rem;
  padding: 0.35rem 0.65rem;
  border-radius: 6px;
  border: 1px solid rgba(200, 169, 106, 0.45);
  background: rgba(255, 255, 255, 0.06);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--uxg-gold) !important;
  text-decoration: none !important;
}

.uxg-nav-storefront:hover,
.uxg-nav-storefront:focus {
  background: rgba(200, 169, 106, 0.18);
  color: var(--uxg-white) !important;
}

/* Breadcrumbs */
div.breadcrumbs {
  background: color-mix(in srgb, var(--uxg-ivory) 92%, var(--uxg-white));
  border-bottom: 1px solid var(--hairline-color);
  font-size: 0.8rem;
}

div.breadcrumbs a {
  color: var(--uxg-burgundy);
}

/* Modules & content */
#content {
  padding: 1.25rem 2rem 2.5rem;
  background: transparent;
}

.module h2,
.module caption,
.inline-group h2 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600;
  font-size: 1.05rem;
  letter-spacing: 0.06em;
  background: linear-gradient(
    90deg,
    rgba(110, 30, 47, 0.12) 0%,
    rgba(200, 169, 106, 0.12) 100%
  );
  color: var(--uxg-espresso);
  border-bottom: 1px solid var(--hairline-color);
}

.module table {
  border-radius: 8px;
  overflow: hidden;
}

/*
 * Dashboard index & changelist — burgundy links on charcoal (dark theme) are nearly invisible.
 */
#content-main .module table th a {
  font-weight: 600;
}

html[data-theme="dark"] #content-main .module table th a,
html[data-theme="dark"] #content-main a.addlink,
html[data-theme="auto"] #content-main .module table th a,
html[data-theme="auto"] #content-main a.addlink {
  color: #f2e8dc !important;
}

html[data-theme="dark"] #content-main .module table th a:hover,
html[data-theme="dark"] #content-main a.addlink:hover,
html[data-theme="auto"] #content-main .module table th a:hover,
html[data-theme="auto"] #content-main a.addlink:hover {
  color: var(--uxg-gold) !important;
}

html[data-theme="dark"] #content-main .module h2,
html[data-theme="dark"] #content-main .module caption,
html[data-theme="auto"] #content-main .module h2,
html[data-theme="auto"] #content-main .module caption {
  color: #faf7f2 !important;
}

html[data-theme="dark"] #content-main,
html[data-theme="auto"] #content-main {
  color: rgba(250, 247, 242, 0.92);
}

html[data-theme="dark"] #recent-actions-module,
html[data-theme="auto"] #recent-actions-module {
  color: rgba(250, 247, 242, 0.88);
}

html[data-theme="dark"] #recent-actions-module h2,
html[data-theme="auto"] #recent-actions-module h2 {
  color: #faf7f2 !important;
}

/* Buttons */
.button,
input[type="submit"],
input[type="button"],
.submit-row input,
a.button {
  font-family: "DM Sans", system-ui, sans-serif;
  font-weight: 600;
  letter-spacing: 0.06em;
  border-radius: 8px;
  background: var(--uxg-burgundy);
  color: var(--uxg-white);
  border: none;
}

.button:active,
.button:focus,
.button:hover,
input[type="submit"]:hover,
.submit-row input:hover {
  background: var(--uxg-burgundy-deep);
}

.button.default,
input[type="submit"].default,
.submit-row input.default {
  background: var(--uxg-burgundy);
}

a.deletelink {
  color: #a42a2a;
}

/* Form fields */
input:not([type]),
input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
input[type="number"],
input[type="tel"],
textarea,
select,
.vTextField {
  border-radius: 6px;
  border-color: rgba(184, 169, 154, 0.65);
  background: var(--uxg-white);
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--uxg-burgundy);
  outline: 2px solid rgba(110, 30, 47, 0.2);
  outline-offset: 0;
}

/*
 * Dark / auto theme — Django sets light-coloured text on inputs; our fields stay white,
 * so typed text disappears. Force espresso text + caret on all admin fields.
 */
html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]):not([type="file"]):not([type="hidden"]),
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] .vTextField,
html[data-theme="auto"] input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]):not([type="file"]):not([type="hidden"]),
html[data-theme="auto"] textarea,
html[data-theme="auto"] select,
html[data-theme="auto"] .vTextField {
  color: #1c1714 !important;
  -webkit-text-fill-color: #1c1714;
  caret-color: #1c1714;
  background-color: #ffffff !important;
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder,
html[data-theme="auto"] input::placeholder,
html[data-theme="auto"] textarea::placeholder {
  color: #6f6a64;
  opacity: 1;
}

html[data-theme="dark"] input:-webkit-autofill,
html[data-theme="dark"] input:-webkit-autofill:hover,
html[data-theme="dark"] input:-webkit-autofill:focus,
html[data-theme="auto"] input:-webkit-autofill,
html[data-theme="auto"] input:-webkit-autofill:hover,
html[data-theme="auto"] input:-webkit-autofill:focus {
  -webkit-text-fill-color: #1c1714 !important;
  box-shadow: 0 0 0 1000px #ffffff inset !important;
}

/* Filter horizontal / multiple select widgets */
html[data-theme="dark"] .selector select,
html[data-theme="dark"] .selector-available select,
html[data-theme="dark"] .selector-chosen select,
html[data-theme="auto"] .selector select,
html[data-theme="auto"] .selector-available select,
html[data-theme="auto"] .selector-chosen select {
  color: #1c1714 !important;
  -webkit-text-fill-color: #1c1714;
  background-color: #ffffff !important;
}

/* Labels & help text on dark page background */
html[data-theme="dark"] .aligned label,
html[data-theme="dark"] .form-row label,
html[data-theme="dark"] .field-box label,
html[data-theme="auto"] .aligned label,
html[data-theme="auto"] .form-row label,
html[data-theme="auto"] .field-box label {
  color: rgba(250, 247, 242, 0.95) !important;
}

html[data-theme="dark"] .help,
html[data-theme="dark"] p.help,
html[data-theme="auto"] .help,
html[data-theme="auto"] p.help {
  color: rgba(230, 224, 216, 0.85) !important;
}

html[data-theme="dark"] fieldset.module > h2,
html[data-theme="dark"] .inline-group > h2,
html[data-theme="auto"] fieldset.module > h2,
html[data-theme="auto"] .inline-group > h2 {
  color: #faf7f2 !important;
}

html[data-theme="dark"] #content h1,
html[data-theme="auto"] #content h1 {
  color: #faf7f2 !important;
}

html[data-theme="dark"] div.breadcrumbs,
html[data-theme="auto"] div.breadcrumbs {
  background: rgba(42, 38, 36, 0.65);
  color: rgba(250, 247, 242, 0.88);
}

html[data-theme="dark"] div.breadcrumbs a,
html[data-theme="auto"] div.breadcrumbs a {
  color: #ede4d9 !important;
}

/* Left sidebar — model links (oxblood on charcoal) */
html[data-theme="dark"] #nav-sidebar table a,
html[data-theme="dark"] #nav-sidebar a:link,
html[data-theme="dark"] #nav-sidebar a:visited,
html[data-theme="auto"] #nav-sidebar table a,
html[data-theme="auto"] #nav-sidebar a:link,
html[data-theme="auto"] #nav-sidebar a:visited {
  color: #ede4d9 !important;
}

html[data-theme="dark"] #nav-sidebar table a:hover,
html[data-theme="dark"] #nav-sidebar a:focus,
html[data-theme="auto"] #nav-sidebar table a:hover,
html[data-theme="auto"] #nav-sidebar a:focus {
  color: var(--uxg-gold) !important;
}

html[data-theme="dark"] #nav-sidebar .module caption,
html[data-theme="dark"] #nav-sidebar .module th,
html[data-theme="auto"] #nav-sidebar .module caption,
html[data-theme="auto"] #nav-sidebar .module th {
  color: rgba(250, 247, 242, 0.95) !important;
}

html[data-theme="dark"] #nav-filter,
html[data-theme="auto"] #nav-filter {
  color: #1c1714 !important;
  -webkit-text-fill-color: #1c1714;
  background-color: #ffffff !important;
}

/* Changelist search & filters */
html[data-theme="dark"] #changelist-search input,
html[data-theme="dark"] #toolbar form input,
html[data-theme="auto"] #changelist-search input,
html[data-theme="auto"] #toolbar form input {
  color: #1c1714 !important;
  -webkit-text-fill-color: #1c1714;
  background-color: #ffffff !important;
}

/* Messages */
.messagelist .success {
  background: rgba(200, 169, 106, 0.22);
  border-color: var(--uxg-gold);
  color: var(--uxg-espresso);
}

.messagelist .warning {
  background: rgba(200, 169, 106, 0.15);
}

/* Login page layout/colours: urbanexa_admin_login_after.css (loads after Django login.css) */

/* Dashboard module list */
#content-main .module {
  border-radius: 12px;
  border: 1px solid rgba(200, 169, 106, 0.28);
  background: rgba(255, 255, 255, 0.04);
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.16);
}

/* Admin index title area */
#content h1 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600;
  color: #f4ede4;
}

#container,
#container #content,
#container #content-main,
#changelist,
#changelist-form .results,
#content-related {
  background: transparent !important;
}

.module,
.inline-group,
div.breadcrumbs {
  backdrop-filter: blur(3px);
}

/* Responsive: stack brand on small screens */
@media (max-width: 600px) {
  .uxg-branding__wordmark {
    font-size: 1.05rem;
    letter-spacing: 0.14em;
  }

  .uxg-nav-storefront {
    margin-right: 0.35rem;
    padding: 0.28rem 0.45rem;
    font-size: 0.58rem;
  }
}