
.main-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
  }
  .login-container {
    max-width: 440px;
    margin: 40px auto;
    background: #fff;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
    height: 550px;
  }
  .info-container {
    max-width: 800px;
    margin: 0px auto;
    background: #fff;
    padding: 30px;
    /* border-radius: 15px; */
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
    display: none;
    height: 550px;
    overflow: auto;
  }
  .logo img {
    width: 180px;
    display: block;
    margin: 0 auto 20px;
  }
  h3 {
    text-align: center;
    margin-bottom: 25px;
    font-weight: 600;
  }
  h4 {
    color: #333;
    border-bottom: 2px solid #eee;
    padding-bottom: 10px;
    margin-top: 30px;
    font-weight: bold;
  }
  .tab-buttons {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
  }
  .tab-buttons button {
    flex: 1;
    padding: 10px;
    margin: 0 5px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    color: #000;
    font-weight: bold;
    transition: 0.3s;
  }
  .tab-buttons button.active {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    transform: translateY(-2px);
  }
  .author-btn { background-color: #28a745; }
  .editor-btn { background-color: #17a2b8; }
  .reviewer-btn { background-color: #ffc107; color: #000; }
  .login-form {
    display: none;
  }
  div#author-info h3 {
    /* background: #28a745; */
    /* padding: 10px; */
    color: #fff;
    }
    div#editor-info h3 {
    /* background: #17a2b8; */
    /* padding: 10px; */
    color: #fff;
    }
    div#reviewer-info h3 {
    /* background: #ffc107; */
    /* padding: 10px; */
    color: #fff;
    }

  .login-form.active {
    display: block;
  }
  .info-content {
    display: none;
  }
  .info-content.active {
    display: block;
  }
  .login-form input[type="email"],
  .login-form input[type="password"] {
    width: 100%;
    padding: 10px;
    margin-bottom: 15px;
    border: 1px solid #ccc;
    border-radius: 6px;
    box-sizing: border-box;
  }
  .login-form input[type="submit"] {
    width: 100%;
    padding: 12px;
    border: none;
    border-radius: 6px;
    font-weight: bold;
    cursor: pointer;
    box-sizing: border-box;
  }
  #author input[type="submit"] { background-color: #16900a; color: #fff; }
  #editor input[type="submit"] { background-color: #12a8b3; color: #fff; }
  #reviewer input[type="submit"] { background-color: #0a57b5; color: #fff; }
  .login-error {
    color: red;
    margin: 10px 0;
    text-align: center;
  }
  .features-list {
    margin-left: 20px;
  }
  .features-list li {
    margin-bottom: 8px;
  }
  .workflow-step {
    margin-bottom: 15px;
    padding-left: 20px;
    border-left: 3px solid #ddd;
  }
  .decision-type {
    background-color: #f8f9fa;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 10px;
  }
  .decision-type strong {
    display: block;
    margin-bottom: 5px;
  }
.login-container .logo img {
    width: 300px;
}
a.author_view {
    background: #337ab7;
    color: #fff;
    padding: 5px 20px;
    border-radius: 10px;
    display: inline-block;
    margin-top: 5px;
    text-decoration: none;
}
th.author_article_title {
    width: 33%;
}

