.reset-password-email{
  font-size: 12px !important;
}

.scrollable-x-container {
  overflow-x: auto;
}

.sortable-table .sortable:after, .sortable-table .sorted:after {
  content: ''
}

.error-message{
    display: block;
    width: 100%;
    clear:both;
}
.error-container input{
    border:1px solid red !important;
}

.flash-message {
    background: -webkit-linear-gradient(-1deg, rgb(52, 235, 162), rgb(58, 245, 170));
    background: linear-gradient(-1deg, rgb(52, 235, 162), rgb(58, 245, 170));
    width: 100%;
    color: #2c8c2c;
    border-radius: .5rem;
    padding: 1rem 3rem;
    margin-bottom: 2rem;
}

.flash-message:before {
    content: '';
    display: inline-block;
    background-image: url('/images/checked.svg');
    background-size: cover;
    width: 20px;
    height: 20px;
    position: relative;
    top: .4rem;
    left: -1rem;
}


.flash-error {
    background: -webkit-linear-gradient(84deg, rgb(206, 90, 90), rgb(185, 90, 90));
    background: linear-gradient(84deg, rgb(206, 90, 90), rgb(185, 90, 90));
    width: 100%;
    color:#fff;
    border-radius: .5rem;
    padding: 1rem 3rem;
}

.flash-error:before {
    content: '';
    display: inline-block;
    background-image: url('/images/cancel.svg');
    background-size: cover;
    width: 20px;
    height: 20px;
    position: relative;
    top: .4rem;
    left: -1rem;
}

.flash-container{
    margin-top: 20px;
}

.submit{
    clear: both;
}

.form-order .cat-image{
    background-size: cover;
    background-position: 50%;
}

/*.buttons a.approval-button{
  margin-right: 0;
}*/

.form-order .form-item{
  padding-bottom: 1.5rem;
  padding-top: 0;
}

#natural_pillars_save{
  margin-top: 2rem;
}

.form-order .tooth {
  margin: 20px -35px;
}

/*align teeth*/
#natural_pillars_design_front_teeth div, #natural_pillars_pre_molars div, #natural_pillars_pontic div{
  padding-left: 0;
}

#natural_pillars_design_front_teeth div .margin, #natural_pillars_pre_molars div .margin, #natural_pillars_pontic div .margin{
  margin-left: 0;
}

.begeleidende-text{
  margin-top: -30px;
  margin-bottom: 30px;

  color: #032d5a;
  font-style: italic;
  font-weight: 400 !important;
}

.begeleidende-text-first{
  margin-bottom: -10px;

  color: #032d5a;
  font-style: italic;
  font-weight: 400 !important;
}

.disclaimer--container{
  clear: both;
  padding: 20px 0;
}

.disclaimer--container h4{
  color:#181819;
  margin-bottom: 0;
}

.disclaimer--container p{
  color: #032d5a;
  font-style: italic;
  margin-top: 5px;
}

a.sort_order{
    text-decoration: none;
    color: white;
}

.form-settings .form-item label, .admin-database-form label{
  min-width: 30%;
}

.admin-database-form input, .admin-database-form select{
  background-color: #f8f8f8;
  width: 60%;
  padding: 5px;
  border: 1px solid grey;
}

.admin-database-form div div {
  margin-bottom: 20px;
}

.form-settings .form-item .select-arrow-courier{
  right: 37px;
  position: absolute;
  top: 8px;
}

.order-incomplete, .confirm-action {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background: rgba(0,0,0,0.3);
    padding: 30px;
}
.order-incomplete-body {
    background: #fff;
    padding: 30px;
    width: 800px;
    margin: auto;
}

.confirm-body {
    background: #fff;
    padding: 30px;
    width: 400px;
    margin: auto;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    height: 140px;
    text-align: center;
    border-radius:4px;
}
.confirm-footer {
    margin-top: 30px;
}
#epithese_attachment, #two_in_one_structure_attachment, #conical_bar_with_shell_attachment{
    margin-top: 45px!important;
    margin-bottom: 45px;
}

