/* ---------------------------------------------------------
 * WKHEOPS : Css de base
   --------------------------------------------------------- 
   Font
------------------------------------------------------------ */
@import url('https://fonts.googleapis.com/css?family=Ubuntu|Ubuntu+Condensed');

/* ---------------------------------------------------------
 * Variables
 * Changer apre le chargement de page par un script js
------------------------------------------------------------ */
:root
    {
      --backgroun-but-toolbox: transparent; /* wk2 */
      --backgroun-but-color: transparent;
      --wk-light-purple: #e0c3fc;
      --wk-light-blue: #8ec5fc;

      --wk-edit-leftborder: var(--bs-primary) ;
      --wk-label-color: var(--bs-primary) ;

      --c-glass: #bbbbbc;
      --c-light: #fff;
      --c-dark: #000;
      --glass-reflex-dark: 1;
      --glass-reflex-light: 1;
      --saturation: 150%;
    }

[data-bs-theme=dark] .table
    { --bs-table-color: var(--bs-gray-400);
    }

/* ---------------------------------------------------------
 * Tag
------------------------------------------------------------ */
html
    { overflow: hidden;
    }

body
    { font-family: "Ubuntu",sans-serif;
      background-color: darkgray;
    }

p   { font-size: 1.1em;
      font-weight: 300;
      line-height: 1.7em;
      color: #999;
    }

.mb-wt
    { margin-bottom: 1px;
    }

.mr-wt
    { margin-right: 4px;
    }

.ml-wt
    { margin-left: 5px;
    }

.start-70
    {
      left: 70% !important;
    }

.wkshortcut
    {
      font-size: 0.65em;
      vertical-align: super;
    }

#wk-icon img
    { width: 48px ;
      height: 48px;
      margin-left: 5px;
    }

.wk-loading
    {
      width: auto;
      height: auto;
      background-color: whitesmoke;
      border: 0;
      padding: 0px;
      margin: 0px;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 100;
    }

.wk-bg,
.wk-bg-empty
    { margin: 0.0em;
      padding: 0.0em;
      height: calc(100% - 58px);
      background-color: rgba(0,0,0,.4);
    }

.wk-bg-form
    { margin: 0.0em;
      padding: 0.0em;
      height: calc(100% - 58px);
    }

.wk-bg-img
    { background-size: cover;
    }

.wk-bg-orange
    { background-color: orange;
    }

.wk-txt-placeholder
    { background-color: #ccc !important;
      color: #ccc !important;
    }

.wk-slogan-photo
    {
      max-width: calc(100vw - 50px);
    }

.wk-slogan-button
    {
      max-width: calc(100vw - 100px);
    }

.photocredit
    {
      margin-right: 10px;
      margin-top: 7px;
      color: white;
      font-size: .75rem;
      line-height: 43px;
      text-shadow: 1px 1px 3px rgba(0,0,0,0.8) ,
                   0   0   6px rgba(0,0,0,0.5) ;
    }

.wk-bg-cloud
    { margin: 0.0em;
      padding: 0.0em;
      height: calc(100% - 58px);
      width: calc(100% + 12px);
      background-color: rgba(0,0,0,.4);
    }

.wk-bg-login
    {
      padding: 0px;
      height: calc(100% - 58px);
    }

.wk-bg-login .card,
.wk-bg-login .card-header
    {
      background-color: transparent;
      border: none ;
    }

.btn-block
    { width: 100%;
    }

.wk-btn-png
    { margin-top: 2px;
      margin-bottom: 2px;
    }

.wk-btn-spr
    { margin-top: 0px;
      margin-bottom: 0px;
      margin-left: 0px;
      margin-right: 4px;
      border-color: transparent;
      padding-top: 0px;
      padding-bottom: 0px;
    }

.wk-btn-clr
    { margin: 0px;
      border: 0px;
      padding: 0px;
    }

.btn.show
    { border-color: transparent;
    }

.wk-btn-spr-page
    { padding: 0.25rem 0.25rem !important;
    }

.wk-btn-attention
    { font-size: 1.3rem;
      padding-bottom: 0.0rem;
      padding-top: 0.0rem;
      padding-right: 1.0rem;
      padding-left: 1.0rem;
    }

.wk-btn-attention-spr
    { padding-bottom: 0.0rem;
      padding-top: 0.0rem;
      padding-right: 1.0rem;
      padding-left: 1.0rem;
    }

.wk-btn-dia
    { background-color: var(--bs-primary);
      color: white;
      width: 100%;
    }

.wk-texte
    { display: block;
    }

.wk-texte p
    { color: black ;
    }

.wk-input-right
    { text-align: right;
    }

.wk-input-center
    { text-align: center;
    }

.wk-check-texte
    { background-color: var(--bs-secondary-bg);
      padding: 17px 5px 0px 17px !important;
      line-height: 1.0 !important;
    }

.wk-check-texte a
    { text-decoration: underline !important;
    }

.wk-check-float
    { border-color: var(--bs-secondary-border-subtle);
      opacity: 1;
    }

.btn-titel
   {
      background: linear-gradient(135deg,
                  rgba(255, 255, 255, 0.18) 0%,
                  rgba(255, 255, 255, 0.08) 100%);
      border: 1px solid rgba(255, 255, 255, 0.25);
      border-radius: 10px;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08),
                  inset 0 1px 0 rgba(255, 255, 255, 0.15);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      transition: all 0.2s ease;
   }

.btn-titel:hover
   {
      background: linear-gradient(135deg,
                  rgba(255, 255, 255, 0.25) 0%,
                  rgba(255, 255, 255, 0.12) 100%);
      border: 1px solid rgba(255, 255, 255, 0.4);
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12),
                  inset 0 1px 0 rgba(255, 255, 255, 0.25);
      transform: translateY(-1px);
   }

.btn-titel-blue
   {
      background: linear-gradient(135deg,
                  rgba(13, 110, 253, 0.7) 0%,
                  rgba(13, 110, 253, 0.5) 100%);
      border: 1px solid rgba(255, 255, 255, 0.25);
      border-radius: 10px;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08),
                  inset 0 1px 0 rgba(255, 255, 255, 0.2);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      color: white !important;
      transition: all 0.2s ease;
   }

.btn-titel-blue i
   {
      color: white !important;
   }