.d-flex.align-items-center.ms-4.mb-4 {
    width: 100%;
    text-align: center;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.reviewer_workflow-step {
    margin-bottom: 15px;
    padding-left: 20px;
    border-left: 3px solid #fff;
}
.editor_workflow-step {
    margin-bottom: 15px;
    padding-left: 20px;
    border-left: 3px solid #fff;
}
.author_workflow-step {
    margin-bottom: 15px;
    padding-left: 20px;
    border-left: 3px solid #fff;
}
button.tab-btn.reviewer-btn {
    color: #000;
}
/* .reviewer_container {
  width: 100%;
  height: 100%;
  background: repeating-linear-gradient(
      -45deg,
      orange,
      orangered 10px,
      orange 10px,
      orangered 20px
    )
    orange;
  background-blend-mode: screen;
} */

/* .editor_container {
  width: 100%;
  background-position: center center;
  height: 100%;
  background:
    conic-gradient(
        from 0deg at 68.4% 85.35%,
        #fff0 0 60deg,
        #38bba7 0 120deg,
        #159380 0 202.5deg,
        #fff0 0 360deg
      )
      50%/20vmin 25vmin,
    conic-gradient(
        from 0deg at 31.6% 85.35%,
        #fff0 0 157.5deg,
        #17a18c 0 240deg,
        #38bba7 0 300deg,
        #fff0 0 360deg
      )
      50%/20vmin 25vmin,
    conic-gradient(
        from 0deg at 81.35% 35.5%,
        #fff0 0 22.75deg,
        #128070 0 157.25deg,
        #fff0 0 360deg
      )
      50%/20vmin 25vmin,
    conic-gradient(
        from 0deg at 18.65% 35.5%,
        #fff0 0 202.75deg,
        #01685b 0 337.25deg,
        #fff0 0 360deg
      )
      50%/20vmin 25vmin,
    conic-gradient(
        from 0deg at 50% 50%,
        #fff0 0 60deg,
        #17a18c 0 157.5deg,
        #01685b 0 180.1deg,
        #128070 0 202.5deg,
        #159380 0 300deg,
        #fff0 0 360deg
      )
      50%/20vmin 25vmin,
    conic-gradient(
        from 0deg at 50% 21.15%,
        #fff0 0 22.5deg,
        #159380 0 120deg,
        #38bba7 0 240deg,
        #17a18c 0 337.5deg,
        #fff0 0 360deg
      )
      50%/20vmin 25vmin,
    linear-gradient(90deg, #128070 0 50%, #01685b 0 100%) 50%/20vmin 25vmin;
} */

/* .author_container {
  width: 100%;
  height: 100%;
  background: repeating-linear-gradient(45deg, #28a745, #28a745 20px, #0e8a64 20px, #0e8a64 40px);
} */
form#author .signup-link {
    color: #16900a;
    text-decoration: underline;
}
form#editor .signup-link {
    color: #12a7b3;
    text-decoration: underline;
}
form#reviewer .signup-link {
    color: #0a57b5;
    text-decoration: underline;
}

.simplebar-content-wrapper .simplebar-content a.dropdown-item {
    display: inline-block !important;
}
.simplebar-content-wrapper .simplebar-content a.dropdown-item span.my_profile {
    padding-left: 10px;
}
.m-header.flex.items-center.py-4.px-6.h-header-height img {
    background: #fff;
    padding: 5px 10px;
}
.simplebar-content .ms-3.user_info {
    background: #fff;
    text-align: center;
    padding: 10px;
    margin-right: 10px;
    line-height: 30px;
    font-weight: bold;
}
.col-span-12 h4.mb-4.edit_manuscript {
    background: #cbd7ff;
    padding: 10px;
    text-align: center;
    box-shadow: 0px 0px 4px #2073d6;
}
.card.mb-4.border-primary .card-header.bg-primary.text-white {
    color: #000;
}
span.badge.status-0 {
    border: 1px solid blue;
    padding: 10px;
    margin-bottom: 5px;
    background: #2073d4;
    color: #fff;
    font-size: 14px;
    width: 100%;
    text-align: center;
}
.author_jou_details {
    display: block;
    line-height: 30px;
    background: #fff;
    padding: 10px;
}
.author_jou_details strong {
    color: #000;
    font-weight: bold;
}
.author_manuscript_details {
    background: #fff;
    line-height: 30px;
    padding: 10px;
    margin-bottom: 20px;
}
.author_manuscript_details strong {
    color: #000;
    font-weight: bold;
}

table.table-responsive.table-bordered thead tr th {
    border: 1px solid #000 !important;
    padding: 6px;
    font-weight: bold;
    font-size: 16px;
    color: #000;
}
table.table-responsive.table-bordered tbody tr td {
    border: 1px solid #000;
    padding: 6px;
}
.actions button.btn.review_btn
 {
    background: #2073d5;
    color: #fff;
    margin-bottom: 4px;
    width: 100%;
}
/* Modal background */
.modal {
    display: none; /* Hidden by default */
    position: fixed; 
    z-index: 9999; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgba(0, 0, 0, 0.5); /* Black w/ opacity */
}

/* Modal content box */
.modal-content {
    background-color: #fff;
    margin: 5% auto; 
    padding: 20px;
    border: 1px solid #ccc;
    width: 90%;
    max-width: 600px;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
    animation: slideDown 0.3s ease-out;
}

/* Close button */
.close {
    color: #f60303;
    float: right;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
    padding: 2px;
    border: 1px solid #000;
    margin-left: 10px;
}
.modal-content h3 {
    background: #12396d17;
    padding: 10px;
    text-align: left;
}

.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
}

/* Input styling */
.modal-content .form-group {
    margin-bottom: 15px;
}

