html{box-sizing:border-box}*,*::after,*::before{box-sizing:inherit}pre code{display:block;padding:0.5em;color:#333;background:#f8f8ff}pre .comment,pre .template_comment,pre .diff .header,pre .javadoc{color:#998;font-style:italic}pre .keyword,pre .css .rule .keyword,pre .winutils,pre .javascript .title,pre .nginx .title,pre .subst,pre .request,pre .status{color:#333;font-weight:bold}pre .number,pre .hexcolor,pre .ruby .constant{color:#099}pre .string,pre .tag .value,pre .phpdoc,pre .tex .formula{color:#d14}pre .title,pre .id{color:#900;font-weight:bold}pre .javascript .title,pre .lisp .title,pre .clojure .title,pre .subst{font-weight:normal}pre .class .title,pre .haskell .type,pre .vhdl .literal,pre .tex .command{color:#458;font-weight:bold}pre .tag,pre .tag .title,pre .rules .property,pre .django .tag .keyword{color:#000080;font-weight:normal}pre .attribute,pre .variable,pre .lisp .body{color:#008080}pre .regexp{color:#009926}pre .class{color:#458;font-weight:bold}pre .symbol,pre .ruby .symbol .string,pre .lisp .keyword,pre .tex .special,pre .prompt{color:#990073}pre .built_in,pre .lisp .title,pre .clojure .built_in{color:#0086b3}pre .preprocessor,pre .pi,pre .doctype,pre .shebang,pre .cdata{color:#999;font-weight:bold}pre .deletion{background:#fdd}pre .addition{background:#dfd}pre .diff .change{background:#0086b3}pre .chunk{color:#aaa}*{margin:0;padding:0}body,html{background:#efedea;color:#333;font-weight:400;font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;font-size:16px;line-height:1.375em;
/* Flexbox for sticky footer */
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
/* Make main content grow to push footer down */
main {
  flex-grow: 1;
}
.wrapper{max-width:1200px;margin-left:auto;margin-right:auto}.wrapper::after{clear:both;content:"";display:block}.wrapper .padder{padding:1.5em}.wrapper .sidebar{float:left;display:block;margin-right:2.35765%;width:23.23176%}.wrapper .sidebar:last-child{margin-right:0}.wrapper .main{float:left;display:block;margin-right:2.35765%;width:74.41059%;margin-right:0}.wrapper .main:last-child{margin-right:0}h1{font-size:2.5em;line-height:1.1em; color: inherit;}h2{font-size:2.25em;line-height:1.25em}h3{font-size:1.75em;line-height:1.25em}h4{font-size:1.125em;line-height:1.22222222em}h1,h2,h3,h4,h5,h6{font-weight:400;margin-bottom:0.4em}blockquote{font-size:1.125em;line-height:1.22222222em;font-style:italic;border-left:solid 3px #697683;padding-left:0.8em}blockquote,dd,hr,ol,p,pre,ul{margin-bottom:1em}table{width:100%;border-collapse:collapse;border:solid 1px #e0e0e0;border-radius:2px}table td,table th{text-align:left;padding:.4em;border-bottom:solid 1px #e0e0e0}table th{background:#f8f8ff;font-weight:500}.fixed-layout{table-layout:fixed}hr{border-style:solid;border-color:#e0e0e0}ol,ul{margin-left:2em}ol li,ul li{margin-bottom:0.4em}ol li:last-child,ul li:last-child{margin:0}ol li ol,ol li ul,ul li ol,ul li ul{margin-top:0.4em;margin-left:1.2em}ol li p:last-child,ul li p:last-child{margin-bottom:0}ul{list-style:disc}dt{font-weight:500;text-decoration:underline}code{background:#f8f8ff;border:solid 1px #e0e0e0;border-radius:2px;color:#333;padding:0 0.25em}a{color:#697683;text-decoration:none;transition:0.222s}a:link{color:#697683}a:hover{color:#4b545c}a:active{color:#8796a5}a:visited{color:#5a6672}strong{font-weight:500}del{font-style:italic}.button,.button:link,button,input[type=button],input[type=submit]{background:#697683;border:solid 1px #697683;padding:0.6em 1.2em;border-radius:3px;display:inline-block;line-height:normal;color:#ffffff;font-size:1em;cursor:pointer; transition: background-color 0.2s ease, border-color 0.2s ease}.button:hover,.button:link:hover,button:hover,input[type=button]:hover,input[type=submit]:hover{background-color:#4b545c; border-color:#4b545c; color: #ffffff}fieldset{padding:1em;border:solid 1px #e0e0e0;margin-bottom:1em;border-radius:2px}fieldset legend{font-size:1.75em;line-height:1.25em;padding:0.4em}input[type=text],input[type=password]{border:solid 1px #ccc;padding:0.6em;border-radius:3px;font-size:1em;box-sizing:border-box}header{background:#697683; color: #ffffff;}header h1,header h2,header h3,header h4,header h5,header h6,header p{margin:0; color: inherit;}footer{background:#697683; color: #efedea;}footer p{color:inherit;margin:0}

/*# sourceMappingURL=style.css.map */
.loading-spinner {
    display: none; /* Ensure hidden by default */
    position: relative; /* Changed from fixed for inline flow */
    /* Adjusted size and border for less 'egg' shape */
    width: 32px; 
    height: 32px;
    border: 4px solid #f3f3f3; /* Light grey */
    border-top: 4px solid #3498db; /* Blue */
    border-radius: 50%;
    /* Removed margin-top/left, rely on flex gap */
    /* background, padding, shadow removed as they are not needed for simple spinner */
    animation: spin 1s linear infinite; /* Faster spin */
  }
  
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }
  
  .warn{
    background-color: yellow;
    color:gray;
  }

/* Added table zebra striping */
tbody tr:nth-child(odd) {
  background-color: #f7f7f7; /* Slightly off-white for odd rows */
}

tbody tr:nth-child(even) {
  background-color: #ffffff; /* White for even rows */
}

/* Optional: Hover effect for table rows */
tbody tr:hover {
  background-color: #eef; /* Light blue hover */
}

/* Style for header logo to make it white */
/* Using .msclogo class as provided in HTML snippet */
.msclogo {
    filter: brightness(0) invert(1);
    margin-bottom: 0.5em;
    display: block; /* Or inline-block if needed */
}

.serial-info{display:none}

/* --- Login Page Styles --- */
.login-container {
  padding-top: 3rem; /* Add some space from the header */
}

.login-card {
  max-width: 28rem; /* = max-w-md */
  margin-left: auto;
  margin-right: auto;
  background-color: #ffffff;
  padding: 2rem; /* px-8 pt-6 pb-8 */
  border-radius: 0.375rem; /* rounded */
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); /* shadow-md */
  margin-bottom: 1rem;
}