#conical_bar_with_shell_add_sleeves {
    margin-bottom: 45px;
}

#epithese_attachment .dq--subcontent, #two_in_one_structure_attachment .dq--subcontent, #conical_bar_with_shell_attachment .dq--subcontent {
    max-width: 50%;
}

.text-danger,  .text-danger *{
    color: #ff0000!important;
}
.mt-30 {
    margin-top: 30px;

}

.confirm-button, .close-button {
    border: 1px solid #e2e2e2;
    padding: 7px 15px;
    display: inline-block;
}
.confirm-button.confirm-delete {
    background: #2c2b60;
    color: #fff;
}
.order-footer {
    margin-top: 15px;
    text-align: right;
}
.close-button {
    text-align: center;
}
.btn-action {
    padding: 5px 12px;
    text-align: center;
    display: inline-block;
    border: 1px solid #e2e2e2;
}
.hidden {
    display: none;
}


@media (min-width: 960px) {
  #epithese_attachment .dq--subcontent {
    width: 50%;
    margin-right: 0px;
  }

  #epithese_attachment .dq--subcontent:last-child {
    width: 100%
  }
}
.mb-0 {
    margin-bottom: 0px!important;
}
.mt-0 {
    margin-top: 0!important;
}
.mt-20 {
    margin-top: 20px!important;
}
.table-flex {
    display: flex;
    justify-content: end;
}
.table-flex > a:first-child {
    margin-right: 3px;
}
@media (max-height: 750px) {
    .order-incomplete-body {
        overflow-y: scroll;
        max-height: 100%;
    }
}

.custom-dropdown-menu .ui-widget-header{
  background-color: #cbe8dc;
  padding: 10px;
  font-size: 14px;
  font-weight: bold;
}

.custom-dropdown-menu li a{
  padding: 10px 10px 10px 20px !important;
}

.custom-dropdown-menu li a:hover{
  background-color: #EEFBF5;
  border: 0px;
  font-weight: normal;
}

.custom-dropdown-menu li a.active{
  background-color: #EEFBF5;
  font-weight: normal;
}

.checkbox-left{
  float: left;
  margin-right: 5px !important;
}

.log-container {
  height: 250px;
  overflow-y: auto;
}
.chk-left{
  width: auto !important;
}


form[name="custom_parts"] label{
  display: inline-block;
  width: 25%;
  vertical-align: top;
}

form[name="custom_parts"] label.textarea{
  display: block;
}


form[name="custom_parts"] #custom_parts div{
  margin-bottom: 20px;
}

.popup-link,.popup-link:visited, .popup-link img{
  border: 0px !important;
}

.popup-link img{
  width: 100%;
}

.fancy-img{
  width:200px;
  height: auto;
  max-height: 150px;
}

.surgical h3{
  clear: both;
}

.surgical .form-item{
  border-bottom: 0px;
  width: 200px;
  margin: 0px 20px 20px 0px;
}

.surgical .row{
  border-bottom: 1px solid #dbdbdb;
  margin-bottom: 40px;
}
.surgical .form-item a{
  display: block;
  height: 150px;
}

.surgical .form-item input[type="checkbox"]{
  float: left;
  margin: 0px 5px 0px 0px !important;
  padding: 0px !important;
}

.surgical .form-item label{
  line-height: 12px !important;
}

.b-qr-codes {
    margin-bottom: 20px;
}

.b-qr-codes img.qrcode{
    width:150px;
    height:auto;
    margin: 0px 5px;
}

.b-qr-codes img.banner {
    width: 100%;
    height: auto;
    margin: 0px 5px 20px 0px;
}

.detail_alert_box.grey{
    background-color:lightgrey;
}

.te--images img {
    width: auto;
    max-width: 200px;
    max-height: 200px;
    height: auto;
}

/* Removable double structure: fix attachment list overlapping the 'aantal' field */
#removable_double_structure_attachment.dq--content--container {
    margin-top: 0;
}

