/* app.css — self-hosted replacement for Bootstrap 5.3's grid, utilities and the
   handful of components our own CSS doesn't already style. No CDN, no Bootstrap.
   Metrics match Bootstrap 5.3 exactly (spacing scale, breakpoints, 1.5rem
   gutter) so the existing 60 templates render unchanged.
   Component LOOK (btn/card/badge/alert/table/form) lives in base.html /
   public_base.html; this file provides only what those rely on Bootstrap for. */

/* ─────────────── Grid ─────────────── */
.container,.container-fluid{width:100%;margin-inline:auto;padding-inline:.75rem}
.container{max-width:1140px}
.row{--gx:1.5rem;--gy:0;display:flex;flex-wrap:wrap;margin-top:calc(-1*var(--gy));
     margin-right:calc(-.5*var(--gx));margin-left:calc(-.5*var(--gx))}
.row>*{box-sizing:border-box;flex-shrink:0;width:100%;max-width:100%;
       padding-right:calc(.5*var(--gx));padding-left:calc(.5*var(--gx));margin-top:var(--gy)}
.col{flex:1 0 0%}
.col-auto{flex:0 0 auto;width:auto}
.col-1{flex:0 0 auto;width:8.3333%}.col-2{flex:0 0 auto;width:16.6667%}
.col-3{flex:0 0 auto;width:25%}.col-4{flex:0 0 auto;width:33.3333%}
.col-5{flex:0 0 auto;width:41.6667%}.col-6{flex:0 0 auto;width:50%}
.col-7{flex:0 0 auto;width:58.3333%}.col-8{flex:0 0 auto;width:66.6667%}
.col-9{flex:0 0 auto;width:75%}.col-10{flex:0 0 auto;width:83.3333%}
.col-11{flex:0 0 auto;width:91.6667%}.col-12{flex:0 0 auto;width:100%}
.g-0{--gx:0;--gy:0}.g-1{--gx:.25rem;--gy:.25rem}.g-2{--gx:.5rem;--gy:.5rem}
.g-3{--gx:1rem;--gy:1rem}.g-4{--gx:1.5rem;--gy:1.5rem}.g-5{--gx:3rem;--gy:3rem}
.gx-0{--gx:0}.gx-3{--gx:1rem}.gx-4{--gx:1.5rem}
.gy-0{--gy:0}.gy-3{--gy:1rem}.gy-4{--gy:1.5rem}

@media(min-width:576px){
  .col-sm{flex:1 0 0%}.col-sm-auto{flex:0 0 auto;width:auto}
  .col-sm-3{flex:0 0 auto;width:25%}.col-sm-4{flex:0 0 auto;width:33.3333%}
  .col-sm-6{flex:0 0 auto;width:50%}.col-sm-12{flex:0 0 auto;width:100%}
}
@media(min-width:768px){
  .col-md{flex:1 0 0%}.col-md-auto{flex:0 0 auto;width:auto}
  .col-md-2{flex:0 0 auto;width:16.6667%}.col-md-3{flex:0 0 auto;width:25%}
  .col-md-4{flex:0 0 auto;width:33.3333%}.col-md-5{flex:0 0 auto;width:41.6667%}
  .col-md-6{flex:0 0 auto;width:50%}.col-md-8{flex:0 0 auto;width:66.6667%}
  .col-md-10{flex:0 0 auto;width:83.3333%}.col-md-12{flex:0 0 auto;width:100%}
  .d-md-flex{display:flex!important}.d-md-block{display:block!important}
  .d-md-inline{display:inline!important}.d-md-none{display:none!important}
}
@media(min-width:992px){
  .col-lg{flex:1 0 0%}.col-lg-auto{flex:0 0 auto;width:auto}
  .col-lg-3{flex:0 0 auto;width:25%}.col-lg-4{flex:0 0 auto;width:33.3333%}
  .col-lg-5{flex:0 0 auto;width:41.6667%}.col-lg-6{flex:0 0 auto;width:50%}
  .col-lg-7{flex:0 0 auto;width:58.3333%}.col-lg-8{flex:0 0 auto;width:66.6667%}
  .col-lg-12{flex:0 0 auto;width:100%}
  .order-lg-1{order:1}.order-lg-2{order:2}
  .d-lg-flex{display:flex!important}.d-lg-block{display:block!important}
  .d-lg-none{display:none!important}
}
@media(min-width:1200px){.col-xl-3{flex:0 0 auto;width:25%}}