.btn-titel-blue:hover
   {
      background: linear-gradient(135deg,
                  rgba(13, 110, 253, 0.9) 0%,
                  rgba(13, 110, 253, 0.7) 100%);
      border: 1px solid rgba(255, 255, 255, 0.5);
      box-shadow: 0 4px 14px rgba(13, 110, 253, 0.4),
                  inset 0 1px 0 rgba(255, 255, 255, 0.35);
      color: white;
      transform: translateY(-1px) scale(1.05);
   }

.btn-header
   {
      background: linear-gradient(135deg,
                  rgba(255, 255, 255, 0.18) 0%,
                  rgba(255, 255, 255, 0.08) 100%);
      border: 1px solid rgba(255, 255, 255, 0.25);
      font-size: 20px;
      border-radius: 10px;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08),
                  inset 0 1px 0 rgba(255, 255, 255, 0.15);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      transition: all 0.2s ease;
   }

.btn-header:hover
   {
      background: linear-gradient(135deg,
                  rgba(255, 255, 255, 0.25) 0%,
                  rgba(255, 255, 255, 0.12) 100%);
      border: 1px solid rgba(255, 255, 255, 0.4);
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12),
                  inset 0 1px 0 rgba(255, 255, 255, 0.25);
      transform: translateY(-1px);
   }

.btn-arround
   {
      background-color: transparent;
   }

.input-group-wk
    { margin-bottom: 1px !important ;
    }

.input-group-custom-wk
    { max-height: 25.6px;
      margin-bottom: 2px;
    }

.wk-badge
    { text-align: left;
      font-size: 90%;
    }
.wk-badge-sm
    { text-align: left;
      font-size: 75%;
    }

.text-bg-primary
    {
      --bs-bg-opacity: 0.7;
      text-shadow: 1px 1px 3px rgba(0,0,0,0.8) ,
                    0   0   6px rgba(0,0,0,0.5) ;
    }

/* ---------------------------------------------------------
   Boite de dialog
------------------------------------------------------------ */
.btn-wkheader:hover
     { color:var(--bs-dark);
       box-shadow: none;
     }

.btn-wkheader:focus
     { color:var(--bs-dark);
       box-shadow: none;
     }

.btn-wkheader
     {
       color: var(--bs-light);
       text-shadow: 1px 1px 3px rgba(0,0,0,0.8) ,
                    0   0   6px rgba(0,0,0,0.5) ;
       border-width: 0;
       padding-bottom: 0.3rem;
       padding-top: 0.0rem;
     }

.btn-wkheader-right
     { padding-right: 1.0rem;
       padding-left: 1.0rem;
     }

.btn-wkheader-left
     { padding-right: 0.3rem;
       padding-left: 0rem;
     }

.container-dialog
    { padding: 0px;
      margin: 0px;
    }

.modal-wtcontentbody
    {
      height: calc(100vh - 98px);
      align-items: start;
      margin: 0px;
    }

.modal-wtcontent
    {
      border-width: 0px ;
    }

[data-bs-theme=light]
    {
      .modal-body-verybig,
      .modal-body-big,
      .modal-body-medium,
      .modal-body-small
         {
           background: linear-gradient(135deg, var(--wk-light-purple) 0%, var(--wk-light-blue) 100%);
         }
    }

[data-bs-theme=dark]
    {
      .modal-body-verybig,
      .modal-body-big,
      .modal-body-medium,
      .modal-body-small
         {
           background: #2a2a2e;
         }
    }


.modal-dialog-big
    { max-width: 1000px;
    }

.modal-dialog-medium {
    max-width: 800px;
}

.modal-body-big {
    min-height: 400px;
}

.modal-body-verybig {
    min-height: calc(100vh - 200px) ;
}

.modal-verybig {
    max-width: calc(100vw - 100px);
}

.modal-body-medium {
    min-height: 300px;
}

.modal-wkheader
     {
       --bs-bg-opacity: 0.7;
       background-color: rgba(var(--bs-primary-rgb),var(--bs-bg-opacity)) !important;
       color: var(--bs-light);
       text-shadow: 1px 1px 3px rgba(0,0,0,0.8) ,
                    0   0   6px rgba(0,0,0,0.5) ;
       padding-bottom: 0.0rem;
       padding-top: 0.3rem;
       padding-right: 0.1rem;
       padding-left: 1.1rem;
       line-height: 1.8;
     }

.modal-wkheader-form
     {
       background-color: var(--bs-primary);
       color: white;
       padding-bottom: 0.0rem;
       padding-top: 0.3rem;
       padding-right: 0.1rem;
       padding-left: 1.1rem;
       line-height: 1.8;
     }

.modal-header-btn1
     { display: grid;
       grid-template-columns: 1fr ;
     }

.modal-header-btn2
     { display: grid;
       grid-template-columns: 1fr 1fr ;
     }

.modal-header-btn3
     { display: grid;
       grid-template-columns: 1fr 1fr 1fr ;
     }

.container-dialog
     { min-width: 100%;
     }

.alert-spr
     { padding: 1px;
       padding-left: 5px;
       margin: 0px;
       margin-bottom: 4px;
     }

.pagination-wk
     { margin-top: 0px;
       margin-bottom: 4px;
     }

.page-link-wk
     { font-size: .675rem !important;
       padding: 2px 5px !important;
       margin: 2px 0px 2px 0px !important;
     }

.wt-shadow
     { background-color: var(--bs-secondary-bg);
     }

.bg-wkheader
     { background-color: var(--bs-primary);
     }

.modal-wkheader h5
     { line-height: 1.5;
     }

.bg-wkmenu
     { background-color: var(--bs-body-bg);
       min-height: 35px;
       max-height: 35px;
     }

.nav-link.wk-onglet
     { border: 1px solid transparent;
       border-left: 4px solid transparent;
       padding-bottom: 0.1rem;
       padding-top: 0.3rem;
       padding-right: 0.4rem;
       padding-left: calc(0.4rem - 3px);
       color: var(--bs-light-text-emphasis);
       background-color: transparent;
     }

.nav-underline .nav-link.active
     { background-color: var(--bs-secondary-bg);
     }

[data-bs-theme=light]
    {
       .nav-underline .nav-link.active
       { background-color: var(--wk-light-purple);
       }
    }

ul.nav-underline
    { border-bottom: solid;
      border-color: lightgray;
      column-gap: 8px;
    }

@media (max-width: 400px)
     { .bg-wkmenu,
       .nav-link,
       .nav-link.wk-onglet
          { padding-left: 2px;
            padding-right: 2px;
          }
       .nav-underline
          { column-gap: 2px;
            font-size: 11px;
          }
     }


