/* ==========================================================================
   Skavenger dark theme - Concrete5 login / register page overrides
   Loaded via application/themes/concrete/elements/header.php override.
   Targets the concrete core UI theme (body.body-page-login, .login-page).
   ========================================================================== */

/* -- Page background ------------------------------------------------------- */
body.body-page-login {
  background-color: #0d0d0d !important;
  background-image: radial-gradient(ellipse at 50% 30%, rgba(108,63,255,0.10) 0%, transparent 65%) !important;
}

/* Register page shares the template but has no special body class;
   target via the presence of .login-page inside .main-container */
.main-container:has(.login-page) {
  background-color: #0d0d0d !important;
  background-image: radial-gradient(ellipse at 50% 30%, rgba(108,63,255,0.10) 0%, transparent 65%) !important;
  min-height: 100vh;
}

/* -- Card wrapper ---------------------------------------------------------- */
.login-page {
  background-color: #111122 !important;
  border: 1px solid #2a2a4a !important;
  box-shadow: 0 8px 40px rgba(0,0,0,0.6) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

/* -- Header strip inside card --------------------------------------------- */
.login-page .login-page-header {
  background: linear-gradient(135deg, #0d0920 0%, #1a1030 100%) !important;
  border-bottom: 1px solid #2a2a4a !important;
  padding: 36px 0 !important;
}

.login-page h2.login-page-title,
.login-page .login-page-title.h2 {
  color: #ffffff !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
}

/* Logo in header if shown */
.login-page .login-page-header img {
  filter: brightness(0) invert(1);
  opacity: 0.9;
}

/* -- Form content area ----------------------------------------------------- */
.login-page .login-page-content {
  background-color: #111122 !important;
  padding: 28px 32px !important;
}

/* -- Labels ---------------------------------------------------------------- */
.login-page .col-form-label,
.login-page label {
  color: #e0e0e0 !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

/* -- Inputs ---------------------------------------------------------------- */
.login-page .form-control {
  background-color: #181828 !important;
  border: 1px solid #2a2a4a !important;
  color: #e0e0e0 !important;
  border-radius: 4px !important;
  padding: 10px 14px !important;
}

.login-page .form-control:focus {
  border-color: #6c3fff !important;
  box-shadow: 0 0 0 3px rgba(108,63,255,0.2) !important;
  background-color: #181828 !important;
  color: #e0e0e0 !important;
  outline: none !important;
}

.login-page .form-control::-moz-placeholder { color: #505070 !important; font-style: normal !important; }
.login-page .form-control::placeholder      { color: #505070 !important; font-style: normal !important; }

/* -- Primary (Sign In / Register) button ---------------------------------- */
.login-page .btn-primary {
  background-color: #6c3fff !important;
  border-color: #6c3fff !important;
  color: #ffffff !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 10px 24px !important;
}

.login-page .btn-primary:hover,
.login-page .btn-primary:focus {
  background-color: #8a60ff !important;
  border-color: #8a60ff !important;
  color: #ffffff !important;
}

/* -- Secondary (Cancel) button -------------------------------------------- */
.login-page .btn-secondary {
  background-color: #181828 !important;
  border-color: #2a2a4a !important;
  color: #909090 !important;
  border-radius: 4px !important;
}

.login-page .btn-secondary:hover {
  background-color: #1e1e38 !important;
  border-color: #6c3fff !important;
  color: #a88bff !important;
}

/* -- Text links (Forgot Password, Sign up) -------------------------------- */
.login-page .btn-link,
.login-page a.btn-link,
.login-page .sign-up-container a {
  color: #a88bff !important;
  text-decoration: none !important;
}

.login-page .btn-link:hover,
.login-page a.btn-link:hover,
.login-page .sign-up-container a:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

/* -- Remember me / checkbox labels ---------------------------------------- */
.login-page .form-check-remember-me,
.login-page .form-check-label {
  color: #909090 !important;
  font-style: normal !important;
}

.login-page .form-check-input {
  background-color: #181828 !important;
  border-color: #2a2a4a !important;
}

.login-page .form-check-input:checked {
  background-color: #6c3fff !important;
  border-color: #6c3fff !important;
}

/* -- Sign up prompt -------------------------------------------------------- */
.login-page .sign-up-container {
  color: #909090 !important;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #2a2a4a;
}

/* -- Alert messages -------------------------------------------------------- */
.login-page .alert {
  border-radius: 4px !important;
  font-size: 0.9rem;
  padding: 12px 16px !important;
}

.login-page .alert-danger {
  background: rgba(231,76,60,0.12) !important;
  border: 1px solid rgba(231,76,60,0.4) !important;
  border-left: 3px solid #e74c3c !important;
  color: #f5a9a2 !important;
}

.login-page .alert-success {
  background: rgba(46,204,113,0.10) !important;
  border: 1px solid rgba(46,204,113,0.35) !important;
  border-left: 3px solid #2ecc71 !important;
  color: #a8f0c4 !important;
}

.login-page .alert-info {
  background: rgba(108,63,255,0.12) !important;
  border: 1px solid rgba(108,63,255,0.4) !important;
  border-left: 3px solid #6c3fff !important;
  color: #a88bff !important;
}

/* -- Dividers and misc text ------------------------------------------------ */
.login-page hr {
  border-color: #2a2a4a !important;
}

.login-page small,
.login-page .text-muted {
  color: #606060 !important;
}

/* -- The ccm-toolbar above the card (logo bar) ----------------------------- */
body.body-page-login div#ccm-toolbar {
  background-color: #0d0d18 !important;
  border-bottom-color: #2a2a4a !important;
}

body.body-page-login div#ccm-toolbar > ul > li > a {
  border-right-color: #2a2a4a !important;
  color: #909090 !important;
}

body.body-page-login div#ccm-toolbar > ul > li > a:hover {
  background-color: #1a1a2e !important;
  color: #ffffff !important;
}

body.body-page-login div#ccm-toolbar > ul li.ccm-logo span {
  border-right-color: #2a2a4a !important;
}

/* ==========================================================================
   Register page (body.min-vh-100 / .main-container layout)
   Scoped to :not(.body-page-login) because the login page also carries
   the min-vh-100 class and would otherwise get a second background box.
   ========================================================================== */

/* -- Page background ------------------------------------------------------- */
body.min-vh-100:not(.body-page-login) {
  background-color: #0d0d0d !important;
  background-image: radial-gradient(ellipse at 50% 30%, rgba(108,63,255,0.10) 0%, transparent 65%) !important;
}

body.min-vh-100:not(.body-page-login) .ccm-ui.min-vh-100 {
  background-color: #0d0d0d !important;
}

/* -- Toolbar --------------------------------------------------------------- */
body.min-vh-100:not(.body-page-login) #ccm-toolbar {
  background-color: #0d0d18 !important;
  border-bottom: 1px solid #2a2a4a !important;
}

