/* Extracted page-specific styles from index.html */
/* Floating add menu (legacy) */
.sticky-menu { position: fixed; bottom:130px; right:20%; transform:translateX(-50%); z-index:999; display:flex; justify-content:center; align-items:center; background:#0c5460; color:#0c5460; border:1px #d21a1a; border-radius:50%; }
#check-for-clicking{display:none}
.main-add-button-plus,.menu-add-items,.main-add-button-minus{margin:auto;position:absolute;top:0;right:0;bottom:0;left:0;width:65px;height:65px;border:10px #d21a1a;border-radius:50%}
.main-add-button-plus,.main-add-button-minus{cursor:pointer;z-index:50;border:#d21a1a}
.main-add-button-plus:hover,.main-add-button-minus:hover{background:#333}
.main-add-button-plus:active,.main-add-button-minus:active{background:#000;border:5px #d21a1a}
.main-add-button-plus .menu-add-button-title,.main-add-button-minus .menu-add-button-title,.minus{width:100%;height:65px;font-size:24px;line-height:70px;text-align:center;color:#fafafa;border-radius:50%}
.menu-add-items{z-index:10;border:1px #d21a1a}
.plate{margin:auto;position:absolute;text-align:center;top:0;right:0;bottom:0;left:0;width:60px;height:60px;opacity:0;border-radius:50%;transition:all .4s ease-in;cursor:pointer;background:#000;box-shadow:0 0 3px 1px #ff9800;border:1px #d21a1a}
.plate i{width:100%;font-size:12px;line-height:70px;text-align:center;color:#fff;font-weight:700}
.plate:hover i{color:#fafafa}
#check-for-clicking:checked ~ .main-add-button-minus + .menu-add-items .plate{opacity:1}
#check-for-clicking:checked ~ .main-add-button-plus{display:none}
#check-for-clicking:checked ~ .main-add-button-minus{display:inline}
#check-for-clicking:not(:checked) ~ .main-add-button-minus{display:none}
#check-for-clicking:not(:checked) ~ .main-add-button-plus{display:inline}
/* Supplier tiles */
.lieferant-gruppe{margin:2px 0}
.lieferant-name{font-weight:700;color:#666;margin:4px 0 0;line-height:1.2}
.compact-item,.item-info{padding:0;margin:0;line-height:1.2}
.lieferanten-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:15px;margin:15px 0;padding:0 5px}
.lieferant-button{display:flex;flex-direction:column;align-items:center;justify-content:center;width:120px;height:120px;padding:10px 5px;background:rgba(255,152,0,.10);color:#ffd8a8;border:1px solid var(--ke-warning,#ff9800);text-decoration:none;border-radius:10px;font-size:14px;transition:background .2s ease;text-align:center;margin:0;box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 0 0 1px rgba(0,0,0,.2);position:relative;overflow:hidden}
.lieferant-button .count{display:block;font-size:12px;color:#ffd8a8;margin-top:8px;text-align:center;background:transparent}
.lieferant-button .name{display:block;text-align:center;word-wrap:break-word;max-height:60px;overflow:hidden;background:transparent}
.lieferant-button:hover{background:rgba(255,152,0,.20)}
.lieferant-button:hover .count{color:#fff}
.lieferant-button.eigene,.lieferant-button.andere{background:rgba(255,152,0,.10);border-color:var(--ke-warning,#ff9800);color:#ffd8a8}
.lieferant-button.eigene:hover,.lieferant-button.andere:hover{background:rgba(255,152,0,.20)}
@media (max-width:600px){.lieferanten-buttons{gap:10px}.lieferant-button{width:100px;height:100px;font-size:14px}.lieferant-button .count{font-size:12px;padding:2px 6px}}
/* Button bar */
.button-leiste{position:relative;width:100%;display:flex;flex-wrap:wrap;justify-content:center;gap:5px;margin:10px 0;background:#000;z-index:1}
.button-link{display:inline-block;padding:5.28px 10.56px;background:#4caf50;color:#fff;text-decoration:none;border-radius:5px;font-size:15.84px;transition:background .3s;text-align:center;white-space:nowrap}
.button-link:hover{background:#45a049}
@media (max-width:600px){.button-leiste{flex-direction:row;align-items:center;justify-content:center;gap:5.28px}.button-link{font-size:14.52px;padding:3.96px 7.92px}}
/* Quick supplier buttons */
.quick-supplier-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;margin:10px 0;padding:0 5px}
.quick-supplier-btn{display:inline-block;padding:6px 10px;background:rgba(255,152,0,.10);border:1px solid var(--ke-warning,#ff9800);color:#ffd8a8;text-decoration:none;border-radius:8px;font-size:14px;transition:background .2s ease;text-align:center;white-space:nowrap;margin:2px}
.quick-supplier-btn:hover{background:rgba(255,152,0,.20)}
.quick-supplier-btn.eigene,.quick-supplier-btn.andere{background:rgba(255,152,0,.10);border-color:var(--ke-warning,#ff9800);color:#ffd8a8}
.quick-supplier-btn.eigene:hover,.quick-supplier-btn.andere:hover{background:rgba(255,152,0,.20)}
@media (max-width:600px){.quick-supplier-buttons{flex-direction:row;align-items:center;justify-content:center;flex-wrap:wrap}}
/* Main layout adjustments */
.main{padding-top:10px;padding-bottom:calc(env(safe-area-inset-bottom,0px) + var(--bottom-nav-height) + var(--footer-height) + 20px);width:100%;box-sizing:border-box;position:relative;min-height:calc(100vh - 120px);overflow-y:auto}
html,body{height:100%;margin:0;overflow-y:auto}
body.login-page .main{overflow-y:auto;min-height:calc(100vh - 120px);padding-bottom:calc(var(--bottom-nav-height) + var(--footer-height) + 12px)}
/* Keep the same main start line across all templates */
body.index-root-page .main,
body.public-mode .main{padding-top:10px}

/* Public pages had larger inline top margins; align them to the same visual start */
body.public-mode .public-categories-page,
body.public-mode .public-ref-page,
body.public-mode .public-ref-detail-page,
body.public-mode .public-landing-page {
  margin-top: 10px !important;
}
.content-container{max-width:800px;margin:0 auto;padding:2rem;background:#000;border-radius:8px;color:#fafafa;box-shadow:0 4px 8px rgba(255,152,0,.10);overflow-y:auto;height:auto;margin-bottom:calc(var(--bottom-nav-height) + var(--footer-height) + 12px)}
/* Messages */
.messages{list-style:none;padding:0;margin:10px auto;max-width:600px}
.messages li{position:relative;padding:15px 20px;margin-bottom:10px;border-radius:4px;color:#fff;animation:slideIn .3s ease-out;overflow:hidden}
.messages li.success{background:#4caf50}
.messages li.error{background:#f44336}
@keyframes slideIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
/* Countdown bar animation */
@keyframes countdown{from{width:100%}to{width:0%}}
/* Additional extracted styles */
.progress-bar{position:absolute;bottom:0;left:0;height:3px;background:rgba(255,255,255,.7);width:100%;animation:countdown 10s linear forwards}
/* Public welcome / auth block */
.welcome-block{max-width:900px;width:calc(100% - 24px);margin:14px auto 8px;padding:16px;border:1px solid #1f1f1f;border-radius:12px;background:#000}
.welcome-block h1{font-size:22px;margin:0 0 8px;color:#f5f5f5}
.welcome-block p{margin:0 0 10px;color:#ddd;line-height:1.6;text-align:justify;text-justify:inter-word;hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto}
.welcome-block #more-info{margin-top:10px}
.welcome-block #more-info h1{font-size:16px;margin:8px 0 6px;color:#f5f5f5}
.welcome-block #more-info h2{font-size:18px;margin:6px 0 6px;color:#f5f5f5}
.welcome-block button#toggle-more-info{margin-top:8px;border-radius:8px;background:#000;color:#fff;border:1px solid #333;padding:8px 12px}
form.public-auth .button-link{display:block;width:100%;padding:12px 16px;min-height:42px;line-height:20px;text-align:center;border-radius:8px;background:#4a3728;border:2px solid #FFA726;color:#FFA726;font-weight:600}
form.public-auth button.button-link{appearance:none;border:2px solid #FFA726}
form.public-auth .button-link:hover{background:#5a4738;border-color:#FFB347}
/* Thumbnails enforce black background */
.square-thumbnail,.search-results img.thumbnail,.user1-search-results img.thumbnail,.user1-searchresults img.thumbnail,.item-info .image,.image{background:#000!important}
/* Dashboard table styles */
table{width:100%;max-width:800px;margin:0 auto}
.anmerkung{margin-bottom:15px;padding:10px}
.item-info{padding:3px 0;margin:0;line-height:1.6}
.anmerkung p{margin:0 0 10px 0;padding:0;font-weight:700;font-size:1.1em}
/* Complaints preview extracted rules already partly inline; keep overrides here if needed */
.todos-columns{display:flex;gap:16px;flex-wrap:wrap}
.todos-columns .col{flex:1 1 360px;min-width:280px}
.todos-columns .col h3{margin:0 0 8px 0}

/* Public stats grid responsive styles */
@media (max-width: 359px){
  #public-stats-grid .psg-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 360px){
  #public-stats-grid .psg-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 640px){
  #public-stats-grid .psg-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 960px){
  #public-stats-grid .psg-grid{ grid-template-columns: repeat(5, minmax(0, 1fr)); }
}