.wk-break
     { background-color: transparent;
       padding: .0rem .2rem;
       margin-top: 0.4rem;
       margin-bottom: 0.0rem;
       font-weight: bolder;
       font-size: medium;
       width: 100%;
     }


.text-divider{margin: 2em 0; line-height: 0; text-align: center;}
.text-divider span{background-color: #f5f5f5; padding: 1em;}
.text-divider:before{ content: " "; display: block; border-top: 1px solid #e3e3e3; border-bottom: 1px solid #f7f7f7;}

.wk-comment
     {
       font-size: 0.9rem;
       margin: 0px;
     }

.input-group-sm > .form-control[readonly]
    { box-shadow: 0 0 0 0 ;
      text-shadow: 0 0 0 #495057;
      background-color: var(--bs-secondary-bg);
      border-color: var(--bs-secondary-border-subtle);
    }

.input-group-sm > .form-select {
    padding-top: 0.1rem;
    padding-bottom: 0.1rem;
}

.input-group-lg > .form-control[readonly]
    { box-shadow: 0 0 0 0 ;
      color: transparent;
      text-shadow: 0 0 0 #495057;
      background-color: transparent;
      border-color: var(--bs-secondary-border-subtle);
    }

.form-control[readonly] :focus
    { outline: none;
    }

 .form-control-titel
    { font-weight: 600;
    }

.form-control-fload2
    { display: grid;
      grid-template-columns: 70px auto;
      grid-gap: 5px;
    }

 .input-group-sm > .form-control-wt,
 #inputGroup-sizing-sm,
 .input-group .form-control-wt .select
    { padding-top: .1rem;
      padding-bottom: .1rem;
      padding-left: .25rem;
      padding-right: .25rem;
      height: 1.6rem;
    }

.form-header
    { background-color: var(--bs-secondary-bg);
      border-color: var(--bs-secondary-border-subtle)
    }

.input-group-sm > .form-control:not(textarea)
    { height: 1.6rem;
    }

.input-group-sm select.form-control:not([size]):not([multiple])
{
  padding-top: .2rem;
  padding-bottom: .1rem;
  height: 1.6rem;
}

.input-group-text-wk
       { background-color: transparent;
         border-color: transparent;
       }

.input-group-sm > .form-control:disabled
             {
               border-color: #bbbbbb;
             }

.input-group-lg > .form-control
             { padding-top: 0.6rem;
               padding-bottom: 0.6rem;
               font-size: 0.9rem;
               font-weight: 700;
             }

.input-group-lg > .form-control:disabled
             {
               border-color: transparent;
               background-color: transparent;
             }

.input-group-lg > div.form-control
             {
               border-color: transparent;
               background-color: transparent;
               margin-top: 0px;
               margin-bottom: 0px;
               padding-top: 0px;
               padding-bottom: 0px;
             }

/* ---------------------------------------------------------
   Formulaire
------------------------------------------------------------ */
.wk-bt-primary
       { background-color: var(--bs-primary);
         border-color: var(--bs-primary);
         color: #fff;
       }

/* ---------------------------------------------------------
   Formulaire 2 colonnes + image
------------------------------------------------------------ */
.wkform1c
      { padding: 0;
        margin: 0;
      }

.wkform1c-container
      { min-height: max(680px,calc(100vh - 250px));
        display: grid;
        grid-template-columns: 10% 1fr 1fr 10%;
        grid-template-rows: 1fr 65px 40px;
        grid-row-gap: 2px;
        grid-column-gap: 5px;
        grid-template-areas:
          "margeg body body marged"
          "margeg info info marged"
          "margeg foot foot marged" ;
      }

.wkform1c-mg
{ grid-area: margeg;
}

.wkform1c-body
{ background-color: #fff;
  grid-area: body;
}

.wkform1c-info
{ background-color: #fff;
  grid-area: info;
  padding: 2px;
}

.wkform1c-vide
{ display: none;
  background-color: #fff;
  grid-area: vide;
}

.wkform1c-md
{ grid-area: marged;
}

.wkform1c-footer
{ grid-area: foot;
  align-self: center;
}

@media (max-width: 1021px) {
    .wkform1c-container {
     grid-template-columns: 1fr 1fr;
     grid-template-rows: 1fr 70px 40px;
     grid-template-areas:
       "body body"
       "info info"
       "foot foot" ;
    }

    .wkform1c-mg {
        display: none;
    }
    .wkform1c-md {
        display: none;
    }
}

@media (max-width: 721px) {
    .wkform1c-container {
     grid-template-columns: 1fr ;
     grid-template-rows: 1fr 135px 40px;
     grid-template-areas:
       "body"
       "info"
       "foot";
    }

    .wkform1c-vide {
        display: none;
    }
}

.wkform2c
      { padding: 0;
        margin: 0;
      }

.wkform2c-container
      { min-height: calc(100vh - 230px);
        display: grid;
        grid-template-columns: 8% 2fr 1fr 8%;
        grid-template-rows: 140px 1fr 40px;
        grid-row-gap: 10px;
        grid-column-gap: 10px;
        grid-template-areas:
          "margeg body infos marged"
          "margeg body image marged"
          "margeg foot foot marged" ;
      }

.wkform2c-mg
{ grid-area: margeg;
}

.wkform2c-body
{ background-color: #fff;
  grid-area: body;
}

.wkform2c-infos
{ background-color: #fff;
  grid-area: infos;
  padding: 10px;
}

.wkform2c-image
{ grid-area: image ;
  justify-self: center;
  align-self: center;
}

.wkform2c-image img
{ max-height: calc(100vh * .55);
}

.wkform2c-md
{ grid-area: marged;
}

.wkform2c-footer
{ grid-area: foot;
  align-self: center;
}

@media (max-width: 1021px) {
    .wkform2c-container {
     grid-template-columns: 2fr 1fr;
     grid-template-rows: 140px 1fr 40px;
     grid-template-areas:
       "body infos"
       "body image"
       "foot foot" ;
    }
    .wkform2c-mg {
        display: none;
    }
    .wkform2c-md {
        display: none;
    }
}

@media (max-width: 721px) {
    .wkform2c-container {
     grid-template-columns: 70px 1fr ;
     grid-template-rows: 120px 1fr 100px;
     grid-template-areas:
       "image infos"
       "body body"
       "foot foot";
    }
    .wkform2c-image
    { justify-self: left;
    }

    .wkform2c-image img
    { max-height: 90px ;
      margin-left: 5px ;
    }
}

.wkform2r
      { padding: 0;
        margin: 0;
      }

.wkform2r-container
      { min-height: calc(100vh - 240px);
        display: grid;
        grid-template-columns: 8% 2fr 1fr 8%;
        grid-template-rows: 10px 100px 1fr 40px;
        grid-row-gap: 10px;
        grid-column-gap: 10px;
        grid-template-areas:
          "margeg head head marged"
          "margeg body infos marged"
          "margeg body resume marged"
          "margeg foot foot marged" ;
      }

.wkform2r-mg
{ grid-area: margeg;
}

.wkform2r-header
{ grid-area: head;
}

.wkform2r-body
{ background-color: #fff;
  grid-area: body;
  padding-left: 4px;
  padding-top: 4px;
  padding-right: 4px;
}

.wkform2r-infos
{ background-color: #fff;
  grid-area: infos;
  padding: 10px;
}

.wkform2r-resume
{ grid-area: resume ;
}

.wkform2r-md
{ grid-area: marged;
}

.wkform2r-footer
{ grid-area: foot;
  align-self: center;
}

@media (max-width: 1021px) {
    .wkform2r-container {
     grid-template-columns: 2fr 1fr;
     grid-template-rows: 20px 100px 1fr 40px;
     grid-template-areas:
       "head head"
       "body infos"
       "body resume"
       "foot foot" ;
    }
    .wkform2r-mg {
        display: none;
    }
    .wkform2r-md {
        display: none;
    }
}

@media (max-width: 721px) {
    .wkform2r-container {
     grid-template-columns: 1fr ;
     grid-template-rows: 20px auto 1fr  minmax(40px, auto) 40px;
     grid-template-areas:
       "head"
       "resume"
       "body"
       "infos"
       "foot";
    }
}

.wkform3c
      { padding: 0;
        margin: 0;
      }

.wkform3c-container
      { min-height: calc(100vh - 250px);
        background-color: white;
        display: grid;
        grid-template-columns: 2% 1fr 2% 1fr 2%;
        grid-template-rows: 10px 130px 1fr 40px;
        grid-row-gap: 10px;
        grid-column-gap: 10px;
        grid-template-areas:
          "margg head head head margd"
          "margg info1 margc info2 margd"
          "margg body1 margc body2 margd"
          "margg foot foot foot margd" ;
      }

.wkform3c-mg    { grid-area: margg ; }
.wkform3c-mc    { grid-area: margc ; }
.wkform3c-md    { grid-area: margd ; }
.wkform3c-body1 { grid-area: body1 ; }
.wkform3c-info1 { grid-area: info1 ; }
.wkform3c-body2 { grid-area: body2 ; }
.wkform3c-info2 { grid-area: info2 ; }

.wkform3c-body1,
.wkform3c-body2
{ border-radius: 8px;
  padding: 5px;
}

.wkform3c-info1,
.wkform3c-info2
{ border-radius: 8px;
  padding: 10px;
  background-color: var(--bs-secondary-bg-subtle) ;
}

.wkform3c-header
{ grid-area: head;
  justify-self: start;
  align-self: center;
}

.wkform3c-footer
{ grid-area: foot;
  align-self: center;
  background-color: transparent;
}

.wkform3c-mg,
.wkform3c-mc,
.wkform3c-md
       { background-color: transparent;
       }

@media (max-width: 1028px) {
    .wkform3c-container {
     grid-template-columns: 3% 1fr 3% ;
     grid-template-rows: 10px 140px 1fr 10px 140px 1fr 40px;
     grid-template-areas:
        "margg head margd"
        "margg info1 margd"
        "margg body1 margd"
        "margg margc margd"
        "margg info2 margd"
        "margg body2 margd"
        "margg foot margd";
    }
}

@media (max-width: 721px) {
    .wkform3c-container {
     grid-template-columns: 100% ;
     grid-template-rows:  10px 140px 1fr 140px 1fr 40px ;
     grid-template-areas:
       "head"
       "info1"
       "body1"
       "info2"
       "body2"
       "foot";
    }

    .wkform3c-mg,
    .wkform3c-mc,
    .wkform3c-md
    {
        display: none;
    }
}

/* ---------------------------------------------------------
   Table de content header
------------------------------------------------------------ */
#WkSelectIdx
     { min-width: 225px;
     }

/* ---------------------------------------------------------
   Table de content body
------------------------------------------------------------ */
.table th
     { font-size: 0.78em;
       font-weight: 700;
       line-height: 1.1em;
       padding-bottom: 0.8rem;
       padding-top: 0.65rem;
       padding-left: 0.35rem;
       padding-right: 0.35rem;
       background: rgba(0,0,0,0.04) ;
       text-transform: uppercase ;
       letter-spacing: 0.5px ;
       color: var(--bs-dark) ;
       border-bottom: 2px solid var(--bs-primary) ;
     }

.table th.bg-primary
     { --bs-bg-opacity: 0.7 ;
       color: var(--bs-primary) ;
       font-weight: 800 ;
     }

.table th.bg-primary .btn
     { color: var(--bs-primary) ;
     }

.table-hover td
      { font-size: 0.9em;
        font-weight: 400;
        line-height: 0.7em;
        padding-bottom: 0.05rem;
        padding-top: 0.05rem;
        padding-left: 0.35rem;
        padding-right: 0.35rem;
      }

.table-hover tbody tr:nth-child(even)
      { background: rgba(0,0,0,0.03) ;
      }

.table-hover tbody tr:hover
      { background: rgba(13,110,253,0.08) ;
      }

.table tbody tr:first-child td
      { padding-top: 0.6rem ;
      }

.table-nobtn td
      { font-size: 0.9em;
        font-weight: 400;
        line-height: 0.7em;
        padding-bottom: 0.35rem;
        padding-top: 0.35rem;
        padding-left: 0.35rem;
        padding-right: 0.35rem;
      }

.table-nobtn td.total
      { font-weight: 700;
        line-height: .9em;
      }

.wk-cell20
     { max-width: 180px ;
     }

.wk-cell15
     { max-width: 135px ;
     }

.wk-cell10
     { max-width: 90px ;
     }

.wk-cell05
     { max-width: 90px ;
     }


.btn-popup,
.btn-popup:hover
     { background-color:transparent;
       padding-left: 0;
       padding-top: 0;
       padding-bottom: 0;
       padding-right: 0.15rem;
     }

.wk-dropdown-combo
     { font-size: 0.875rem;
       overflow-y: scroll;
       max-height: 200px;
     }

.wk-dropdown-item
     { padding: 0.35rem 1.5rem;
       margin: 2px 2px 2px 0;
       padding-left: calc(1.5rem - 3px);
       border: 1px solid transparent;
     }

.wk-dropdown-item:hover
   {
     background: linear-gradient(135deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.08) 100%);
     border: 1px solid rgba(255, 255, 255, 0.25);
     border-left: 4px solid rgba(255, 255, 255, 0.7);
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.2);
     padding-left: calc(1.5rem - 6px);
   }

