/* Shared admin skin; Django continues to own forms, permissions and actions. */
:root, html[data-theme="dark"], html[data-theme="light"] {
  color-scheme: light;
  --primary: #3b3b3b;
  --secondary: #333;
  --accent: #fff;
  --primary-fg: #fff;
  --body-fg: #333;
  --body-bg: #fff;
  --body-quiet-color: #666;
  --body-medium-color: #555;
  --body-loud-color: #222;
  --header-color: #333;
  --header-branding-color: #ff4038;
  --header-bg: #fff;
  --header-link-color: #333;
  --breadcrumbs-fg: #555;
  --breadcrumbs-link-fg: #444;
  --breadcrumbs-bg: #f5f5f5;
  --link-fg: #333;
  --link-hover-color: #e73d35;
  --link-selected-fg: #c8342d;
  --hairline-color: #e5e5e5;
  --border-color: #d6d6d6;
  --error-fg: #ba2121;
  --message-success-bg: #edf7ee;
  --message-warning-bg: #fff7df;
  --message-error-bg: #fff0ef;
  --darkened-bg: #f5f5f5;
  --selected-bg: #f1f1f1;
  --selected-row: #fff7ed;
  --button-fg: #fff;
  --button-bg: #414141;
  --button-hover-bg: #222;
  --default-button-bg: #ef8b14;
  --default-button-hover-bg: #d57608;
  --close-button-bg: #666;
  --close-button-hover-bg: #444;
  --delete-button-bg: #e53131;
  --delete-button-hover-bg: #bf2424;
  --object-tools-fg: #fff;
  --object-tools-bg: #ef8b14;
  --object-tools-hover-bg: #d57608;
  --font-family-primary: -apple-system, BlinkMacSystemFont, "Segoe UI", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
}

