/* ==========================
   Base APM styles
   ========================== */

body {
  font-family: "Arial", "Helvetica", "sans-serif";
  background: #FFFFFF;
  color: #000000;
}

a {
  text-decoration: underline;
  color: #083D65;
  background: transparent;
}

a:hover {
  text-decoration: none;
  color: #333399;
  background: transparent;
}

img {
  border: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Tahoma", "Helvetica", "Georgia";
  color: #CC0000;
  background: transparent;
}

small {
  font-size: 14px;
}

.box1 {
  background: #E1E1E1;
  color: #000000;
}

.box2 {
  background: #FFFFFF;
  color: #000000;
}

.box3 {
  background: #d6edff;
  color: #083D65;
}

.box4 {
  background: transparent;
  color: #083D65;
}

.pad {
  padding: 6px;
}

.border {
  border: 2px solid #000000;
}

.w75 {
  width: 75px;
}

.w100 {
  width: 100px;
}

.w400 {
  width: 400px;
}

.wall {
  width: 90%;
}

.lnk a {
  display: block;
  height: 20px;
  text-decoration: none;
  background: #D3E4FB;
  color: #FF0000;
  font-weight: bold;
  text-align: center;
}

.lnk a:hover {
  display: block;
  height: 20px;
  text-decoration: none;
  background: #BCCBE0;
  color: #CA0000;
  font-weight: bold;
  text-align: center;
}

.header {
  background-color: #FFFFFF;
  color: #FFFFFF;
  border: 0px solid #111111;
  border-bottom: 0px !important;
}

.left {
  background-color: #FFFFFF;
  color: #000000;
  border-left: 0px solid #111111;
}

.left a {
  display: block;
  width: 120px;
  height: 20px;
  text-decoration: none;
  background: #0193CE;
  color: #FFFFFF;
  font-weight: bold;
}

.left a:hover {
  display: block;
  width: 120px;
  height: 20px;
  text-decoration: none;
  background: #CCCCFF;
  color: #CA0000;
  font-weight: bold;
}

.middle {
  background-color: #FFFFFF;
  color: #000000;
  border-right: 0px solid #111111;
}

.right {
  background-color: #EEEEEE;
  color: #000000;
}

.footer {
  background-color: #DC0000;
  color: #FFFFFF;
  border: 0px solid #111111;
  border-top: 0px !important;
}

.d {
  background-color: #B6B6B6;
  color: #083D65;
}

.l {
  background-color: #CCCCCC;
  color: #083D65;
}

.br1 {
  line-height: 5px;
}

.ok {
  background: transparent;
  color: #009900;
  font-weight: bold;
}

.err {
  background: transparent;
  color: #CC0000;
}

.submit {
  border: 2px solid #000066;
  background-color: #FFFFFF;
  padding: 6px;
  font-family: "Verdana", "Arial", "sans-serif";
  font-weight: bold;
  cursor: default;
}

#submitpad {
  padding: 6px;
  background-color: #ff0000;
  margin: 0px;
  border-width: 2px;
  border-color: #ff0000;
  border-spacing: 0;
}

.main-content {
  padding: 10px;
  background-color: #E7E0B8;
}

.sidebar {
  padding: 6px;
  padding-top: 0px;
  background-color: #000033;
}

.sidebar #nav,
.sidebar ul {
  padding: 0px;
  margin: 0px;
}

.sidebar #nav li {
  list-style: none;
  background-color: #0193CE;
}

.sidebar #nav li a {
  font-size: 20px;
}

.sidebar #nav li ul li {
  background-color: #000033;
}

.sidebar #nav li ul li a {
  font-size: 16px;
}

.sidebar #nav a {
  color: #FFFFFF;
  font-weight: bold;
  text-decoration: none;
}

/* remove arrow at the right  */
.nav .dropdown-toggle::after {
  content: none;
}

.nav .dropdown {
  padding: 6px;
  margin: 0px 2px;
}

.nav .dropdown a {
  text-decoration: none;
}

.nav.pos-top .dropdown {
  display: inline;
}

.nav.pos-top.not-logged-in {
  justify-content: flex-end;
}

.nav.pos-side .dropdown {
  display: block;
}