.nav-link.wk-onglet:hover
   {
     background: linear-gradient(135deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.08) 100%);
     border: 1px solid rgba(255, 255, 255, 0.25);
     border-left: 4px solid rgba(255, 255, 255, 0.7);
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.2);
     padding-left: calc(0.4rem - 3px);
   }

.wk-dropdown-menu
     {
       background-color: color-mix(in srgb, var(--c-glass) 12%, transparent);
       backdrop-filter: blur(15px) saturate(var(--saturation));
       -webkit-backdrop-filter: blur(15px) saturate(var(--saturation));
       box-shadow:
         inset 0 0 0 1px color-mix(in srgb, var(--c-light) calc(var(--glass-reflex-light) * 10%), transparent),
         inset 1.8px 3px 0px -2px color-mix(in srgb, var(--c-light) calc(var(--glass-reflex-light) * 90%), transparent),
         inset -2px -2px 0px -2px color-mix(in srgb, var(--c-light) calc(var(--glass-reflex-light) * 80%), transparent),
         inset -3px -8px 1px -6px color-mix(in srgb, var(--c-light) calc(var(--glass-reflex-light) * 60%), transparent),
         inset -0.3px -1px 4px 0px color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 12%), transparent),
         inset -1.5px 2.5px 0px -2px color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 20%), transparent),
         inset 0px 3px 4px -2px color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 20%), transparent),
         inset 2px -6.5px 1px -4px color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 10%), transparent),
         0px 1px 5px 0px color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 10%), transparent),
         0px 6px 16px 0px color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 8%), transparent);
       transition:
         background-color 400ms
           cubic-bezier(1, 0.0, 0.4, 1),
         box-shadow 400ms
           cubic-bezier(1, 0.0, 0.4, 1);
       border-radius: 12px;
       gap: 8px;
       box-sizing: border-box;
       padding: 8px 2px 10px;
     }