/* ─────────────── Spacing (0=0 1=.25 2=.5 3=1 4=1.5 5=3rem) ─────────────── */
.m-0{margin:0}.m-1{margin:.25rem}.m-2{margin:.5rem}.m-3{margin:1rem}.m-4{margin:1.5rem}.m-5{margin:3rem}.m-auto{margin:auto}
.mt-0{margin-top:0}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:1rem}.mt-4{margin-top:1.5rem}.mt-5{margin-top:3rem}.mt-auto{margin-top:auto}
.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:1rem}.mb-4{margin-bottom:1.5rem}.mb-5{margin-bottom:3rem}
.ms-0{margin-left:0}.ms-1{margin-left:.25rem}.ms-2{margin-left:.5rem}.ms-3{margin-left:1rem}.ms-auto{margin-left:auto}
.me-0{margin-right:0}.me-1{margin-right:.25rem}.me-2{margin-right:.5rem}.me-3{margin-right:1rem}.me-auto{margin-right:auto}
.mx-1{margin-inline:.25rem}.mx-2{margin-inline:.5rem}.mx-3{margin-inline:1rem}.mx-auto{margin-inline:auto}
.my-0{margin-block:0}.my-1{margin-block:.25rem}.my-2{margin-block:.5rem}.my-3{margin-block:1rem}.my-4{margin-block:1.5rem}.my-5{margin-block:3rem}
.p-0{padding:0}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-3{padding:1rem}.p-4{padding:1.5rem}.p-5{padding:3rem}
.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pt-3{padding-top:1rem}.pt-4{padding-top:1.5rem}.pt-5{padding-top:3rem}
.pb-0{padding-bottom:0}.pb-1{padding-bottom:.25rem}.pb-2{padding-bottom:.5rem}.pb-3{padding-bottom:1rem}.pb-4{padding-bottom:1.5rem}.pb-5{padding-bottom:3rem}
.ps-1{padding-left:.25rem}.ps-2{padding-left:.5rem}.ps-3{padding-left:1rem}
.pe-1{padding-right:.25rem}.pe-2{padding-right:.5rem}.pe-3{padding-right:1rem}
.px-1{padding-inline:.25rem}.px-2{padding-inline:.5rem}.px-3{padding-inline:1rem}.px-4{padding-inline:1.5rem}
.py-0{padding-block:0}.py-1{padding-block:.25rem}.py-2{padding-block:.5rem}.py-3{padding-block:1rem}.py-4{padding-block:1.5rem}.py-5{padding-block:3rem}

/* ─────────────── Display / Flex ─────────────── */
.d-none{display:none}.d-inline{display:inline}.d-inline-block{display:inline-block}
.d-block{display:block}.d-flex{display:flex}.d-inline-flex{display:inline-flex}.d-grid{display:grid}
.flex-row{flex-direction:row}.flex-column{flex-direction:column}
.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}
.flex-grow-0{flex-grow:0}.flex-grow-1{flex-grow:1}.flex-shrink-0{flex-shrink:0}
.justify-content-start{justify-content:flex-start}.justify-content-end{justify-content:flex-end}
.justify-content-center{justify-content:center}.justify-content-between{justify-content:space-between}
.justify-content-around{justify-content:space-around}.justify-content-evenly{justify-content:space-evenly}
.align-items-start{align-items:flex-start}.align-items-end{align-items:flex-end}
.align-items-center{align-items:center}.align-items-stretch{align-items:stretch}.align-items-baseline{align-items:baseline}
.align-self-center{align-self:center}.align-self-end{align-self:flex-end}
.gap-0{gap:0}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:1rem}.gap-4{gap:1.5rem}.gap-5{gap:3rem}