.modal-content label {
    font-weight: 600;
}

.modal-content input,
.modal-content textarea {
    width: 100%;
    padding: 10px;
    margin-top: 6px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* Submit button */
.modal-content .btn-primary {
    background-color: #007bff;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 4px;
}

.modal-content .btn-primary:hover {
    background-color: #0056b3;
}

/* Error text color */
.red {
    color: red;
}

/* Optional animation */
@keyframes slideDown {
    from {
        transform: translateY(-50px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}
td.status_column span.badge.status-2 {
    font-size: 14px;
    margin-bottom: 9px;
    background: #e67e22;
    padding: 10px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: bold;
    border: 1px solid #b25a0e;
}
td.status_column a.btn.btn-info.m-2.view_btn {
    margin-bottom: 5px;
    background: #2246c2;
    width: 100%;
}
td.manuscript_status_column span {
    background: #abcfee;
    padding: 10px 6px;
    width: 126px;
    display: inline-block;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
}
.col-span-12 table.table-responsive.table-bordered {
    width: 100%;
}
/* sravya css start */
#preloader {
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: black;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 9999;
  }
  
  /* Hide preloader after loading */
  body.loaded #preloader {
	display: none;
  }
  
  /* Style each dot */
  #preloader div.dot {
	width: 12px;
	height: 12px;
	background: black;
	border-radius: 50%;
	position: absolute;
	left: 50%;
	bottom: 50%;
}
button.tab-btn.reviewer-btn.active {
    background: #0a57b5;
}
button.tab-btn.editor-btn.active {
    background: #12a8b3;
}

button.tab-btn.author-btn.active {
    background: #149009;
}

    .login-container {
      display: flex;
      width: 1070px;
      max-width: 100%;
      min-height: 600px;
      background: white;
      border-radius: 12px;
      box-shadow: 20px 15px 40px rgba(0, 0, 0, 0.2);
      overflow: hidden;
    }

    /* Left panel: your .info-container */
    .info-container {
      flex: 2;
      background: linear-gradient(135deg, #1a365d 0%, #2d3748 100%);
      color: white;
      padding: 20px 40px;
      overflow-y: auto;
    }

    /* Style headings in left panel */
    .info-container h3,
    .info-container h4 {
      font-weight: 700;
      margin-bottom: 10px;
    }
    .info-container h3 {
      font-size: 26px;
    }
    .info-container h4 {
      font-size: 20px;
      margin-top: 20px;
      color: #fff;
    }

    /* White text and subtle opacity for paragraphs */
    .info-container p, .author_workflow-step p, .editor_workflow-step p, .reviewer_workflow-step p {
      color: rgba(255 255 255 / 0.9);
      line-height: 1.6;
      margin-bottom: 10px;
    }

    /* Style features lists in left panel */
    .features-list {
      list-style: none;
      padding-left: 0;
      margin-bottom: 20px;
    }
    .features-list li {
      margin-bottom: 12px;
      position: relative;
      padding-left: 25px;
    }
    .features-list li::before {
      content: "✓";
      position: absolute;
      left: 0;
      color: #4fd1c7;
      font-weight: bold;
    }

    /* Decision-type and workflow-step boxes styling */
    .decision-type, .author_workflow-step, .editor_workflow-step, .reviewer_workflow-step {
      background: rgba(255 255 255 / 0.15);
      border-radius: 8px;
      padding: 10px 15px;
      margin-bottom: 15px;
    }
    .decision-type strong {
      display: block;
      margin-bottom: 5px;
      font-weight: 700;
    }

    /* Scroll left panel if content overflows */
    .info-container {
      max-height: 580px;
      overflow-y: auto;
      scrollbar-color: white transparent;
    }

    /* Right panel: login forms container */
    .login-right {
      flex: 1;
      padding: 50px 40px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-width: 320px;
      border: 2px solid black;
      margin-left: 10px;
      border-radius: 15px;
      height: 548px;
    }

    .logo {
      text-align: center;
      /* margin-bottom: 30px; */
    }
    .logo img {
      max-width: 180px;
      height: auto;
      display: inline-block;
    }

    /* Header below logo */
    .login-right h3 {
      text-align: center;
      font-weight: 700;
      margin-bottom: 10px;
      color: #1a365d;
    }
    .login-right p {
      text-align: center;
      margin-bottom: 30px;
      color: #718096;
      font-size: 14px;
    }

    /* Tabs */
    .tab-buttons {
      display: flex;
      justify-content: center;
      margin-bottom: 20px;
      gap: 6px;
    }
    .tab-btn {
      padding: 8px 22px;
      border-radius: 8px 8px 0 0;
      border: none;
      font-weight: 600;
      background: #f7fafc;
      color: #2d3748;
      cursor: pointer;
      font-size: 15px;
      transition: all 0.2s;
      outline: none;
    }
    .tab-btn.active,
    .tab-btn:focus {
      background: #1a365d;
      color: #fff !important;
    }

    /* Login forms */
    .login-form {
      width: 100%;
      display: none;
      flex-direction: column;
    }
    .login-form.active {
      display: flex;
    }
    .login-form input[type="email"],
    .login-form input[type="password"] {
      margin-bottom: 15px;
      padding: 12px 16px;
      font-size: 15px;
      border-radius: 6px;
      border: 1px solid #cbd5e0;
      transition: all 0.3s;
    }
    .login-form input[type="email"]:focus,
    .login-form input[type="password"]:focus {
      border-color: #4299e1;
      box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.2);
      outline: none;
    }
    .login-form input[type="submit"] {
      background: #1a365d;
      color: white;
      border: none;
      padding: 14px;
      border-radius: 8px;
      font-weight: 600;
      cursor: pointer;
      transition: background 0.3s;
    }
    .login-form input[type="submit"]:hover {
      background: #2d3748;
    }

    /* Signup links */
    .signup-link {
      margin-top: 10px;
      text-align: center;
      font-size: 14px;
      color: #718096;
    }
    .signup-link a {
      color: #4299e1;
      text-decoration: none;
    }
    .signup-link a:hover {
      text-decoration: underline;
    }

    /* Error display styling if needed */
    .form-error {
      color: #e53e3e;
      font-size: 13px;
      margin-bottom: 10px;
      text-align: center;
    }

    @media (max-width: 768px) {
      body {
        padding: 10px;
      }
      .login-container {
        flex-direction: column;
        min-height: auto;
        width: 100%;
        border-radius: 8px;
      }
      .info-container,
      .login-right {
        padding: 30px 20px;
      }
      .info-container {
        order: 2;
        max-height: none;
      }
      .login-right {
        order: 1;
      }
    }