.wk-dropdown-menu .dropdown-divider
     { margin: 4px 12px;
       border-top: 2px solid rgba(255, 255, 255, 0.80);
     }

.wk-dropdown-menu-lt
     { border-radius: 0;
       padding: 0;
       font-size: 0.750rem;
    }

.form-floating:has(.dropdown-menu.show)
     { z-index: 1050;
     }

.wk-dropdown-item-lt
    { padding: 0.1rem 0.25rem;
      /*color: #495057;*/
    }

.wk-dropdown-item-lt:hover,
.wk-dropdown-item-lt:focus
    { background-color: #e9ecef;
      color: black;
    }

.wk-hide
    { display: contents;
      max-width: 0px;
      border: 0;
    }

/* ---------------------------------------------------------
   Sidebar
------------------------------------------------------------ */
.wt-btn
    { font-size: 18px;
      background-color: #eee;
      color: #000;
    }

.btn-firme
    { color:#fff;
      background-color: #808080;
      border-width: 1px;
      border-color: #808080;
    }

.btn-firme.active,
.btn-firme:active,
.btn-firme:focus,
.btn-firme:link,
.btn-firme:hover {
        color: #fff;
        border-width: 1px;
        background-color: #c0c0c0;
        border-color: #808080;
        text-decoration: none;
        outline:0;
    }

a,
a:focus,
a:hover,
a:link
    { color: inherit;
      text-decoration: none;
      transition: all 0.3s;
      outline:0;
    }

.line
    { width: 100%;
      height: 1px;
      border-bottom: 1px dashed #ddd;
      margin: 20px 0;
    }

.hidden,
#inwkuploadfile
    { display: none;
    }
/* ---------------------------------------------------
 * SIDEBAR STYLE
 * --------------------------------------------------- */
.wrapper {
    display: flex;
    align-items: stretch;
}

#sidebar {
    min-width: 250px;
    max-width: 250px;
    color: #fff;
    transition: all 0.3s;
    background-color: rgba(0,0,0,.4);
}

#sidebar .navbar {
    padding: 15px 10px;
    min-height: 5em;
    max-height: 5em;
    border: none;
    border-radius: 0;
    margin-bottom: 40px;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
}

#wktitel {
    margin: 0px;
}

#sidebar.active {
    min-width: 5em;
    max-width: 5em;
    text-align: center;
}

#SideLogo
    { cursor:pointer;
    }

#sidebar.active #SideLogo
    { padding-left: 10px;
    }

#sidebar.active .tb-lg,
#sidebar.active .sb-lg {
    display: none;
}

#sidebar div.tb-sm,
#sidebar span.sb-sm,
#sidebar i.sb-sm,
#sidebar a.sb-sm
         { display: none;
         }

#sidebar.active .tb-sm {
    display: grid;
}

#sidebar.active .sb-sm {
    display: block;
}

#sidebar.active a[aria-expanded="false"]::before, #sidebar.active a[aria-expanded="true"]::before {
    top: auto;
    bottom: 5px;
    right: 50%;
    -webkit-transform: translateX(50%);
    -ms-transform: translateX(50%);
    transform: translateX(50%);
}

#sidebar .sidebar-header {
    display: grid;
    grid-template-columns: 1fr 3fr;
    grid-template-rows: 58px;
    align-items: start;
    justify-items: center;
    padding: 0px;
}

#sidebar .sidebar-header h2 {
    color: #fff;
    font-weight: bolder;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.8) ,
                   0   0   6px rgba(0,0,0,0.5) ;
    margin-right: 20px;
    margin-top: 5px;
}

#toolbox {
    border-bottom: 1px solid #fff ;
}

button::before
            { display: none;
            }

#toolbox-lg { display: grid;
              grid-template-columns: 1fr 1fr 1fr 1fr;
              grid-template-rows: 48px;
              align-items: start;
              justify-items: center;
            }

#toolbox-sm { display: grid;
              grid-template-columns: 1fr;
              grid-template-rows: 48px;
              align-items: start;
              justify-items: center;
            }

