:root{
  --bg: #f6f8fb;
  --card: #ffffff;
  --text: #0f172a;
  --muted: #64748b;
  --radius: 14px;
}

body{
  background: var(--bg) !important;
  color: var(--text);
}

/* Navbar */
.navbar{
  box-shadow: 0 8px 28px rgba(0,0,0,.12);
}
.navbar .navbar-brand{
  font-weight: 600;
  letter-spacing: .2px;
}

/* Container spacing */
.container{
  max-width: 1200px;
}

/* Cards */
.card{
  border: 0;
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: 0 10px 30px rgba(15,23,42,.08);
}
.card-header{
  background: #fff;
  border-bottom: 1px solid rgba(15,23,42,.08);
  font-weight: 600;
}

/* Tables */
.table{
  background: #fff;
}
.table-responsive{
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(15,23,42,.06);
}

/* Buttons & inputs */
.btn{
  border-radius: 10px;
}
.form-control, .form-select{
  border-radius: 10px;
  padding-top: .55rem;
  padding-bottom: .55rem;
}
.form-control:focus, .form-select:focus{
  box-shadow: 0 0 0 .2rem rgba(13,110,253,.15);
}

/* Headings */
h1,h2,h3{
  line-height: 1.2;
}

/* Better mobile spacing */
@media (max-width: 576px){
  .container{
    padding-left: 14px;
    padding-right: 14px;
  }
  .navbar .navbar-brand{
    font-size: 1rem;
  }
  .btn{
    width: 100%;
  }
  .d-flex.gap-2 > *{
    width: 100%;
  }
}
/* Visitor Pass sheet + watermark */
.pass-sheet{
  background: #fff;
  border-radius: 14px;
  padding: 16px;
  overflow: hidden;
}

/* watermark */
.pass-sheet::before{
  content: "";
  position: absolute;
  inset: 0;
  background: url("/static/img/logo.png") center/420px no-repeat;
  opacity: 0.06;     /* watermark strength */
  transform: rotate(-12deg);
  pointer-events: none;
}

.navbar .nav-link{
  color:#fff !important;
  padding: 14px 14px;
}
.navbar .nav-link:hover{
  opacity: .85;
}


:root{
  --konspec-red:#e31e24;
}

/* Konspec button */
.btn-konspec{
  background: var(--konspec-red);
  border-color: var(--konspec-red);
  color:#fff;
}
.btn-konspec:hover{
  background:#c8181d;
  border-color:#c8181d;
  color:#fff;
}

.btn-konspec.btn-sm{
  padding: .35rem .7rem;
}
.btn-konspec:disabled,
.btn-konspec.disabled{
  background: #f3a1a4;
  border-color: #f3a1a4;
  color: #fff;
  opacity: .8;
  cursor: not-allowed;
}

.btn-primary,
.btn-success,
.btn-danger,
.btn-warning,
.btn-info{
  background: var(--konspec-red) !important;
  border-color: var(--konspec-red) !important;
  color:#fff !important;
}
.btn-primary:hover,
.btn-success:hover,
.btn-danger:hover,
.btn-warning:hover,
.btn-info:hover{
  background:#c8181d !important;
  border-color:#c8181d !important;
  color:#fff !important;
}

.pass-sheet{
  position: relative;
  background: #fff;
  border-radius: 14px;
  padding: 16px;
  overflow: hidden;
}


.btn-primary,
.btn-success,
.btn-danger,
.btn-warning,
.btn-info {
  background: var(--konspec-red) !important;
  border-color: var(--konspec-red) !important;
  color: #fff !important;
}
.btn-primary:hover,
.btn-success:hover,
.btn-danger:hover,
.btn-warning:hover,
.btn-info:hover {
  background: #c8181d !important;
  border-color: #c8181d !important;
}