/* ─────────────── Text / sizing / misc utilities ─────────────── */
.text-start{text-align:left}.text-center{text-align:center}.text-end{text-align:right}
.fw-normal{font-weight:400}.fw-medium{font-weight:500}.fw-semibold{font-weight:600}.fw-bold{font-weight:700}
.fst-italic{font-style:italic}
.text-uppercase{text-transform:uppercase}.text-lowercase{text-transform:lowercase}.text-capitalize{text-transform:capitalize}
.text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.text-nowrap{white-space:nowrap}.text-decoration-none{text-decoration:none}
.text-white{color:#fff!important}.text-muted{color:var(--text-muted)!important}
.text-primary{color:var(--primary)!important}.text-success{color:var(--success)!important}
.text-danger{color:var(--danger)!important}.text-warning{color:var(--warning)!important}
.text-info{color:#0aa2c0!important}.text-secondary{color:#6c757d!important}.text-dark{color:#212529!important}
.small{font-size:.875em}.lead{font-size:1.25rem;font-weight:300}
.lh-1{line-height:1}.lh-sm{line-height:1.25}
.w-25{width:25%}.w-50{width:50%}.w-75{width:75%}.w-100{width:100%}.w-auto{width:auto}
.h-100{height:100%}.h-auto{height:auto}.mw-100{max-width:100%}.mh-100{max-height:100%}
.vh-100{height:100vh}.min-vh-100{min-height:100vh}
.position-relative{position:relative}.position-absolute{position:absolute}
.position-fixed{position:fixed}.position-sticky{position:sticky}
.top-0{top:0}.bottom-0{bottom:0}.start-0{left:0}.end-0{right:0}
.border{border:1px solid var(--border)}.border-0{border:0}.border-top{border-top:1px solid var(--border)}
.rounded{border-radius:.375rem}.rounded-0{border-radius:0}.rounded-circle{border-radius:50%}
.rounded-pill{border-radius:50rem}.rounded-3{border-radius:.5rem}
.shadow-sm{box-shadow:0 .125rem .25rem rgba(0,0,0,.075)}
.shadow{box-shadow:0 .5rem 1rem rgba(0,0,0,.15)}.shadow-none{box-shadow:none}
.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}
.invisible{visibility:hidden}.visible{visibility:visible}.d-print-none{}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.fade{transition:opacity .15s linear}.fade:not(.show){opacity:0}.collapse:not(.show){display:none}
.img-fluid{max-width:100%;height:auto}

/* ─────────────── Components Bootstrap owns (our CSS covers the rest) ─────────────── */
/* button variants not defined in base.html */
.btn-outline-secondary{border:1px solid #6c757d;color:#6c757d;background:transparent}
.btn-outline-secondary:hover{background:#6c757d;color:#fff}
.btn-outline-success{border:1px solid var(--success);color:var(--success);background:transparent}
.btn-outline-success:hover{background:var(--success);color:#fff}
.btn-outline-danger{border:1px solid var(--danger);color:var(--danger);background:transparent}
.btn-outline-danger:hover{background:var(--danger);color:#fff}
.btn-outline-dark{border:1px solid #212529;color:#212529;background:transparent}
.btn-outline-dark:hover{background:#212529;color:#fff}
.btn-outline-primary:hover{background:var(--primary);color:#fff}
.btn-link{background:none;border:none;color:var(--primary);text-decoration:underline;padding:8px 12px}
.btn-close{box-sizing:content-box;width:1em;height:1em;padding:.25em;border:0;border-radius:.375rem;
  background:transparent;opacity:.5;cursor:pointer;font-size:1.1rem;line-height:1;color:inherit}
.btn-close::before{content:"\00d7"}.btn-close:hover{opacity:.9}
.btn:disabled,.btn.disabled{opacity:.65;pointer-events:none}

/* tables */
.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* forms */
.form-label{display:block;margin-bottom:.4rem;font-weight:600;font-size:.9rem;color:var(--text,#233028)}
.form-control,.form-select{display:block;width:100%;padding:.5rem .75rem;font-size:.95rem;line-height:1.5;color:var(--text,#233028);background:var(--surface,#fff);border:1px solid var(--border,#d9e0d0);border-radius:6px;transition:border-color .15s ease,box-shadow .15s ease}
.form-control:focus,.form-select:focus{outline:0;border-color:var(--primary,#1C5A3B);box-shadow:0 0 0 .2rem rgba(28,90,59,.15)}
.form-control::placeholder{color:var(--text-muted,#8a978c)}
textarea.form-control{min-height:5rem}
.form-group{margin-bottom:1rem}
.form-control-lg{padding:.5rem .9rem;font-size:1.05rem}
.form-control-sm,.form-select-sm{padding:.25rem .5rem;font-size:.8rem}
.form-check{display:block;min-height:1.5rem;padding-left:1.6em;margin-bottom:.125rem}
.form-check-input{float:left;margin-left:-1.6em;width:1.1em;height:1.1em;margin-top:.2em;
  vertical-align:top;background:var(--surface,#fff);border:1px solid var(--border);border-radius:.25em;
  appearance:none;-webkit-appearance:none;cursor:pointer}
.form-check-input[type=radio]{border-radius:50%}
.form-check-input:checked{background:var(--primary);border-color:var(--primary)}
.form-check-input:checked[type=checkbox]{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");background-size:contain;background-repeat:no-repeat;background-position:center}
.form-check-label{cursor:pointer}
.form-switch{padding-left:2.5em}.form-switch .form-check-input{width:2em;margin-left:-2.5em;border-radius:2em}
.input-group{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%}
.input-group>.form-control,.input-group>.form-select{position:relative;flex:1 1 auto;width:1%;min-width:0}
.input-group-text{display:flex;align-items:center;padding:8px 12px;font-size:.9rem;color:var(--text-muted);
  background:var(--surface-header,#f5f5f2);border:1px solid var(--border)}
.input-group>:not(:first-child){margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}
.input-group>:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}
.invalid-feedback{display:none;width:100%;margin-top:.25rem;font-size:.85em;color:var(--danger)}
.is-invalid~.invalid-feedback,.was-validated :invalid~.invalid-feedback{display:block}
.is-invalid{border-color:var(--danger)!important}

/* modal */
.modal-open{overflow:hidden}
.modal{position:fixed;inset:0;z-index:1055;display:none;overflow:auto;outline:0}
.modal.show{display:block}
.modal-backdrop{position:fixed;inset:0;z-index:1050;background:#000;opacity:.5}
.modal-dialog{position:relative;width:auto;margin:1.75rem auto;max-width:500px;pointer-events:none}
.modal-dialog-centered{display:flex;align-items:center;min-height:calc(100% - 3.5rem)}
.modal-content{position:relative;display:flex;flex-direction:column;width:100%;pointer-events:auto;
  background:var(--surface,#fff);border:1px solid var(--border);border-radius:.5rem;box-shadow:0 .5rem 1rem rgba(0,0,0,.3)}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid var(--border)}
.modal-body{padding:1.25rem}
.modal-footer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.5rem;padding:1rem 1.25rem;border-top:1px solid var(--border)}
.modal-title{margin:0;font-size:1.1rem;font-weight:700}

/* dropdown */
.dropdown{position:relative}
.dropdown-menu{position:absolute;z-index:1000;display:none;min-width:10rem;margin-top:.25rem;padding:.5rem 0;
  background:var(--surface,#fff);border:1px solid var(--border);border-radius:.5rem;box-shadow:0 .5rem 1rem rgba(0,0,0,.12);list-style:none}
.dropdown-menu.show{display:block}
.dropdown-menu-end{right:0;left:auto}
.dropdown-item{display:block;width:100%;padding:.4rem 1rem;color:var(--text);text-decoration:none;background:none;border:0;text-align:left;cursor:pointer;font-size:.9rem}
.dropdown-item:hover{background:var(--surface-header,#f2f1ed)}
.dropdown-divider{height:0;margin:.4rem 0;border-top:1px solid var(--border)}