#nav-wk     { padding: 0px ;
              background-color: white ;
            }

.nav-search { width: 100% ;
              padding-top: 10px;
            }
#search     { min-height: 41px;
              border-radius: 0 20px 20px 0 ;
              border-left: none ;
              transition: box-shadow 0.3s ease , border-color 0.3s ease ;
            }

#search:focus
            { box-shadow: 0 0 0 3px rgba(13,110,253,0.15) ;
              border-color: var(--bs-primary) ;
            }

#toolbox-lg button,
#toolbox-lg button:focus,
#toolbox-sm button,
#toolbox-sm button:focus
   {
     background: linear-gradient(135deg,
                 rgba(255, 255, 255, 0.18) 0%,
                 rgba(255, 255, 255, 0.08) 100%);
     border: 1px solid rgba(255, 255, 255, 0.25);
     border-radius: 10px;
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15),
                 inset 0 1px 0 rgba(255, 255, 255, 0.2);
   }

#toolbox-lg button:hover,
#toolbox-sm button:hover
   {
     background: linear-gradient(135deg,
                 rgba(255, 255, 255, 0.25) 0%,
                 rgba(255, 255, 255, 0.12) 100%);
     border: 1px solid rgba(255, 255, 255, 0.4);
     box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18),
                 inset 0 1px 0 rgba(255, 255, 255, 0.25);
   }

#nav-wk .dropstart > button,
#nav-wk .dropstart > button:focus,
#opensidebar
   {
     background: linear-gradient(135deg,
                 rgba(255, 255, 255, 0.18) 0%,
                 rgba(255, 255, 255, 0.08) 100%);
     border: 1px solid rgba(255, 255, 255, 0.25);
     border-radius: 10px;
     box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15),
                 inset 0 1px 0 rgba(255, 255, 255, 0.2);
   }

#nav-wk .dropstart > button:hover,
#opensidebar > button:hover
   {
     background: linear-gradient(135deg,
                 rgba(255, 255, 255, 0.30) 0%,
                 rgba(255, 255, 255, 0.18) 100%);
     border: 1px solid rgba(255, 255, 255, 0.5);
     box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18),
                 inset 0 1px 0 rgba(255, 255, 255, 0.3);
   }

#btfiltre
            {
              background: linear-gradient(135deg,
                          rgba(255, 255, 255, 0.18) 0%,
                          rgba(255, 255, 255, 0.08) 100%);
              border: 1px solid rgba(255, 255, 255, 0.25);
              border-right: none;
              border-radius: 20px 0 0 20px;
              box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
            }

#btfiltre:hover
            {
              background: linear-gradient(135deg,
                          rgba(255, 255, 255, 0.30) 0%,
                          rgba(255, 255, 255, 0.18) 100%);
              border: 1px solid rgba(255, 255, 255, 0.5);
              border-right: none;
              box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
            }


#nav-wk button .material-icons
   {
     color: white;
   }

[data-bs-theme=light]
    {
       .nav-link.wk-onglet:hover
       { background-color: var(--wk-light-purple);
       }
    }

#toolbox-lg button i,
#toolbox-sm button i
   { color: white;
     max-height: 18px;
     max-width: 18px;
   }

#choice.mobile
   { overflow-y: auto !important;
     overflow-x: hidden !important;
     max-height: 100%;
     position: fixed;
     width: 250px;
   }

#choice.desktop
   { overflow-y: auto !important;
     overflow-x: hidden !important;
     max-height: calc(100vh - 265px);
     position: fixed;
     width: 250px;
     margin-top: 5px;
   }

#sidebar.active #choice.mobile
   {
     width: 80px;
     max-height: calc(100vh - 113px);
   }

#sidebar.active #choice.desktop
   {
     width: 80px;
     max-height: calc(100vh - 113px);
   }

#firme
   { border-top: 1px solid #fff ;
     max-width: 250px;
   }

#sidebar ul {
    padding-top: 5px;
}

#sidebar ul li {
    background: none ;
    color: white;
    margin-bottom: 2px;
    margin-top: 2px;
    margin-left: 2px;
    margin-right: 5px;
    border: 1px solid transparent;
    border-left: 3px solid transparent;
    transition: background 0.3s ease,
                border-color 0.3s ease,
                box-shadow 0.3s ease;
}

[data-bs-theme=dark]
    #sidebar ul li
    { color: var(--bs-gray-400);
    }

#sidebar ul li:hover,
#sidebar ul li.active
{
    background: linear-gradient(135deg,
                rgba(255, 255, 255, 0.18) 0%,
                rgba(255, 255, 255, 0.08) 100%);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-left: 3px solid rgba(255, 255, 255, 0.7);
    border-radius: 10px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15),
                inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

#sidebar ul li.active:hover
{
    background: linear-gradient(135deg,
                rgba(255, 255, 255, 0.25) 0%,
                rgba(255, 255, 255, 0.12) 100%);
    border-left: 3px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18),
                inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

ul.infos {
    padding: 10px;
}

ul.infos a {
    text-align: center;
    font-size: 0.9em !important;
    display: block;
    border-radius: 5px;
    margin-bottom: 5px;
}

#annee,
#posi,
#version
    { background: rgba(255,255,255,0.12);
      backdrop-filter: blur(6px) ;
      -webkit-backdrop-filter: blur(6px) ;
      border: 1px solid rgba(255,255,255,0.15) ;
      color: #fff;
      font-size: 0.9em;
      padding: 0px 0px 0px 10px;
      margin: 5px;
      border-radius: 5px;
    }

#version:hover
    { background: rgba(255,255,255,0.25);
    }

/* -----------------------------------------------------
 * Navbar
 * ----------------------------------------------------- */
#leftmain .navbar
       { border: none;
         border-radius: 0;
         color: #000;
         padding-right: 5px;
         background-color: rgba(0,0,0,.4);
       }

#leftmain .navbar-form
       { border: none;
         border-radius: 0;
         color: #000;
         padding-right: 5px;
       }

#leftmain .navbar h3 {
    color: #fff;
    font-weight: bolder;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.8) ,
                   0   0   6px rgba(0,0,0,0.5) ;
    margin-right: 20px;
    margin-top: 0px;
    margin-bottom: 0px;
}

#leftmain .navbar-form h3 {
    color: #000000;
    font-weight: bolder;
    margin-right: 20px;
    margin-left: 5px;
    margin-top: 3px;
}

