/* ===========================================================
   SRI BHAVANA DEVELOPERS ADMIN THEME
   Batch 01 - Core / Login / Upload
=========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap');


body {
  margin: 0;
  font-family: 'Manrope', sans-serif;
  background: #F8FAFC;
  color: #1F2937;
}

/* ===========================
   Page Header
=========================== */

.page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 35px;
}

.page-title {

  font-size: 30px;
  font-weight: 600;
  color: #071C33;
  letter-spacing: .3px;
}

/* ===========================
   Upload Card
=========================== */

.upload-card {

  width: 100%;
  max-width: 760px;

  margin: 0 auto;

  padding: 35px;

  background: #fff;

  border-radius: 18px;

  border: 1px solid #E6E8EC;

  box-shadow:
    0 10px 30px rgba(7, 28, 51, .08);

}

/* ===========================
   Logo
=========================== */

.upload-logo {

  width: 170px;
  display: block;
  margin: 0 auto 25px;

}

/* ===========================
   Label
=========================== */

.upload-label {

  color: #4B5563;
  font-weight: 500;
  margin-bottom: 10px;

}

/* ===========================
   Upload Box
=========================== */

.file-box {

  border: 2px dashed #D8A031;

  background: #FFFDF8;

  padding: 35px;

  text-align: center;

  border-radius: 16px;

  cursor: pointer;

  transition: .30s;

}

.file-box:hover {

  background: #FFF7E5;

  border-color: #C48E22;

}

.file-box input {

  display: none;

}

.file-text {

  color: #6B7280;
  font-size: 15px;
  line-height: 1.8;

}

/* ===========================
   Upload Button
=========================== */

.btn-upload {

  margin-top: 25px;

  padding: 14px 30px;

  min-width: 190px;

  width: auto !important;

  border: none;

  border-radius: 12px;

  background: #D8A031;

  color: #fff;

  font-size: 15px;

  font-weight: 500;

  transition: .25s;

}

.btn-upload:hover {

  background: #C48E22;

  transform: translateY(-2px);

  box-shadow:

    0 12px 25px rgba(216, 160, 49, .25);

}

/* ===========================
   Responsive
=========================== */

@media(max-width:768px) {

  .upload-card {

    padding: 25px;

  }

}

/* ===========================================================
   LOGIN
=========================================================== */

.login-container {

    min-height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 40px 20px;

    background:
        linear-gradient(135deg,#F8FAFC 0%,#EEF3F8 50%,#F8FAFC 100%);

}

/* ===========================
   Login Card
=========================== */

.login-card {

  width: 100%;

  max-width: 410px;

  padding: 40px;

  border-radius: 22px;

  background:#071C33;

  border:1px solid rgba(216,160,49,.25);

  box-shadow:

    0 25px 60px rgba(7, 28, 51, .20);

  position: relative;

}

/* Premium Top Border */

.login-card::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  height: 5px;

  border-radius: 22px 22px 0 0;

  background: #D8A031;

}

/* ===========================
   Logo
=========================== */

.login-logo {

  width: 190px;

  display: block;

  margin: 0 auto 30px;

}

/* ===========================
   Title
=========================== */

.form-title {

  text-align: center;

  font-size: 28px;

  font-weight: 600;

  color: #fff;

  margin-bottom: 30px;

}

/* ===========================
   Labels
=========================== */

label {

  color: #fff;

  font-size: 14px;

  font-weight: 500;

}

/* ===========================
   Inputs
=========================== */

.form-control {

  border: 1px solid #D9DEE5;

  border-radius: 12px;

  padding: 14px 15px;

  background: #fff;

  color: #1F2937;

  font-weight: 500;

  transition: .30s;
  
   width:100%;

    height:56px;

    box-sizing:border-box;

}

.mb-3{

    width:100%;

}

.form-control::placeholder {

  color: #9CA3AF;

}

.form-control:focus {

  border-color: #D8A031;

  box-shadow:

    0 0 0 4px rgba(216, 160, 49, .15);

  outline: none;

}

/* ===========================================================
   SRI BHAVANA DEVELOPERS ADMIN THEME
   Batch 02 - Sidebar / Buttons / Footer
=========================================================== */

/* Placeholder */
.form-control::placeholder {
  color: #9CA3AF;
  font-weight: 400;
}

/* Focus */
.form-control:focus {

  outline: none;

  background: #fff;

  border-color: #D8A031;

  box-shadow:
    0 0 0 4px rgba(216, 160, 49, .15);

}

/* ===========================================================
   Primary Button
=========================================================== */

.btn-primary{

    width:100%;

    height:56px;

    background:#D8A031;

    border:none;

    border-radius:12px;

    font-weight:600;

    transition:.3s;

}

.btn-primary:hover{

    background:#C89318;

}

/* ===========================================================
   Login Footer
=========================================================== */

.login-footer {

  margin-top: 20px;

  text-align: center;

  color: #6B7280;

  font-size: 13px;

}