.login-title {
  font-size: 1.5rem; /* text-2xl */
  font-weight: 600; /* font-semibold */
  margin-bottom: 1.5rem; /* mb-6 */
  text-align: center;
  color: #374151; /* text-gray-800 */
}

.login-form .form-group {
  margin-bottom: 1.25rem; /* Adjust spacing between form groups */
}

.login-form .form-group:last-child {
  margin-bottom: 0;
}

.form-label {
  display: block;
  color: #374151; /* text-gray-700 */
  font-size: 0.875rem; /* text-sm */
  font-weight: 700; /* font-bold */
  margin-bottom: 0.5rem; /* mb-2 */
}

.form-input {
  display: block; /* Make input take full width */
  width: 100%; 
  border: 1px solid #d1d5db; /* border-gray-300 */
  border-radius: 0.375rem; /* rounded */
  padding: 0.5rem 0.75rem; /* py-2 px-3 */
  color: #374151; /* text-gray-700 */
  line-height: 1.25; /* leading-tight */
  box-sizing: border-box; /* Ensure padding/border is included in width */
}

.form-input:focus {
  outline: none;
  border-color: #697683; /* focus:border-primary-500 (use primary color) */
  /* Optional: add focus ring */
  /* box-shadow: 0 0 0 3px rgba(105, 118, 131, 0.3); */ 
}