.dropdown-submenu {
    position: relative;
}

  .dropdown-submenu a::after {
    transform: rotate(-90deg);
    position: absolute;
    right: 6px;
    top: .8em;
}

  .dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-left: .1rem;
    margin-right: .1rem;
}


#navbarToggler ul a:focus,
#navbarToggler ul a:hover,
#navbarToggler ul a:link,
#navbarToggler ul a:visited
    { background: #868e96;
      text-decoration: none;
    }

#navbarToggler ul li ul,
#navbarToggler ul li ul li,
#navbarToggler ul li ul li a,
#navbarToggler ul li ul li a:focus,
#navbarToggler ul li ul li a:hover,
#navbarToggler ul li ul li a:link,
#navbarToggler ul li ul li a:visited
   { background: #fff;
     text-decoration: none;
   }

#user .show
    { display: block ;
    }

.wkformlogo
    { max-height: 45px ;
      margin-left: 22px ;
    }

.nav-subtitel {
    min-height: 58px;
    max-height: 58px;
    width: 100%;
    padding-top: 10px;
  }

.nextcloud-content {
    height: 100%;
    width: 100%;
}

.nextcloud-error {
    background-color: var(--bs-primary);
    color : white ;
    width: 100%;
    min-height: 50px;
    max-height: 50px;
}

.nav-search {
    min-height: 58px;
    max-height: 58px;
}


/* ---------------------------------------------------
    Main and content
----------------------------------------------------- */
#leftmain
       { width: 100%;
         transition: all 0.3s;
         max-height: 100vh;
         min-height: 100vh;
         padding: 0px;
       }

#content
       { transition: all 0.3s;
         padding-right: 5px;
         padding-bottom: 5px;
       }

.content-form
       { padding-left: 5px;
         background-color: white;
       }

.content-base
       { min-height: calc(100vh - 58px);
         max-height: calc(100vh - 58px);
       }

.content-texte
       { height: calc(100vh - 118px);
         border-width: 0px;
       }

.content-cloud
       {
       }

.content-footer
       { min-height: calc(100vh - 88px);
         max-height: calc(100vh - 88px);
       }

#wkfooter
        { max-height: 30px;
          min-height: 30px;
          padding-right: 5px;
          background-color: rgba(0,0,0,.4);
        }
#WtPdfContent
       { padding: 0px;
         margin: 0px;
         min-width: 100%;
       }

#WtPdf
       { padding: 0px;
         margin: 0px;
         min-height: calc(100vh - 114px);
         max-height: calc(100vh - 114px);
         min-width: 100%;
         transition: all 0.3s;
       }

/* ---------------------------------------------------
   Cards
----------------------------------------------------- */

.block-left {
    float: left;
    color: #000;
}
.block-right {
    float: right;
}

.card-deck .card
         { min-width: 275px;
           margin-bottom: 10px;
         }

.card-max
         { padding-bottom: 0px;
           min-height: 100%;
           max-height: 100%;
           border: 0px;
           overflow-y: auto;
         }

.card-max-pdf
         { padding-bottom: 0px;
           min-height: 100%;
           max-height: 100%;
           border: 0px;
           overflow-y: hidden ;
         }

.card-body p
        { font-size: 14px;
          font-weight: normal;
          padding: 0;
          margin-top: 0.5rem;
          margin-bottom: 0rem;
          line-height:1em;
        }

#content a.active
        { color: rgb(196, 196, 196);
        }


/* ---------------------------------------------------
   Login
----------------------------------------------------- */
.formpass { display: flex;
            align-items: center;
            padding-top: 10px;
            padding-bottom: 10px;
          }

.form-signin { width: 100%;
               max-width: 330px;
               padding: 15px;
               margin: auto;
             }

.form-signin .form-control {
                    position: relative;
                    box-sizing: border-box;
                    height: auto;
                    padding: 10px;
                    font-size: 16px;
                  }

.form-signin .form-control:focus
             {
               z-index: 2;
             }

#wkform-foot         { font-size: 14px;
                       padding-left: 10px;
                       padding-right: 10px;
                     }

#wkform-foot > .row  { min-height: 40px;
                     }

#wkform-footleft     { text-align: left !important;
                     }

#wkform-footcenter   { text-align: center !important;
                     }

#wkform-footright    { text-align: right !important;
                     }

#WtUser      { margin-bottom: 10px;
               border-bottom-right-radius: 0;
               border-bottom-left-radius: 0;
             }

#WtPass      {
               margin-bottom: 10px;
               border-top-left-radius: 0;
               border-top-right-radius: 0;
             }

.asklogin
     {
       min-height: calc(100vh - 128px);
     }

.asklogin-mobile
     {
       min-height: calc(100vh - 92px);
     }

.keycloak-content
     {
       min-width: 350px;
       border-radius: 15px;
     }

.keycloak-mobile
     {
       width: 100%;
       border-radius: 15px;
       min-height: 450px;
     }

.rotate-45
     {
       transform: rotate(-45deg) !important; /* Rotation de 45 degrés */
     }

.fs-7
     {
       font-size: 0.85rem !important;
     }

/* ---------------------------------------------------------
   Mode immersif - survol zone navbar
------------------------------------------------------------ */
#sidebar,
#nav-wk,
#nav-wk > *,
#content
    { transition: opacity 0.5s ease ,
                  background-color 0.5s ease ;
    }

.wk-immersive #sidebar
    { opacity: 0 ;
      pointer-events: none ;
    }

.wk-immersive #nav-wk
    { background-color: transparent !important ;
    }

.wk-immersive .wktitre2
    { opacity: 0 ;
      pointer-events: none ;
    }

.wk-immersive #content
    { opacity: 0 ;
      pointer-events: none ;
    }

/* ---------------------------------------------------------
   Boites de dialogue - Cartes form-floating
------------------------------------------------------------ */
.modal-body .form-floating:not(.wk-check-float)
    { border-left: 3px solid var(--wk-edit-leftborder) ;
      border-radius: 8px ;
      background: rgba(255,255,255,0.7) ;
      backdrop-filter: blur(8px) ;
      -webkit-backdrop-filter: blur(8px) ;
      box-shadow: 0 2px 8px rgba(0,0,0,0.08) ;
      transition: transform 0.2s ease ,
                  box-shadow 0.2s ease ;
    }

.modal-body .form-floating:not(.wk-check-float) label
    { font-size: 0.7rem ;
      text-transform: uppercase ;
      letter-spacing: 0.5px ;
      color: var(--wk-label-color) ;
      font-weight: 600 ;
      opacity: 0.85 ;
    }

