@charset "UTF-8";

/* FORCE 404 panel styling */
body.error404 .error-box.square {
  max-width: 640px !important;
  padding: 28px 26px !important;
  border-radius: 0px !important;
  background: rgba(0,0,0,0.35) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.35) !important;
}

/* Center the 404 box (vertically + horizontally) */
body.error404 .center-content-wrapper {
  min-height: 100vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Remove theme gutters so background reaches edges */
body.error404 #main,
body.error404 .wrapper,
body.error404 .container,
body.error404 .container-fluid {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
}

/* Make all text readable */
body.error404 .error-box-inner,
body.error404 .error-box-inner *,
body.error404 .error404 p {
  color: rgba(255,255,255,0.95) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.35) !important;
}

/* Hide the little spacer + "Oops!" */
body.error404 .dt-sc-hr-invisible-xsmall {
  display: none !important;
}
body.error404 .type1 h3 {
  display: none !important;
}
body.error404 .error-box-inner h3 {
  display: none !important;
}

/* Big 404 */
body.error404 .error-box-inner h2 {
  font-size: 92px !important;
  line-height: 0.95 !important;
  margin: 6px 0 10px !important;
}

/* Button */
/* 404 button – softer, translucent green */
body.error404 a.dt-sc-button.filled.small {
  background: rgba(91, 123, 44, 0.78) !important; /* #5B7B2C with transparency */
  border: 1px solid rgba(91, 123, 44, 0.9) !important;
  color: #ffffff !important;

  padding: 10px 22px !important;
  border-radius: 999px !important;

  font-weight: 500 !important;
  letter-spacing: 0.8px !important;
  text-transform: uppercase;

  box-shadow: 0 4px 10px rgba(0,0,0,0.25);
}

/* Hover – slightly richer, not heavier */
body.error404 a.dt-sc-button.filled.small:hover {
  background: rgba(91, 123, 44, 0.35) !important;
  border-color: rgba(91, 123, 44, 1) !important;
}

/* Ensure background covers fully (in case theme applies to body) */
body.error404 {
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll !important;
}


/* 404: make the background area full-bleed (edge-to-edge) */
body.error404,
body.error404 #main,
body.error404 .wrapper,
body.error404 .container,
body.error404 .container-fluid,
body.error404 .page-wrapper,
body.error404 #primary,
body.error404 #content {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* If the theme uses a boxed layout wrapper, force it full width */
body.error404 .type1 {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important; /* kills “boxed” centering gutters */
  margin-right: calc(50% - 50vw) !important;
  min-height: 100vh !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Ensure the background image behaves like a hero image */
body.error404 .type1 {
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

/* Center the panel (your error box) */
body.error404 .error-box.square {
  margin: 0 auto !important;
}

/* Hide the two helper lines under the headings */
body.error404 .center-content-wrapper p {
  display: none !important;
}

/* 404: brute-force center the box */
body.error404 .center-content-wrapper{
  position: relative !important;
  min-height: 100vh !important;
}

/* If the theme has top padding somewhere, kill it on 404 */
body.error404 .container,
body.error404 .center-content-wrapper,
body.error404 .center-content{
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* The actual box: center it regardless of theme layout */
/*body.error404 .error-box.square{
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
}*/

/* Center the whole 404 content block (box + button) */
body.error404 .center-content {
  position: absolute !important;
  top: 85% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

body.error404.admin-bar .center-content {
  top: calc(65% + 16px) !important;
}


/* Put the box back to normal flow */
body.error404 .error-box.square {
  position: static !important;
  transform: none !important;
  margin: 0 auto !important;
}

/* Ensure button sits under the box, centered */
body.error404 a.dt-sc-button.filled.small {
	margin-top: 22px !important;
  position: static !important;
  margin-top: 14px !important;
}


/* 404 button – Piscatorial green */
body.error404 a.dt-sc-button.filled.small {
  background: #5B7B2C !important;
  border-color: #5B7B2C !important;
  color: #ffffff !important;
}

/* Hover state – slightly darker, still natural */
body.error404 a.dt-sc-button.filled.small:hover {
  background: #4E6926 !important;
  border-color: #4E6926 !important;
}