td span.badge.status-2 {
    font-size: 14px;
    margin-bottom: 9px;
    background: #92bdd8;
    padding: 10px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: bold;
    border: 1px solid #1277b7;
}
td span.badge.status-1 {
    font-size: 14px;
    margin-bottom: 9px;
    background: #92bdd8;
    padding: 10px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: bold;
    border: 1px solid #1277b7;
}
td span.badge.status-6 {
    font-size: 14px;
    margin-bottom: 9px;
    background: #92bdd8;
    padding: 10px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: bold;
    border: 1px solid #1277b7;
}
td span.badge.status-7 {
    font-size: 14px;
    margin-bottom: 9px;
    background: red;
    padding: 10px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: bold;
    border: 1px solid #1277b7;
}
td span.badge.status-4 {
    font-size: 14px;
    margin-bottom: 9px;
    background: #92bdd8;
    padding: 10px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: bold;
    border: 1px solid #1277b7;
}
 td.status_column span.badge.status-1 {
    font-size: 14px;
    margin-bottom: 9px;
    background: #8c6a04;
    padding: 10px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: bold;
    border: 1px solid #91810b;
}
td.status_column span.badge.status-4 {
    font-size: 14px;
    margin-bottom: 9px;
    background: #38bba7;
    padding: 10px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: bold;
    border: 1px solid #17a2b8;
}
td.status_column span.badge.status-3 {
    font-size: 14px;
    margin-bottom: 9px;
    background: #84d8a3;
    padding: 10px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-weight: bold;
    border: 1px solid #22b20e;
}
.tabs .tab {
    padding: 10px 20px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s;
    font-weight: 900;
    white-space: nowrap;
    font-size: 12px;
}
.tabs .tab.active {
    background: #2563eb;
    color: white;
}
.tabs {
    display: flex;
    background: white;
    border-radius: 10px;
    padding: 5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    margin-bottom: 25px;
    flex-wrap: wrap;
    border: 1px solid;
}
.mt-2.text-muted {
    text-align: center;
    background: #17a2b8;
    color: #fff;
}
.details-table {
    width: 100%;
    border-collapse: collapse;
}
.details-table td {
    padding: 6px 10px;
    vertical-align: top;
}
.details-table td:first-child {
    width: 200px;  /* keeps labels aligned */
    font-weight: bold;
}
.manuscript-table {
    width: 100%;
    border-collapse: collapse;
}
.manuscript-table td {
    padding: 6px 10px;
    vertical-align: top;
}
.manuscript-table td:first-child {
    width: 200px; 
    font-weight: bold;
}
span.badge.status-.\36 {
    font-size: 14px;
    background: #31cfc2;
}
span.badge.status-.\31 {
    background: #9fc4e5;
    font-size: 14px;
}
span.badge.status-.\34 {
    font-size: 14px;
    background: #28a745;
}
span.badge.status-.\32 {
    font-size: 14px;
    background: #ffc107;
}
h4.mb-4 {
    font-size: 24px;
}
.dwnld-btn-secondary:hover{
  --tw-bg-opacity: 1;
  background-color: #1d515a;
;
}
.dwnld-btn-secondary {
    --tw-bg-opacity: 1;
    background-color: #17a2b8;
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
}
.d-flex.justify-content-between.align-items-center{
  display:flex;
  align-items: center;
}
.manuscript_files {
    margin-right: 5px;
    flex-grow: 1;
}
.dashboard_btn {
    margin-top: 15px;
}
.text-danger_form_error {
    background: #a43939;
    padding: 0px;
    margin-top: 5px;
    color: #fff;
    text-align: center;
}

