@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500&display=swap');

body {
  font-family: 'Montserrat', sans-serif;
  font-size: 10pt;
}

.content-table {
    border-collapse: collapse;
    margin: 25px auto;
    font-size: 0.9em;
    min-width: 400px;
    border-radius: 5px 5px 0 0;
    overflow: hidden;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
  }
  
  .content-table thead tr {
    background-color: #009879;
    color: #ffffff;
    text-align: left;
    font-weight: bold;
  }
  
  .content-table th,
  .content-table td {
    padding: 12px 15px;
    text-align: center;
    vertical-align: middle;
  }
  
  .content-table tbody tr {
    border-bottom: 1px solid #dddddd;
  }
  
  .content-table tbody tr:nth-of-type(even) {
    background-color: #f3f3f3;
  }
  
  .content-table tbody tr:last-of-type {
    border-bottom: 6px solid #00aeff;
  }
  
  .content-table tbody tr.active-row {
    font-weight: bold;
    color: #009879;
  }

  /* Styling for the signature block */
  .signature {
    max-width: 600px; /* Adjust as needed for optimal signature width */
    margin: 20px auto; /* Centers the div horizontally and adds vertical margin */
  }
  
  /* Společné styly pro všechna tlačítka */
  .button-msic,
  .button-suv,
  .button-b2s,
  .button-uso,
  .button-innoverse,
  .button-bf,
  .button-vanoce,
  .button-christmas,
  .btn-danger {
    border: none;
    color: white;
    padding: 12px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    border-radius: 10px;
    min-width: 140px;
    min-height: 45px;
    line-height: 1.3;
    white-space: normal;
    word-wrap: break-word;
  }

  .button-msic{
    background-color: #00aeff; /* msic */
  }
  .button-suv {
    background-color: #4CADC9; /* SUV */
  }
  .button-b2s {
    background-color: #ffd54f; /* B2S */
  }
  .button-uso {
    background-color: #00A6CF; /* ÜSO */
  }
  .button-innoverse {
    background-color: #BB2332; /* innoverse */
  }
  .btn-danger {
    background-color: #dc3545; /* Bootstrap danger */
  }

  .button-bf {
    background: linear-gradient(to right, #0e4495 1%, #009846 100%); /* BF */
  }
  .button-bf:hover {
    background: linear-gradient(to right, #0e4495 1%, #009846 100%); /* BF */
    color: yellowgreen;
  }
  .button-vanoce {
    background-color: #4caeff; /* vanoce */
  }


  .brsmall {
    display: block;
    margin-bottom: 2em;
  }

  .small
{
    line-height:100px;
}

.button-christmas {
	display: inline-block;
	-webkit-box-sizing:border-box;
	   -moz-box-sizing:border-box;
	        box-sizing:border-box;
	min-width: 140px;
	min-height: 45px;
	padding: 12px 20px;
	text-decoration: none;
	color: #FFF;
	text-shadow: 0 1px 2px rgba(0,0,0,0.75);
	background: #5e0d0c;
	outline: none;
	border-radius: 10px;
	border: 1px solid #4c0300;
	box-shadow:
		inset 1px 1px 0px rgba(255,255,255,0.25), /* highlight */
		inset 0 0 6px #a23227, /* inner glow */
		inset 0 80px 80px -40px #ac3223, /* gradient */
		1px 1px 3px rgba(0,0,0,0.75); /* shadow */
		
	position: relative;
	overflow: visible; /* IE9 & 10 */
	-webkit-transition: 500ms linear;
	   -moz-transition: 500ms linear;
	     -o-transition: 500ms linear;
					transition: 500ms linear;
}

.button-christmas::before {
	content: '';
	display: block;
	position: absolute;
	top: -7px;
	left: -3px;
	right: 0;
	height: 23px;
	background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACsAAAAXCAYAAACS5bYWAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAABFpJREFUeNrUV0tIo1cUvpkYjQ4xxSA6DxuNqG0dtaUKOgs3s6i0dFd3pSsXdjeIixakiGA34sZuXCkoONLFwJTK4GMYLYXg29gatTpiXurkbd7vv9/5ub+IxuhA7eiFQ5Kbc8/57ne/e87/ywRBYLdl3GG3aNwqsLJ0k0tLS+fmcnNzWUVFBVMoFGx2djarvLxcm5OTw+bm5iytra2xc4ExNjY27iqVyvvwK6CpeDzuCYVC1urq6qDA9UcfPp+PHR4esmAwKK6tr68/l5/8rgQ2Ozub1dbWyiYmJooaGxt/VqvV38jlchX9l0qlwoFA4DWS/RKLxRxFRUVf5+XlPcaaT2AP0sVPJBL2SCRiAPBpu93+vKamZo/Ae71eZjabWV1dXVqw7CKwp43ksrCw8Bhg7MJ/PLDZ5PHx8cz29vYT5JGD/bSYLgTrcDgYdk6siSc6NjZWDaAe4ZoHQL+cmZnRpZPnhWDpD8kw7uKo9ML/NMCsd2tr61vkzboMrEyv138M7TyLRqMWMBsX3sMgaZhMpp+AR5EJrCocDpuEGzKg4x8khs+CVWxubvZfR9JkMik4nU7BarUKLpeLmLsKuwIqTLynp4fqmIzASrqQT09Pf1VVVfX0KsWZ6uHBwQHTaDSsoKAgo6/H4xHLEcrVyRwuEisrKzs5XrrIVAVwiUVDKRRrL+YI32ewdVhMApuHWvcj6vids6J2u90MF4yBHUZNgKoEBaRBQalJqFSqtJfUYrGIlQX+ydXVVTN+u0tKSjQNDQ1axJVl2iTypebn55d7e3v/kqoDgZU1NTU9LCws/Py0M+2ekuGincxJ3yF+18jIyHJLS0slQJUWFxczrBeBE0vE5tHRkbixlZWVfSR8gTX/0P5gH7S1tX3Z3t7+BW8qAvwSfr8/jA0EIRM/qoFtampqbW9vTw+XA+ojUruVd3Z2tvb19T2TQFEim81GgVJoCvvj4+NLOJZgaWmpemdn5y3a6BbcnJDAw8HBwac6ne6eqCW5XDwB3qVSqM9/DAwMUNy/eVLabT7sI25qwgujThCBhWE+mAt2yNc4SQKSZrOQQE1HS22VJkmPAGTr7+//fX19fRk+Zgq0trbGeFAKEAQT98BSqKOj47vm5uaa/Px8JeIk4GcaHh6eWlxcfAU/A8xG67BxAX3fwdcbYUpSDJ06Z49Ak8ZC3OL8f3YiA4PBYKdLQ2AJ9OTk5GpXV9cQiCVh79M94QtlPLDUE/1gPNrd3f0W33W4cBoco48zQuy/IZYAMnGqlSc4c66L9JruQUaSARXeT8HGKzxAqFBekni6+h46+pMzGiJGMgTOJh1yU/KNEGDvZWvfBawkA9ppwGg0mrRa7SOI2g+gxOgbJIpdFpj72PnxSnPX8vqRxTURgBQWKisrH+GThOm+CtAzoK/9/Uiqq/6hoaHfdnd3jaOjo7/yY7yxbwqkWy3sQzpS2C6YirwvUJk0y7hurfyGRrnduPGvAAMASmo8wzeVwfsAAAAASUVORK5CYII=) no-repeat 0 0,
	url(data:image/png;base64,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) no-repeat 50% 0,
	url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACEAAAAXCAYAAACFxybfAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAodJREFUeNrsVb1rWlEUv2pN/GqspKRSKFYXWzEloIWif0Fn6dJChQ7OQil0qd3EzcEpg0OgdHDr4CQODk7VRlLMEIVqApX4We0zflR9/Z1Ui4T34ksaaAYP/Hzc673n/M6550PG8zz73yKjn0wm83fDYDAwo9HINBrNnwOQg4MDs0ql2lQqlfdAWont7ng8Pjw+Ps44nc4G1pI9EXWaSOzt7TGO42aH5Pv7+08ajUZ0MBiUeXEZd7vdL5VK5fX29rZ+5tQiEmdxKrlcjsEYczgcynK5/BKKv/IXFNz/XiqVXkHdjUuRIA9SqdRD8or/R8Ez9fr9fqHVakUR4c2z0REjIQuHw2ZcrPBXLCA0RHTezEdHjIQqkUhEr9I4HOILhQLf6/VoOUFEvDMiQiToDx1Cdz+bzZ6bUFarlel0OkkVUK/XWbvdPoVer5fh3ntsfwJ+CJ2XA4p0Op1bpBgJyxDehQQ6nQ5DZXHBYDBZq9V+EhFUndnr9drEqoc2bwJbwGPgtohuVSwWe2Gz2TZMJpNgRKi6qtUqg2EWj8dTgUDgo0KhWPN4PC70EvXOzs67fD6/S6kiRIKeZA1YJ2MiJNbdbvfTUCjkV6vVK2hcDF8GI2w0GrGTkxM2HA5PDxaLxSOfz/cWEfk81X0XIMMFgJJ/srBjCgk8IdcfuVyuZ36//7nFYtkQyAMumUzuRiKRD0jMFLa+AZOpYwqgB/ziBVqmVBKUO7eAB/R0WG/Z7XaTVqtdbTabHJL6EK2djBaBPHA0NSqpbUsiMUeEBgpF4Q5AbZrmSJ/yEWgBTaBNHl9kdkgmMUeG7qwAq9PqovceTA3zlxlgsuswyuXsGsiSxJLEkoSY/BZgAEjRodi+uBruAAAAAElFTkSuQmCC) no-repeat 100% 0;
	
}
.button-christmas:hover {
	background: #a61715;
	text-shadow: 0 1px 2px rgba(0,0,0,0.75), 0 0 40px #FFF;
	box-shadow:
		inset 1px 1px 0px rgba(255,255,255,0.25), /* highlight */
		inset 0 0 6px #da3b2c, /* inner glow */
		inset 0 80px 80px -40px #dd4330, /* gradient */
		1px 1px 3px rgba(0,0,0,0.75); /* shadow */
		
}
.button-christmas:focus {
	outline: none; /*FF*/
}
.button-christmas:active {
	box-shadow:
		inset 1px 1px 0px rgba(255,255,255,0.25), /* highlight */
		inset 0 0 6px #da3b2c, /* inner glow */
		inset 0 80px 80px -40px #dd4330, /* gradient */
		0px 1px 0px rgba(255,255,255,0.25); /* shadow */
		
	-webkit-transition: 50ms linear;
	   -moz-transition: 50ms linear;
	     -o-transition: 50ms linear;
	        transition: 50ms linear;
}

/* ============================================
   Live Search Styles
   ============================================ */

/* Live search results container - dropdown overlay */
.live-search-results {
  display: none; /* JavaScript zobrazí když je potřeba */
  background-color: white;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  padding: 15px;
  margin: 10px auto;
  max-width: 90%;
  max-height: 70vh;
  overflow-y: auto;
  position: relative;
  z-index: 1000;
  animation: slideDown 0.3s ease-out;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* When live search is active, hide default table (only on index page) */
.live-search-results:not(:empty) ~ .content #default-employee-table {
  display: none;
}

#loading-indicator {
  display: inline-block;
  font-size: 16px;
  animation: pulse 1s infinite;
}

@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}