/* Removable double structure: larger images for subcategory selection */
#removable_double_structure_subcategory .dq--img {
    height: 200px;
    width: 200px;
}

/* Removable double structure: spacing below attachment choices */
#removable_double_structure_attachment.dq--content--container {
    margin-bottom: 30px;
}

/* Removable double structure: spacing below sleeves choices */
#removable_double_structure_add_sleeves.dq--content--container {
    margin-bottom: 30px;
}

/* Removable double structure: design shell ja/nee options side by side */
.dq--shell-options {
    display: flex;
    gap: 40px;
    margin-top: 10px;
    margin-bottom: 20px;
    align-items: flex-start;
}

.dq--shell-option {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.dq--shell-option .dq--label {
    margin-bottom: 10px;
    white-space: nowrap;
}

img.dq--shell-img {
    display: block;
    height: 150px;
    width: auto;
    margin-bottom: 10px;
}

/* Removable double structure: notice for conical + retentiepinnen */
#shell-pins-conical-notice {
    color: #2c8c2c;
    font-weight: bold;
    margin-bottom: 15px;
}

/* Try-in bridge layout */
.tryin-bridge-layout {
    display: flex;
    gap: 25px;
    align-items: flex-start;
    margin-top: 15px;
}

.tryin-bridge-image {
    flex-shrink: 0;
}

.tryin-bridge-image .dq--shell-img {
    margin-bottom: 0;
}

.tryin-bridge-form {
    flex: 1;
}

.tryin-bridge-form .form-group {
    margin-bottom: 12px;
}

.tryin-bridge-form .form-group > label {
    display: block;
    font-weight: bold;
    margin-bottom: 4px;
}

.tryin-bridge-form select {
    width: 100%;
    max-width: 350px;
    box-sizing: border-box;
    height: 36px;
    padding: 6px 12px;
}

.tryin-bridge-design-label {
    display: block;
    font-weight: bold;
    margin-bottom: 4px;
}

@media (max-width: 768px) {
    .tryin-bridge-layout {
        flex-direction: column;
    }
}

.form__screwdrivers select {
    max-width: 300px;
}

.form__screwdrivers {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #dbdbdb;
}