/* ===== Datepicker trigger & calendar ===== */
.datepicker-trigger {
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #0d6efd;
}

.flatpickr-calendar {
    z-index: 99999 !important; /* Always above cards */
}

.flatpickr-calendar.fp-pop {
    border-radius: .5rem;
    box-shadow: 0 4px 18px rgba(0,0,0,0.15);
}

.form-check-input { border-color: #666; 
}

/* ============================================
   FINAL: APM FIELD + SWITCH SIZE CORRECTIONS
   ============================================ */

/* ---- Inputs, Selects, and Textareas (dark borders) ---- */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
select,
textarea,
.form-control,
.form-select {
    border-width: 2px !important;
    border-style: solid !important;
    border-color: #000066 !important;     /* dark default border */
    padding: 6px 10px !important;
    height: auto !important;
    box-sizing: border-box !important;
    font-size: 1rem !important;
    line-height: 1.4 !important;
    background-color: #FFFFFF !important;
    color: #000000 !important;
    transition: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Hover + Focus: ONLY border color changes */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):hover,
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus,
select:hover,
select:focus,
textarea:hover,
textarea:focus,
.form-control:hover,
.form-control:focus,
.form-select:hover,
.form-select:focus {
    border-color: #000033 !important;   /* darker on focus */
    box-shadow: none !important;
    outline: none !important;
}

/* ---- Resize dropdown arrow so it does not shift alignment ---- */
select.form-select {
    background-position: right 12px center !important;
    background-repeat: no-repeat !important;
}

/* ============================================
   SWITCH SIZE REDUCTION (balanced look)
   ============================================ */

.form-switch .form-check-input {
    width: 2.8em !important;      /* was 3.5em */
    height: 1.4em !important;     /* was 1.8em */
    transform: scale(1.15) !important;   /* slightly reduced */
    margin-top: 0 !important;
}

.form-switch .form-check-input:checked {
    background-color: #0d6efd !important;
}

.form-switch .form-check-label {
    font-size: 1rem !important;
    margin-left: 0.5rem !important;
    font-weight: 500 !important;
}

/* Ensure switch wrapper stays aligned */
.form-switch {
    padding-left: 3.5rem !important;
}

/* ============================================
   BUTTONS – MATCH FIELD APPEARANCE
   ============================================ */

.btn {
    border-width: 2px !important;
    border-style: solid !important;
    border-color: #000066 !important;
    padding: 6px 14px !important;
    line-height: 1.4 !important;
    font-size: 1rem !important;
    box-shadow: none !important;
}

.btn:hover,
.btn:focus {
    border-color: #000033 !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Make btn-sm consistent */
.btn-sm {
    font-size: 1rem !important;
    padding: 6px 14px !important;
    line-height: 1.4 !important;
}

/* ============================================
   APM CHECKBOX & RADIO FIX (Bootstrap override)
   ============================================ */

.form-check-input {
    border: 2px solid #000066 !important;
    background-color: #FFFFFF !important;
    box-shadow: none !important;
}

/* Checked state */
.form-check-input:checked {
    background-color: #0d6efd !important;
    border-color: #000066 !important;
}

/* Focus state */
.form-check-input:focus {
    border-color: #000033 !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Disabled */
.form-check-input:disabled {
    opacity: 0.6;
}

/* Radio buttons (same look) */
.form-check-input[type="radio"] {
    border-radius: 50% !important;
}

/* Checkbox square edges */
.form-check-input[type="checkbox"] {
    border-radius: 3px !important;
}

.mp-access-row {
  padding: .35rem .25rem;
  border-radius: .35rem;
}
.mp-access-row:hover {
  background: rgba(0,0,0,.03);
}

/* Restricted access grid sizing */
.mp-price-input,
.mp-drip-input {
  min-width: 110px;
}

/* Restricted access rows (Drip & Explicit) */
.restricted-row {
    background: #f8f9fa;            /* light gray like content area */
    border: 1px solid #e1e5ea;
    border-radius: 6px;
    padding: 6px 8px;
}

/* Slight hover cue (optional but nice) */
.restricted-row:hover {
    background: #eef3f7;
}

/* Keep inputs visually aligned */
.restricted-row .form-control-sm {
    height: 30px;
}