body.min-vh-100:not(.body-page-login) #ccm-toolbar .ccm-toolbar-item-list > li > a,
body.min-vh-100:not(.body-page-login) #ccm-toolbar .ccm-toolbar-item-list > li > span {
  border-right-color: #2a2a4a !important;
  color: #909090 !important;
}

body.min-vh-100:not(.body-page-login) #ccm-toolbar .ccm-toolbar-item-list > li > a:hover {
  background-color: #1a1a2e !important;
  color: #ffffff !important;
}

/* -- Card / form container ------------------------------------------------- */
body:not(.body-page-login) .main-container {
  padding-top: 32px !important;
  padding-bottom: 48px !important;
}

body:not(.body-page-login) .main-container .main-container-inner {
  background-color: #111122 !important;
  border: 1px solid #2a2a4a !important;
  box-shadow: 0 8px 40px rgba(0,0,0,0.6) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  padding: 0 !important;
}

/* -- Page title header strip ----------------------------------------------- */
body:not(.body-page-login) .main-container .page-header {
  background: linear-gradient(135deg, #0d0920 0%, #1a1030 100%) !important;
  border-bottom: 1px solid #2a2a4a !important;
  margin: 0 !important;
  padding: 28px 32px !important;
}

body:not(.body-page-login) .main-container .page-header h1 {
  color: #ffffff !important;
  font-size: 1.4rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  margin: 0 !important;
}

/* -- Form content area ----------------------------------------------------- */
body:not(.body-page-login) .main-container .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body:not(.body-page-login) .main-container form.form-stacked {
  background-color: #111122 !important;
  padding: 24px 32px 32px !important;
}

/* -- Labels ---------------------------------------------------------------- */
body:not(.body-page-login) .main-container .form-label {
  color: #e0e0e0 !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

/* -- Inputs ---------------------------------------------------------------- */
body:not(.body-page-login) .main-container .form-control,
body:not(.body-page-login) .main-container .ccm-input-text,
body:not(.body-page-login) .main-container .ccm-input-password {
  background-color: #181828 !important;
  border: 1px solid #2a2a4a !important;
  color: #e0e0e0 !important;
  border-radius: 4px !important;
  padding: 10px 14px !important;
}

body:not(.body-page-login) .main-container .form-control:focus {
  border-color: #6c3fff !important;
  box-shadow: 0 0 0 3px rgba(108,63,255,0.2) !important;
  background-color: #181828 !important;
  color: #e0e0e0 !important;
  outline: none !important;
}

body:not(.body-page-login) .main-container .form-control::-moz-placeholder { color: #505070 !important; }
body:not(.body-page-login) .main-container .form-control::placeholder      { color: #505070 !important; }

/* -- Checkboxes ------------------------------------------------------------ */
body:not(.body-page-login) .main-container .form-check-input {
  background-color: #181828 !important;
  border-color: #2a2a4a !important;
}

body:not(.body-page-login) .main-container .form-check-input:checked {
  background-color: #6c3fff !important;
  border-color: #6c3fff !important;
}

body:not(.body-page-login) .main-container .form-check-label {
  color: #909090 !important;
}

/* -- Submit button --------------------------------------------------------- */
body:not(.body-page-login) .main-container .btn-primary,
body:not(.body-page-login) .main-container .ccm-input-submit {
  background-color: #6c3fff !important;
  border-color: #6c3fff !important;
  color: #ffffff !important;
  border-radius: 4px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 10px 24px !important;
  cursor: pointer !important;
}

body:not(.body-page-login) .main-container .btn-primary:hover,
body:not(.body-page-login) .main-container .ccm-input-submit:hover {
  background-color: #8a60ff !important;
  border-color: #8a60ff !important;
  color: #ffffff !important;
}

/* -- Form actions footer --------------------------------------------------- */
body:not(.body-page-login) .main-container .form-actions {
  border-top: 1px solid #2a2a4a !important;
  padding-top: 16px !important;
  margin-top: 8px !important;
}

/* -- Links ----------------------------------------------------------------- */
body:not(.body-page-login) .main-container a {
  color: #a88bff !important;
}

body:not(.body-page-login) .main-container a:hover {
  color: #ffffff !important;
}

/* -- Alert messages -------------------------------------------------------- */
body:not(.body-page-login) .main-container .alert {
  border-radius: 4px !important;
  font-size: 0.9rem;
  padding: 12px 16px !important;
}

body:not(.body-page-login) .main-container .alert-danger {
  background: rgba(231,76,60,0.12) !important;
  border: 1px solid rgba(231,76,60,0.4) !important;
  border-left: 3px solid #e74c3c !important;
  color: #f5a9a2 !important;
}

body:not(.body-page-login) .main-container .alert-success {
  background: rgba(46,204,113,0.10) !important;
  border: 1px solid rgba(46,204,113,0.35) !important;
  border-left: 3px solid #2ecc71 !important;
  color: #a8f0c4 !important;
}

body:not(.body-page-login) .main-container .alert-info {
  background: rgba(108,63,255,0.12) !important;
  border: 1px solid rgba(108,63,255,0.4) !important;
  border-left: 3px solid #6c3fff !important;
  color: #a88bff !important;
}

/* -- General text ---------------------------------------------------------- */
body:not(.body-page-login) .main-container,
body:not(.body-page-login) .main-container p,
body:not(.body-page-login) .main-container small,
body:not(.body-page-login) .main-container .text-muted {
  color: #909090 !important;
}