.form-inline-screwdriver {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.form-inline-screwdriver label {
    margin-bottom: 0;
    white-space: nowrap;
}

/* Admin settings — gegroepeerde sections + tabs per taal */
.admin-settings-section {
    background: #fafafa;
    border: 1px solid #e2e2e6;
    border-radius: 6px;
    padding: 20px 24px;
    margin-bottom: 24px;
}
.admin-settings-section h3 {
    margin-top: 0;
    margin-bottom: 12px;
    color: #2c2b60;
    border-bottom: 1px solid #e2e2e6;
    padding-bottom: 8px;
}
.admin-settings-hint {
    font-size: 12px;
    color: #666;
    font-style: italic;
    margin: 0 0 16px;
}
.admin-settings-section .form-item,
.admin-settings-section > div > .form-item {
    margin-bottom: 12px;
}
.admin-settings-section input[type="text"],
.admin-settings-section input[type="url"],
.admin-settings-section input[type="email"],
.admin-settings-section input[type="number"],
.admin-settings-section textarea {
    box-sizing: border-box;
    padding: 8px 10px;
    border: 1px solid #cfcfd4;
    border-radius: 4px;
    background: #fff;
}
.admin-settings-section input[type="text"]:focus,
.admin-settings-section input[type="url"]:focus,
.admin-settings-section input[type="email"]:focus,
.admin-settings-section input[type="number"]:focus,
.admin-settings-section textarea:focus {
    border-color: #2c2b60;
    outline: none;
}
.admin-settings-section label {
    display: block;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
    font-size: 13px;
}
.admin-settings-section .help-text,
.admin-settings-section small,
.admin-settings-section .form-help {
    display: block;
    font-size: 12px;
    color: #666;
    margin-top: 4px;
}
.admin-settings-actions {
    margin-top: 24px;
}

/* Taal-tabs binnen een section */
.lang-tabs {
    display: flex;
    gap: 4px;
    margin-bottom: 16px;
    border-bottom: 2px solid #e2e2e6;
}
.lang-tab {
    background: transparent;
    border: none;
    padding: 8px 18px;
    font-size: 13px;
    font-weight: 600;
    color: #888;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: color 0.15s, border-color 0.15s;
}
.lang-tab:hover {
    color: #2c2b60;
}
.lang-tab.active {
    color: #2c2b60;
    border-bottom-color: #2c2b60;
}
.lang-panel {
    display: none;
}
.lang-panel.active {
    display: block;
}

/* File input rows: visualiseer huidige upload + verwijder-checkbox naast elkaar */
.admin-settings-section input[type="file"] {
    padding: 6px;
    background: #fff;
    border: 1px dashed #cfcfd4;
    border-radius: 4px;
}
.admin-settings-section input[type="checkbox"] {
    margin-right: 6px;
}

/* Admin settings — inklapbare sections */
.admin-settings-section > h3 {
    cursor: pointer;
    user-select: none;
    position: relative;
    padding-right: 30px;
}
.admin-settings-section > h3::after {
    content: '▾';
    position: absolute;
    right: 0;
    top: 0;
    font-size: 14px;
    color: #888;
    transition: transform 0.2s;
}
.admin-settings-section.collapsed > h3::after {
    transform: rotate(-90deg);
}
.admin-settings-section.collapsed > h3 {
    border-bottom-color: transparent;
    margin-bottom: 0;
    padding-bottom: 0;
}
.admin-settings-section.collapsed > *:not(h3) {
    display: none;
}

/* URL / text input color fix — Symfony's UrlType erft anders een lichte kleur */
.admin-settings-section input[type="url"],
.admin-settings-section input[type="text"],
.admin-settings-section input[type="email"],
.admin-settings-section input[type="number"] {
    color: #222;
}

/* Login-page banners — altijd onder elkaar */
.login-banners {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 12px;
}
.login-banners .login-banner {
    width: 100%;
    max-width: 100%;
}
.login-banner__link {
    display: block;
    position: relative;
    text-decoration: none;
}
.login-banner__image {
    display: block;
    width: 100%;
    height: auto;
    max-height: 220px;
    object-fit: cover;
    max-width: 100%;
    border-radius: 4px;
}
.login-banner__cta {
    display: block;
    margin-top: 4px;
    color: #2c2b60;
    font-weight: 600;
    font-size: 14px;
    text-align: right;
}
.login-banner__link:hover .login-banner__cta,
.login-banner__link:focus .login-banner__cta {
    text-decoration: underline;
}
.login-webshop-link {
    margin-top: 12px;
    text-align: center;
}
.login-webshop-link--top {
    margin-top: 0;
    margin-bottom: 16px;
}
.login-webshop-link .button,
.login-webshop-link .button:link,
.login-webshop-link .button:visited,
.login-webshop-link .button:hover,
.login-webshop-link .button:focus,
.login-webshop-link .button:active {
    display: inline-block;
    padding: 10px 24px;
    background: #2c2b60;
    color: #fff;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 600;
}
.login-webshop-link.login-webshop-link--top .button,
.login-webshop-link.login-webshop-link--top .button:link,
.login-webshop-link.login-webshop-link--top .button:visited {
    display: inline-block;
    background: #032d5a;
    background-color: #032d5a;
    border: 1px solid #032d5a;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1px;
    border-radius: 20px;
    padding: 8px 25px;
    text-decoration: none;
    transition-duration: .2s;
}
.login-webshop-link.login-webshop-link--top .button:hover,
.login-webshop-link.login-webshop-link--top .button:focus,
.login-webshop-link.login-webshop-link--top .button:active {
    background: #fff;
    background-color: #fff;
    color: #032d5a;
    text-decoration: none;
    outline: none;
    cursor: pointer;
}
.login-webshop-link .button:hover,
.login-webshop-link .button:focus {
    background: #1e1d47;
}