body { margin: 0; font-size: 14px; line-height: 1.6; background: #fff; }
a, button, input, select, textarea { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible {
  outline: 2px solid #e73d35;
  outline-offset: 3px;
}
#container { min-width: 0; }
#header.cms-header {
  box-sizing: border-box;
  width: 100%;
  min-height: 79px;
  flex-direction: row;
  justify-content: space-between;
  padding: 15px max(32px, calc((100% - 1398px) / 2));
  gap: 20px;
  background: #fff;
  border-top: 1px solid #e7e7e7;
  color: #333;
}
#branding { float: none; }
#header .admin-wordmark, #header .admin-wordmark:visited {
  color: #ff4038;
  font-size: 36px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: -1.5px;
  text-decoration: none;
}
#header #user-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  margin: 0;
  padding: 0;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
}
#header .admin-username { color: #666; margin-right: 14px; }
#header #user-tools a, #header #logout-form button {
  display: inline-block;
  box-sizing: border-box;
  padding: 7px 12px;
  border: 0;
  border-radius: 0;
  background: #777;
  color: #fff;
  font: inherit;
  line-height: 1.5;
  text-decoration: none;
  cursor: pointer;
}
#header #user-tools a:hover, #header #logout-form button:hover { background: #555; }
#logout-form { margin: 0; }
.cms-topnav { background: #333; }
.cms-topnav-inner { display: flex; max-width: 1398px; margin: 0 auto; padding: 0 32px; }
.cms-topnav a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 168px;
  min-height: 56px;
  padding: 0 22px;
  box-sizing: border-box;
  border-left: 1px solid #555;
  color: #fff;
  font-size: 16px;
  text-decoration: none;
}
.cms-topnav a:last-child { border-right: 1px solid #555; }
.cms-topnav a:hover { background: #424242; }
.cms-topnav a[aria-current="page"] { background: #282828; box-shadow: inset 0 -3px #ff4038; }
#container > .main {
  display: flex;
  align-items: flex-start;
  gap: 64px;
  width: calc(100% - 96px);
  max-width: 1398px;
  margin: 0 auto;
  padding-top: 76px;
}
.cms-sidebar { flex: 0 0 228px; padding: 8px 0 30px; }
.cms-sidebar h2 {
  margin: 0 0 26px;
  padding: 0 0 0 26px;
  border-left: 10px solid #ff4038;
  color: #333;
  font-size: 23px;
  font-weight: 700;
  line-height: 34px;
}
.cms-sidebar nav { display: flex; flex-direction: column; gap: 2px; padding-left: 31px; }
.cms-sidebar nav a {
  position: relative;
  padding: 5px 10px 5px 18px;
  color: #444;
  font-size: 15px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.cms-sidebar nav a:hover { color: #d9362e; background: #fafafa; }
.cms-sidebar nav a[aria-current="page"] { color: #bd302a; font-weight: 600; }
.cms-sidebar nav a[aria-current="page"]::before { content: "−"; position: absolute; left: 0; color: #999; }
#main > main.content { flex: 1 1 0; min-width: 0; max-width: 100%; }
#content { box-sizing: border-box; width: 100%; padding: 0; }
#content > h1 {
  margin: 0 0 23px;
  padding: 0 0 22px;
  border-bottom: 1px solid #d6d6d6;
  color: #2d2d2d;
  font-size: 36px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: -1.2px;
}
#content > h2 { font-size: 17px; margin: 0 0 20px; }
#content-main { min-width: 0; }
.object-tools { display: flex; justify-content: flex-end; gap: 6px; float: none; margin: 0 0 16px; padding: 0; }
.object-tools li { float: none; height: auto; margin: 0; padding: 0; }
.object-tools a, .object-tools a:link, .object-tools a:visited { padding: 8px 15px; border-radius: 0; font-size: 13px; }
.object-tools a.addlink { padding-right: 27px; }
.module { border-radius: 0; }
.module h2, .module caption, .inline-group h2 { padding: 13px 16px; font-size: 14px; letter-spacing: 0; }
#content .cms-list-title { margin: 0 0 22px; padding: 0 0 0 15px; border-left: 2px solid #ff4038; font-size: 18px; line-height: 1.3; background: #fff; color: #222; }
#changelist.module { display: flex; flex-direction: column; align-items: stretch; width: 100%; background: #fff; }
#changelist .changelist-form-container { display: contents; }
#changelist .cms-list-title { order: 0; }
#changelist #toolbar { order: 1; margin: 0 0 14px; padding: 0; background: #fff; border: 0; }
#changelist #toolbar form { margin: 0; }
#changelist #toolbar form > div:first-child { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 5px; }
#changelist #toolbar label { display: none; }
#changelist #toolbar #searchbar { box-sizing: border-box; width: 250px; max-width: 100%; height: 35px; padding: 6px 10px; border: 1px solid #d6d6d6; border-radius: 0; font-size: 14px; }
#changelist #toolbar input[type="submit"] { height: 35px; padding: 6px 20px; border: 0; border-radius: 0; background: #3b3b3b; color: #fff; box-shadow: none; font-size: 14px; cursor: pointer; }
#changelist #toolbar input[type="submit"]:hover { background: #222; }
#changelist #toolbar .help { margin: 5px 0 0; padding: 0; text-align: right; font-size: 12px; color: #707070; }
#changelist #toolbar .small { font-size: 12px; }
#changelist #changelist-filter.cms-filters {
  position: static;
  order: 2;
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 8px;
  width: auto;
  max-height: none;
  margin: 0 0 16px;
  padding: 0;
  border: 0;
  background: #fff;
}
#changelist-filter details { position: relative; margin: 0; padding: 0; border: 1px solid #ddd; background: #fff; }
#changelist-filter details summary { margin: 0; padding: 6px 12px; font-size: 13px; cursor: pointer; }
#changelist-filter details > summary::before { content: "▾"; padding-right: 6px; color: #666; }
#changelist-filter details[open] > summary::before { content: "▴"; }
#changelist-filter details ul { position: absolute; z-index: 10; left: -1px; top: 100%; box-sizing: border-box; min-width: 180px; max-height: 320px; overflow: auto; margin: 0; padding: 8px 0; border: 1px solid #ddd; background: #fff; box-shadow: 0 4px 12px #0000000d; }
#changelist-filter li { padding: 0; border: 0; }
#changelist-filter li.selected { margin: 0; padding: 0; border: 0; }
#changelist-filter li a { display: block; padding: 5px 14px; color: #444; }
#changelist-filter li a:hover, #changelist-filter li.selected a { background: #fff3ee; color: #b82f28; }
.cms-filter-reset { padding: 6px; font-size: 12px; }
#changelist #changelist-form { order: 3; width: 100%; min-width: 0; }
#changelist .actions { box-sizing: border-box; padding: 9px 10px; border: 1px solid #ddd; border-bottom: 0; background: #fafafa; color: #666; }
#changelist .actions label { font-size: 12px; }
#changelist .actions select { height: 30px; border-radius: 0; }
#changelist .actions .button { height: 30px; padding: 3px 12px; border: 1px solid #ccc; border-radius: 0; background: #fff; color: #333; }
#changelist .actions .action-counter, #changelist .actions .all, #changelist .actions .question, #changelist .actions .clear { font-size: 12px; }
#changelist .results { width: 100%; overflow-x: auto; }
#changelist table { width: 100%; border-collapse: collapse; border: 1px solid #d6d6d6; }
#changelist table thead th { height: 50px; padding: 0 12px; border: 1px solid #d6d6d6; background: #f4f4f4; color: #222; text-align: center; vertical-align: middle; font-size: 14px; font-weight: 600; }
#changelist table thead th .text a { padding: 0; color: #222; }
#changelist table thead th .text span { padding: 0; }
#changelist table tbody th, #changelist table tbody td { box-sizing: border-box; height: 104px; padding: 16px 12px; border: 1px solid #d6d6d6; background: #fff; color: #555; font-size: 14px; line-height: 1.6; vertical-align: middle; font-weight: 400; }
#changelist table tbody tr:hover th, #changelist table tbody tr:hover td { background: #fcfcfc; }
#changelist table tbody tr.selected th, #changelist table tbody tr.selected td { background: #fff7ed; }
#changelist .column-action_checkbox, #changelist td.action-checkbox { width: 36px; min-width: 36px; padding: 8px; text-align: center; }
#changelist .column-number, #changelist .field-number { width: 64px; text-align: center; }
#changelist .column-is_published, #changelist .field-is_published { width: 105px; text-align: center; }
#changelist .field-is_published select { width: 90px; height: 34px; padding: 4px 9px; border: 1px solid #ddd; border-radius: 0; background: #fff; color: #555; font-size: 13px; }
#changelist .column-logo_preview, #changelist .field-logo_preview { width: 125px; text-align: center; }
.customer-logo { display: inline-block; width: 104px; max-height: 60px; object-fit: contain; vertical-align: middle; }
.no-image { color: #777; font-size: 12px; }
#changelist .field-name, #changelist .field-project_name { min-width: 150px; white-space: normal; overflow-wrap: anywhere; }
#changelist .field-category { min-width: 100px; }
#changelist .field-registration_date { white-space: nowrap; text-align: center; }
#changelist .column-management, #changelist .field-management { width: 128px; min-width: 128px; text-align: center; white-space: nowrap; }
#changelist a.row-button { display: inline-block; padding: 3px 9px; border-radius: 3px; color: #fff; font-size: 13px; line-height: 1.6; text-decoration: none; }
#changelist a.row-button.edit { background: #1674cf; }
#changelist a.row-button.delete { background: #e52c35; }
#changelist a.row-button:hover { filter: brightness(.88); }
#changelist .paginator { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; margin-top: 16px; padding: 12px 0; border: 0; background: #fff; font-size: 13px; }
#changelist .paginator input { margin-left: auto; border-radius: 0; padding: 8px 20px; }
#changelist .paginator a, #changelist .paginator .this-page { border-radius: 0; }
.cms-save-hint { margin: 0; padding: 4px 0; color: #666; font-size: 12px; }
.form-row { padding: 17px 15px; }
input, textarea, select, .vTextField { border-radius: 0; }
input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="url"], textarea, select { border: 1px solid #d6d6d6; padding: 7px 9px; }
.submit-row { margin-top: 24px; padding: 16px; border: 1px solid #ddd; border-radius: 0; }
.button, input[type="submit"], input[type="button"], .submit-row input, a.button { border-radius: 0; }
.aligned label { color: #444; }
.errorlist { color: #ba2121; }
.messagelist { margin-bottom: 20px !important; }
.dashboard #content { display: flex; flex-wrap: wrap; gap: 24px; width: 100%; margin: 0; }
.dashboard #content > h1 { flex: 0 0 100%; box-sizing: border-box; margin-bottom: 0; }
.dashboard #content-main { flex: 1 1 420px; width: auto; float: none; }
.dashboard #content-related { flex: 0 1 260px; width: auto; margin: 0; float: none; background: #fafafa; border: 1px solid #ddd; }
.dashboard .module table { width: 100%; }
.dashboard .module table td, .dashboard .module table th { padding: 16px; }
.dashboard .module caption { text-align: left; background: #f4f4f4; border: 1px solid #ddd; color: #333; }
.dashboard .module caption a { color: #333; }
.dashboard #content-related h2 { background: #f4f4f4; color: #333; }
#footer { box-sizing: border-box; padding: 36px 32px 24px; text-align: center; }
.cms-footer { color: #888; font-size: 10px; letter-spacing: 1.5px; }
body.login { background: #f7f7f7; }
body.login #container { width: 400px; max-width: calc(100% - 32px); margin: 12vh auto 0; border: 1px solid #ddd; border-top: 3px solid #ff4038; border-radius: 0; box-shadow: 0 6px 28px #00000005; }
body.login #header.cms-header { justify-content: center; min-height: 95px; padding: 20px; }
body.login #container > .main { width: 100%; padding: 0; }
body.login #content { padding: 10px 30px 24px; }
body.login #login-form .form-row { padding: 8px 0; }
body.login #login-form .form-row label { margin-bottom: 7px; font-size: 14px; }
body.login #login-form input[type="text"], body.login #login-form input[type="password"] { box-sizing: border-box; width: 100%; min-height: 42px; }
body.login .submit-row { padding: 15px 0 0; margin: 0; border: 0; background: #fff; }
body.login .submit-row input { width: 100%; min-height: 43px; margin: 0; background: #3b3b3b; }
body.login #footer { padding: 0 20px 22px; }
body.popup #container > .main { width: calc(100% - 40px); padding-top: 24px; }

@media (min-width: 1462px) {
  .cms-topnav-inner { padding: 0; }
}
@media (max-width: 1100px) {
  #container > .main { width: calc(100% - 48px); gap: 30px; padding-top: 45px; }
  .cms-sidebar { flex-basis: 180px; }
  .cms-sidebar h2 { padding-left: 16px; font-size: 21px; }
  .cms-sidebar nav { padding-left: 12px; }
  #content > h1 { font-size: 30px; }
  #header .admin-username { display: none; }
}
@media (max-width: 767px) {
  #header.cms-header { flex-direction: row; align-items: center; flex-wrap: wrap; min-height: 72px; padding: 17px 20px; gap: 15px; }
  #header .admin-wordmark { font-size: 29px; }
  #header #user-tools { width: auto; font-size: 11px; }
  #header #user-tools a, #header #logout-form button { padding: 6px 8px; }
  .cms-topnav { overflow-x: auto; }
  .cms-topnav-inner { width: max-content; min-width: 100%; padding: 0; }
  .cms-topnav a { min-width: 106px; min-height: 49px; padding: 0 15px; font-size: 14px; }
  #container > .main { display: block; width: calc(100% - 32px); padding-top: 26px; }
  .cms-sidebar { padding: 0 0 24px; }
  .cms-sidebar h2 { margin-bottom: 13px; border-left-width: 5px; font-size: 19px; line-height: 26px; }
  .cms-sidebar nav { flex-direction: row; flex-wrap: wrap; gap: 5px; padding: 0; }
  .cms-sidebar nav a { padding: 5px 10px; border: 1px solid #e4e4e4; font-size: 12px; }
  .cms-sidebar nav a[aria-current="page"] { border-color: #e74139; background: #fff7f5; }
  .cms-sidebar nav a[aria-current="page"]::before { content: none; }
  #content > h1 { padding-bottom: 16px; margin-bottom: 18px; font-size: 27px; }
  #content .cms-list-title { font-size: 16px; }
  #changelist #toolbar #searchbar { flex: 1 1 150px; width: 180px; }
  #changelist #toolbar .help { text-align: left; }
  #changelist table { min-width: 760px; }
  #changelist table tbody td, #changelist table tbody th { height: 85px; }
  #changelist .actions { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
  #changelist .actions label { display: flex; align-items: center; gap: 5px; }
  #changelist .actions .action-counter { margin: 0; }
  .dashboard #content { display: block; }
  .dashboard #content > h1 { margin-bottom: 20px; }
  .dashboard #content-related { margin-top: 24px; }
  .form-row { padding: 14px 10px; }
  .aligned .form-row input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), .aligned .form-row textarea { box-sizing: border-box; max-width: 100%; }
  #footer { padding-top: 24px; }
}