.modal-body .form-floating:not(.wk-check-float) .form-control:disabled
    { background: transparent ;
      border: none ;
      font-weight: 600 ;
      font-size: 1.05rem ;
      color: var(--bs-dark) ;
    }

/* ---------------------------------------------------------
   Boites de dialogue - Cartes checkbox (toggle switch)
------------------------------------------------------------ */
.modal-body .input-group-sm:has(.wk-check-float)
    { border-left: 3px solid var(--wk-edit-leftborder) ;
      border-radius: 8px ;
      background: rgba(255,255,255,0.7) ;
      backdrop-filter: blur(8px) ;
      -webkit-backdrop-filter: blur(8px) ;
      box-shadow: 0 2px 8px rgba(0,0,0,0.08) ;
      transition: transform 0.2s ease ,
                  box-shadow 0.2s ease ;
      animation: wk-card-in 0.4s ease both ;
    }

/* ---------------------------------------------------------
   Boites de dialogue - Separateur wk-break
------------------------------------------------------------ */
.modal-body .wk-break
    { font-size: 0.8rem ;
      text-transform: uppercase ;
      letter-spacing: 1.5px ;
      color: var(--bs-secondary) ;
      font-weight: 600 ;
      text-align: center ;
      position: relative ;
      margin-top: 0.8rem ;
      margin-bottom: 0.4rem ;
    }

.modal-body .wk-break::before,
.modal-body .wk-break::after
    { content: "" ;
      position: absolute ;
      top: 50% ;
      width: 25% ;
      height: 1px ;
      background: linear-gradient(to right, transparent, var(--bs-secondary), transparent) ;
    }

.modal-body .wk-break::before
    { left: 5% ;
    }

.modal-body .wk-break::after
    { right: 5% ;
    }


/* ---------------------------------------------------------
   Dark mode - Adaptations
------------------------------------------------------------ */
[data-bs-theme=dark] .table th
    { background: rgba(255,255,255,0.06) ;
      color: var(--bs-gray-400) ;
      border-bottom-color: rgba(13,110,253,0.6) ;
    }

[data-bs-theme=dark] .table th.bg-primary
    { --bs-bg-opacity: 0.6 ;
      color: white !important ;
    }

[data-bs-theme=dark] .table th.bg-primary .btn
    { color: rgba(100,170,255,0.9) ;
    }

[data-bs-theme=dark] .table-hover tbody tr:nth-child(even)
    { background: rgba(255,255,255,0.03) ;
    }

[data-bs-theme=dark] .table-hover tbody tr:hover
    { background: rgba(13,110,253,0.12) ;
    }

/*[data-bs-theme=dark] nav-wk .nav-search .input-group > button:first-child*/
[data-bs-theme=dark] #btfiltre
    { background: var(--bs-body-bg) ;
      border-color: var(--bs-border-color) ;
      border-right: none ;
      color: white ;
    }

[data-bs-theme=dark] #search
    { border-color: var(--bs-border-color) ;
      border-left: none ;
    }

[data-bs-theme=dark] .card-header
    { background: rgba(0,0,0,0.3) ;
      border-bottom-color: rgba(255,255,255,0.08) ;
    }

[data-bs-theme=dark] .btn-header
    { background: linear-gradient(135deg,
                  rgba(255, 255, 255, 0.08) 0%,
                  rgba(255, 255, 255, 0.03) 100%);
      border-color: rgba(255, 255, 255, 0.15);
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2),
                  inset 0 1px 0 rgba(255, 255, 255, 0.08);
    }

[data-bs-theme=dark] .btn-header:hover
    { background: linear-gradient(135deg,
                  rgba(255, 255, 255, 0.15) 0%,
                  rgba(255, 255, 255, 0.06) 100%);
      border-color: rgba(255, 255, 255, 0.3);
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25),
                  inset 0 1px 0 rgba(255, 255, 255, 0.12);
    }

[data-bs-theme=dark] .btn-titel
    { background: linear-gradient(135deg,
                  rgba(255, 255, 255, 0.08) 0%,
                  rgba(255, 255, 255, 0.03) 100%);
      border-color: rgba(255, 255, 255, 0.15);
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2),
                  inset 0 1px 0 rgba(255, 255, 255, 0.08);
    }

[data-bs-theme=dark] .btn-titel:hover
    { background: linear-gradient(135deg,
                  rgba(255, 255, 255, 0.15) 0%,
                  rgba(255, 255, 255, 0.06) 100%);
      border-color: rgba(255, 255, 255, 0.3);
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25),
                  inset 0 1px 0 rgba(255, 255, 255, 0.12);
    }

[data-bs-theme=dark] .btn-titel-blue
    { background: linear-gradient(135deg,
                  rgba(13, 110, 253, 0.6) 0%,
                  rgba(13, 110, 253, 0.4) 100%);
      border-color: rgba(255, 255, 255, 0.15);
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2),
                  inset 0 1px 0 rgba(255, 255, 255, 0.1);
    }

[data-bs-theme=dark] .btn-titel-blue:hover
    { background: linear-gradient(135deg,
                  rgba(13, 110, 253, 0.8) 0%,
                  rgba(13, 110, 253, 0.6) 100%);
      border-color: rgba(255, 255, 255, 0.4);
      box-shadow: 0 4px 14px rgba(13, 110, 253, 0.35),
                  inset 0 1px 0 rgba(255, 255, 255, 0.2);
    }

[data-bs-theme=dark] .modal-body .form-floating:not(.wk-check-float)
    { background: rgba(0,0,0,0.3) ;
      border-left-color: color-mix(in srgb, var(--wk-edit-leftborder) 60%, transparent) ;
      box-shadow: 0 2px 8px rgba(0,0,0,0.2) ;
    }

[data-bs-theme=dark] .modal-body .input-group-sm:has(.wk-check-float)
    { background: rgba(0,0,0,0.3) ;
      border-left-color: color-mix(in srgb, var(--wk-edit-leftborder) 60%, transparent) ;
      box-shadow: 0 2px 8px rgba(0,0,0,0.2) ;
    }

[data-bs-theme=dark] .modal-body .form-floating:not(.wk-check-float) label
    { color: color-mix(in srgb, var(--wk-label-color) 70%, transparent) ;
    }

[data-bs-theme=dark] .modal-body .form-floating:not(.wk-check-float) .form-control:disabled
    { color: var(--bs-gray-300) ;
    }