#flash-message {
    padding: 15px;
    margin-bottom: 20px;
    border-radius: 5px;
    font-size: 16px;
    font-weight: 600;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
}

#flash-message.alert-success {
    background-color: #d4edda; 
    color: #155724;
    border: 1px solid #c3e6cb; 
}

#flash-message.alert-danger {
    background-color: #f8d7da; 
    color: #721c24; 
    border: 1px solid #f5c6cb; 
}

#flash-message.alert-success {
    border-left: 5px solid #28a745; 
}

#flash-message.alert-danger {
    border-left: 5px solid #dc3545; 
}

#flash-message p {
    margin: 0;
}

#flash-message .close {
    color: inherit;
    font-size: 20px;
    font-weight: bold;
    text-shadow: none;
    background: none;
    border: none;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 10px;
}


@keyframes fadeOut {
    0% { opacity: 1; }
    100% { opacity: 0; }
}

#flash-message.fade-out {
    animation: fadeOut 2s forwards; 
}

.alert.alert-success.text-center {
    border: 1px solid #39b748;
    background: #95c998;
}

.alert.alert-success.text-center h3 {
    border: 1px solid #20a227;
    margin: 9px;
    font-size: 20px;
    padding: 5px;
}

.alert.alert-danger.text-center {
    border: 1px solid #ff0000;
    background: #ffb3b3;
}

.alert.alert-danger.text-center h3 {
    border: 1px solid #ff0000;
    margin: 9px;
    font-size: 20px;
    padding: 5px;
}

.bg-light.rounded.h-100.p-4 {
    background: #fff;
    border-radius: 5px;
    padding: 30px;
}

table.table-responsive.table-bordered th{
  border: 1px solid #000 !important;
  padding:6px;
}

.page-header-title h5.mb-0.font-medium {
    font-weight: bold;
    color: #333;
    border-bottom: 2px solid #cfcdcd;
    padding-bottom: 10px;
    margin-top: 10px;
    font-size: 26px;
}

span.author_main_title {
    color: #2073d3;
    font-weight: bold;
}

span.jou_short_code {
    color: #2073d3;
    font-weight: bold;
    text-transform: uppercase;
}
.header-wrapper.flex.max-sm\:px-\[15px\].px-\[25px\].grow {
    background: #fff;
}
.btn.contact-btn-info.header-btn {
    --tw-bg-opacity: 1;
    background-color: rgb(62 191 234 / var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
    text-align: center;
    display: block;
    margin: 0 auto;
}

.form-control:disabled, .form-control:read-only {
    background-color: #e9ecef;
    opacity: 1;
}
h6.mb-0 {
    font-weight: bold;
    color: #2073d7;
}
h5.mb-3{
  padding: 10px;
  font-weight: bold;
  font-size: 24px;
}
.author_jou_details h5 {
    padding: 10px;
    font-weight: bold;
    font-size: 24px;
}
.author_manuscript_details h5{
  padding: 10px;
  font-weight: bold;
  font-size: 24px;
}
span.fw-bold {
    font-weight: bold;
}
/* sravya css end */