.form-button {
  width: 100%; /* Make button full width */
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.login-error-message {
  margin-top: 1rem; /* mt-4 */
  padding: 0.75rem; /* p-3 */
  font-size: 0.875rem; /* text-sm */
  color: #991b1b; /* text-red-800 */
  background-color: #fee2e2; /* bg-red-200 */
  border-radius: 0.375rem; /* rounded */
  border: 1px solid #fecaca; /* border-red-400 */
}

/* --- Index Page Styles --- */
.license-form {
  margin-bottom: 1.5rem; /* mb-6 */
}

/* Reuse login form styles for consistency */
.license-form .form-label {
  display: block;
  margin-bottom: 0.5rem;
  font-size: 0.875rem; 
  font-weight: 500; 
}

.license-form .form-input-group {
  display: flex;
  align-items: center; 
  gap: 0.5rem; /* space-x-2 */
}

.license-form .form-input {
  flex-grow: 1; /* Allow input to take available space */
  /* Removed min-width, added max-width */
  max-width: 25rem; 
  border: 1px solid #d1d5db; 
  border-radius: 0.375rem; 
  padding: 0.5rem 0.75rem; 
  color: #374151; 
  line-height: 1.25; 
  box-sizing: border-box;
}

.license-form .form-input:focus {
  outline: none;
  border-color: #697683; 
}

/* Info Table Styles */
.info-table-container {
  overflow-x: auto; /* For smaller screens */
  box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); /* shadow-md */
  border-radius: 0.5rem; /* sm:rounded-lg */
}

.info-table {
  width: 100%;
  font-size: 0.875rem; /* text-sm */
  text-align: left;
  color: #374151; /* text-gray-700 */
  border-collapse: collapse; 
}

.info-table thead {
  font-size: 0.75rem; /* text-xs */
  color: #374151; /* text-gray-700 */
  text-transform: uppercase;
  background-color: #f9fafb; /* bg-gray-50 */
}

.table-header {
  padding: 0.75rem 1.5rem; /* py-3 px-6 */
  font-weight: 600; /* font-semibold */
}

.table-cell {
  padding: 1rem 1.5rem; /* py-4 px-6 */
  vertical-align: top;
}

.table-row {
   border-bottom-width: 1px; 
   border-color: #e5e7eb; /* Default border color */
}

/* Alert Message Styling */
#alert {
  display: block; /* Ensure it takes block space */
  padding: 1rem; /* p-4 */
  margin-bottom: 1rem; /* mb-4 */
  font-size: 0.875rem; /* text-sm */
  border-radius: 0.375rem; /* rounded */
  border-width: 1px;
  border-style: solid;
}

#alert:empty {
  display: none; /* Hide if empty */
}

#alert.error, .renew-error.error {
  color: #991b1b; /* text-red-800 */
  background-color: #fee2e2; /* bg-red-200 */
  border-color: #fecaca; /* border-red-400 */
}

#alert.warning {
  color: #92400e; /* text-yellow-800 */
  background-color: #fef3c7; /* bg-yellow-100 */
  border-color: #fde68a; /* border-yellow-400 */
}

#alert.info {
  color: #1e40af; /* text-blue-800 */
  background-color: #dbeafe; /* bg-blue-100 */
  border-color: #bfdbfe; /* border-blue-400 */
}

/* Style for the .renew-error heading specifically */
.renew-error {
  font-size: 1.125rem; /* text-lg */
  font-weight: 600; /* font-semibold */
  margin-bottom: 1rem; /* mb-4 */
}

.renew-error:not(.error) {
  display: none; /* Hide if it doesn't have the error class (and presumably no text) */
}