/* ===========================================================
   SIDEBAR
=========================================================== */

.sidebar {

  width: 270px;

  height: 100vh;

  position: fixed;

  top: 0;

  left: 0;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  padding: 28px 18px;

  background: linear-gradient(180deg,
      #071C33 0%,
      #0A2748 60%,
      #031324 100%);

  box-shadow:

    6px 0 30px rgba(7, 28, 51, .15);

  z-index: 999;

}

/* ===========================================================
   Logo
=========================================================== */

.sidebar-logo {

  text-align: center;

  margin-bottom: 35px;

}

.sidebar-logo img {

  width: 155px;

  transition: .30s;

}

.sidebar-logo img:hover {

  transform: scale(1.03);

}

.sidebar-logo h4 {

  color: #fff;

  margin-top: 12px;

  font-size: 20px;

  font-weight: 600;

  letter-spacing: .5px;

}

/* ===========================================================
   Sidebar Menu
=========================================================== */

.sidebar-menu {

  list-style: none;

  padding: 0;

  margin: 20px 0;

  overflow-y: auto;

  flex-grow: 1;

}

.sidebar-menu li {

  margin-bottom: 8px;

}

/* ===========================================================
   Menu Links
=========================================================== */

.sidebar-menu a {

  display: flex;

  align-items: center;

  gap: 14px;

  padding: 14px 18px;

  border-radius: 14px;

  text-decoration: none;

  color: #D6DFEA;

  font-size: 15px;

  font-weight: 500;

  transition: .30s;

  border-left: 4px solid transparent;

}

/* ===========================================================
   Icons
=========================================================== */

.sidebar-menu i {

  width: 20px;

  text-align: center;

  color: #D8A031;

  font-size: 17px;

}

/* ===========================================================
   Hover
=========================================================== */

.sidebar-menu a:hover {

  background: rgba(216, 160, 49, .10);

  color: #fff;

  border-left: 4px solid #D8A031;

  transform: translateX(4px);

}

/* ===========================================================
   Active Menu
=========================================================== */

.sidebar-menu a.active {

  background: #D8A031;

  color: #fff;

  border-left: 4px solid #fff;

  box-shadow:

    0 8px 18px rgba(216, 160, 49, .25);

}

.sidebar-menu a.active i {

  color: #fff;

}

/* ===========================================================
   Footer
=========================================================== */

.sidebar-footer {

  border-top: 1px solid rgba(255, 255, 255, .08);

  padding-top: 18px;

}

.sidebar-footer a {

  display: flex;

  align-items: center;

  gap: 14px;

  text-decoration: none;

  padding: 14px 16px;

  color: #D6DFEA;

  border-radius: 12px;

  transition: .30s;

}

.sidebar-footer a:hover {

  background: rgba(220, 38, 38, .10);

  color: #FF6B6B;

}

/* ===========================================================
   Scrollbar
=========================================================== */

.sidebar-menu::-webkit-scrollbar {

  width: 6px;

}

.sidebar-menu::-webkit-scrollbar-track {

  background: transparent;

}

.sidebar-menu::-webkit-scrollbar-thumb {

  background: #D8A031;

  border-radius: 30px;

}

.sidebar-menu::-webkit-scrollbar-thumb:hover {

  background: #C48E22;

}

/* ===========================================================
   SRI BHAVANA DEVELOPERS ADMIN THEME
   Batch 03 - Dashboard / Tables / Upload
===========================================================*/

/* ===========================
   Main Content
=========================== */

.main-content {

  flex: 1;

  margin-left: 270px;

  width: calc(100% - 270px);

  min-height: 100vh;

  padding: 40px;

  background: #F5F7FA;

}

/* ===========================
   Page Title
=========================== */

.page-title {

  font-size: 30px;

  font-weight: 600;

  color: #071C33;

  margin-bottom: 28px;

}

/* ===========================
   Template Form
=========================== */

.template-form {

  display: flex;

  align-items: center;

  gap: 15px;

  margin-bottom: 30px;

  flex-wrap: wrap;

}

.template-form input,
.template-form select {

  width: 220px;

  padding: 12px 14px;

  border: 1px solid #D8DEE6;

  border-radius: 12px;

  background: #fff;

  transition: .30s;

}

.template-form input:focus,
.template-form select:focus {

  outline: none;

  border-color: #D8A031;

  box-shadow: 0 0 0 4px rgba(216, 160, 49, .12);

}

.template-form button {

  padding: 12px 26px;

  border: none;

  border-radius: 12px;

  background: #D8A031;

  color: #fff;

  font-weight: 500;

  transition: .30s;

}

.template-form button:hover {

  background: #C48E22;

}

/* ===========================
   Table Box
=========================== */

.table-box {

  background: #fff;

  border-radius: 18px;

  padding: 25px;

  border: 1px solid #E5E7EB;

  box-shadow:

    0 10px 30px rgba(7, 28, 51, .06);

}

/* ===========================
   Tables
=========================== */

table {

  width: 100%;

  border-collapse: collapse;

  background: #fff;

}

th {

  background: #071C33;

  color: #fff;

  padding: 16px;

  font-size: 14px;

  font-weight: 600;

}

td {

  padding: 16px;

  color: #374151;

  border-bottom: 1px solid #EEF2F7;

  vertical-align: middle;

}

tbody tr {

  transition: .25s;

}

tbody tr:hover {

  background: #FFF9EC;

}

/* ===========================
   Delete Button
=========================== */

.btn-delete {

  display: inline-block;

  padding: 8px 14px;

  background: #DC2626;

  color: #fff;

  border-radius: 8px;

  text-decoration: none;

  transition: .25s;

}

.btn-delete:hover {

  background: #B91C1C;

  color: #fff;

}

/* ===========================================================
   Dashboard Cards
=========================================================== */

.stat-card {

  display: flex;

  align-items: center;

  gap: 20px;

  padding: 28px;

  background: #fff;

  border-radius: 18px;

  border: 1px solid #E5E7EB;

  box-shadow:

    0 10px 25px rgba(7, 28, 51, .06);

  transition: .30s;

}

.stat-card:hover {

  transform: translateY(-5px);

  box-shadow:

    0 18px 35px rgba(7, 28, 51, .10);

}

.stat-icon {

  width: 68px;

  height: 68px;

  border-radius: 16px;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 24px;

  color: #fff;

}

/* Premium Theme Colors */

.bg-primary {

  background: #071C33;

}

.bg-success {

  background: #16A34A;

}

.bg-warning {

  background: #D8A031;

}

.stat-card h6 {

  margin: 0;

  color: #6B7280;

  font-size: 14px;

  font-weight: 500;

}

.stat-card h2 {

  margin-top: 6px;

  color: #071C33;

  font-size: 32px;

  font-weight: 700;

}

/* ===========================================================
   Headings
=========================================================== */

h2 {

  color: #071C33;

  margin-bottom: 20px;

  font-weight: 600;

}

/* Flash Messages */

p {

  margin-bottom: 12px;

  font-weight: 500;

}

p[style*="red"] {

  color: #DC2626 !important;

}

p[style*="green"] {

  color: #16A34A !important;

}

/* ===========================================================
   Upload Section
=========================================================== */

.upload-form {

  display: block !important;

  width: 100%;

}

.upload-group {

  margin-bottom: 22px;

}

.upload-input {

  width: 100%;

  padding: 14px;

  border-radius: 12px;

  border: 1px solid #D8DEE6;

}

.upload-row {

  display: flex;

  align-items: center;

  gap: 20px;

  width: 100%;

}

.file-box {

  flex: 1;

  min-height: 140px;

  display: flex;

  align-items: center;

  justify-content: center;

  border: 2px dashed #D8A031;

  border-radius: 16px;

  background: #FFFDF8;

  transition: .30s;

}

.file-box:hover {

  background: #FFF7E5;

}

.file-box input {

  display: none;

}

.file-text {

  color: #6B7280;

  font-size: 15px;

  text-align: center;

}

.btn-upload {

  flex-shrink: 0;

  padding: 14px 26px;

  border: none;

  border-radius: 12px;

  background: #D8A031;

  color: #fff;

  font-weight: 600;

  transition: .30s;

  white-space: nowrap;

}

.btn-upload:hover {

  background: #C48E22;

}

/* ===========================================================
   Media Preview
=========================================================== */

.preview-img {

  width: 80px;

  height: 80px;

  object-fit: cover;

  border-radius: 10px;

  border: 1px solid #E5E7EB;

}

.preview-video {

  width: 110px;

  height: 80px;

  object-fit: cover;

  border-radius: 10px;

  border: 1px solid #E5E7EB;

}

/* URL Input */

input[type="text"] {
    
    width: 100% !important;


  padding: 10px 12px;

  border: 1px solid #D8DEE6;

  border-radius: 10px;

}

/* Copy Button */

.copy-btn {

  background: #071C33;

}

.copy-btn:hover {

  background: #0A2748;

}

/* ===========================================================
   Progress
=========================================================== */

.progress {

  height: 18px;

  border-radius: 20px;

  background: #E9EDF2;

  overflow: hidden;

}

.progress-bar {

  border-radius: 20px;

  font-size: 11px;

  font-weight: 600;

  line-height: 18px;

  background: linear-gradient(90deg, #D8A031, #EBC35C);

}

/* ===========================================================
   Responsive
=========================================================== */

@media(max-width:768px) {

  .main-content {

    margin-left: 0;

    width: 100%;

    padding: 25px;

  }

  .template-form {

    flex-direction: column;

    align-items: stretch;

  }

  .template-form input,
  .template-form select,
  .template-form button {

    width: 100%;

  }

  .upload-row {

    flex-direction: column;

    align-items: stretch;

  }

  .btn-upload {

    width: 100%;

  }

}