.error-message {
  color: #dc3545;
  font-size: 14px;
  padding: 10px;
  background-color: #f8d7da;
  border: 1px solid #f5c6cb;
  border-radius: 4px;
  margin: 10px 0;
}

/* Smooth fade-in pro výsledky */
.live-search-results table {
  animation: fadeIn 0.3s ease-in;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Highlight pro search input při focusu */
#live-search-input:focus {
  outline: none;
  border-color: #004b93;
  box-shadow: 0 0 0 0.2rem rgba(0, 75, 147, 0.25);
}

/* Responsive live search */
@media (max-width: 768px) {
  .live-search-results {
    max-width: 95%;
    padding: 10px;
    max-height: 60vh;
  }
}

/* ============================================
   MSIC Navbar - Unified Design
   ============================================ */

.navbar-msic {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #00498f;
  padding: 10px 20px;
  color: white;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.navbar-brand-msic {
  display: flex;
  align-items: center;
}

.navbar-brand-msic a {
  display: flex;
  align-items: center;
  text-decoration: none;
  cursor: pointer;
}

.navbar-brand-msic .logo-msic {
  height: 40px;
  width: auto;
  display: block;
  transition: opacity 0.2s ease;
}

.navbar-brand-msic a:hover .logo-msic {
  opacity: 0.8;
}

.navbar-links-msic {
  display: flex;
  align-items: center;
  gap: 8px;
}

.navbar-links-msic a {
  color: white;
  text-decoration: none;
  margin-left: 8px;
  padding: 5px 10px;
  border-radius: 4px;
  transition: background-color 0.2s ease;
}

.navbar-links-msic a:hover {
  text-decoration: underline;
  background-color: rgba(255, 255, 255, 0.1);
}

.navbar-search-msic {
  display: inline-block;
  margin-left: 15px;
}

.navbar-search-msic input {
  padding: 6px 12px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 4px;
  background-color: rgba(255, 255, 255, 0.15);
  color: white;
  font-size: 14px;
  width: 250px;
  transition: all 0.2s ease;
}

.navbar-search-msic input::placeholder {
  color: rgba(255, 255, 255, 0.7);
}

.navbar-search-msic input:focus {
  outline: none;
  background-color: rgba(255, 255, 255, 0.25);
  border-color: rgba(255, 255, 255, 0.5);
  width: 300px;
}

#loading-indicator {
  color: white;
  margin-left: 8px;
}

/* Responsive */
@media (max-width: 768px) {
  .navbar-msic {
    flex-direction: column;
    padding: 10px;
    gap: 10px;
  }

  .navbar-brand-msic {
    width: 100%;
    justify-content: center;
  }

  .navbar-links-msic {
    flex-direction: column;
    width: 100%;
    gap: 5px;
  }

  .navbar-links-msic a {
    margin-left: 0;
    margin-top: 4px;
    width: 100%;
    text-align: center;
  }

  .navbar-search-msic {
    width: 100%;
    margin-left: 0;
    margin-top: 5px;
  }

  .navbar-search-msic input {
    width: 100%;
  }

  .navbar-search-msic input:focus {
    width: 100%;
  }
}