/* === KADIR PLATFORMASI UMUMIY USLUBLAR === */

/* Asosiy sahifa */
body {
  background-color: #f8f9fc;
  font-family: "Segoe UI", sans-serif;
}

/* Navbar */
.navbar {
  background-color: #003566 !important;
}

.navbar-brand {
  font-weight: bold;
  color: #fff !important;
  letter-spacing: 1px;
}

.navbar .nav-link:hover {
  color: #ffd60a !important;
}

/* Sidebar */
.sidebar {
  min-height: 100vh;
  background: #002855;
  color: #fff;
}

.sidebar a {
  color: #dce3f0;
  display: block;
  padding: 10px 20px;
  text-decoration: none;
  border-radius: 6px;
  transition: background 0.2s ease-in-out;
}

.sidebar a:hover,
.sidebar a.active {
  background: #004080;
  color: #fff;
}

/* Asosiy kontent */
.content {
  background: #fff;
  border-radius: 10px;
  padding: 20px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
}

/* Footer */
.footer {
  color: #888;
  font-size: 0.9rem;
  text-align: center;
  padding: 10px;
}

/* Jadval */
.table thead {
  background-color: #cfe2ff;
  color: #003566;
  font-weight: 600;
}

.table-hover tbody tr:hover {
  background-color: #f1f5ff;
}

/* Tugmalar */
.btn-primary {
  background-color: #003566;
  border: none;
}
.btn-primary:hover {
  background-color: #002855;
}
.btn-danger {
  background-color: #dc3545;
  border: none;
}
.btn-danger:hover {
  background-color: #bb2d3b;
}

/* Alertlar */
.alert {
  border-radius: 6px;
  font-weight: 500;
  animation: fadeIn 0.4s ease-in-out;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}


/* 🔹 Form elementlarini chiroyli qilish */
/*.form-control, .form-select {*/
/*  border-radius: 8px;*/
/*  border: 1px solid #ced4da;*/
/*  transition: all 0.2s ease;*/
/*}*/

/*.form-control:focus, .form-select:focus {*/
/*  border-color: #0d6efd;*/
/*  box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);*/
/*}*/

/*!* 🔹 Submit tugmasini yumshatamiz *!*/
/*.btn-success {*/
/*  border-radius: 6px;*/
/*  box-shadow: 0 2px 4px rgba(0,0,0,0.1);*/
/*}*/

/* ====== KADIR FORMS - INPUT STYLING (visual polish) ====== */

/* Container / section header (like the dark blue strips in your screenshot) */
.form-section {
  border-radius: 8px;
  background: #ffffff;
  padding: 18px;
  margin-bottom: 18px;
  box-shadow: 0 1px 0 rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.04);
}

/* Header bar inside each section (if you have an element like .section-title) */
.form-section .section-title {
  display: inline-block;
  width: 100%;
  background: #063354; /* dark blue */
  color: #fff;
  padding: 10px 14px;
  border-radius: 6px;
  margin-bottom: 14px;
  font-weight: 600;
  box-shadow: inset 0 -2px 0 rgba(0,0,0,0.05);
}

/* general form controls */
.form-section input[type="text"],
.form-section input[type="date"],
.form-section input[type="email"],
.form-section input[type="number"],
.form-section input[type="tel"],
.form-section input[type="password"],
.form-section select,
.form-section textarea {
  width: 100%;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid #cfdbe9;
  background: #fff;
  transition: all .15s ease;
  box-shadow: none;
  color: #0b2b3a;
  font-size: 14px;
}

/* subtle input focus */
.form-section input:focus,
.form-section select:focus,
.form-section textarea:focus {
  outline: none;
  border-color: #0b66a3;               /* slightly lighter blue on focus */
  box-shadow: 0 4px 18px rgba(11,102,163,0.08);
  transform: translateY(0);
}

/* compact inline label + input layout (if labels are inline) */
.form-inline-row { display: flex; align-items: center; gap: 12px; }
.form-inline-row .label-inline { min-width: 140px; color: #063354; font-weight: 600; }
.form-inline-row .field-inline { flex: 1; }

/* make selects visually consistent */
.form-section select.form-select,
.form-section select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, #0b66a3 50%),
                    linear-gradient(135deg, #0b66a3 50%, transparent 50%),
                    linear-gradient(to right, #f8fafc, #f8fafc);
  background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px), 100% 0;
  background-size: 6px 6px, 6px 6px, 2.5em 2.5em;
  background-repeat: no-repeat;
  padding-right: 36px;
}

/* textarea look */
.form-section textarea {
  min-height: 90px;
  resize: vertical;
}

/* File input (styling modern) */
.form-section input[type="file"] {
  display: inline-block;
  font-size: 14px;
  color: #063354;
}

/* style the file selector button (modern browsers) */
.form-section input[type="file"]::-webkit-file-upload-button {
  background: #fff;
  color: #063354;
  border: 1px solid #cfdbe9;
  padding: 6px 10px;
  margin-right: 8px;
  border-radius: 6px;
  cursor: pointer;
}
.form-section input[type="file"]::-moz-file-upload-button {
  background: #fff;
  color: #063354;
  border: 1px solid #cfdbe9;
  padding: 6px 10px;
  border-radius: 6px;
  cursor: pointer;
}

/* Buttons area */
.form-actions {
  display: flex;
  justify-content: center;  /* as in screenshot, center the buttons */
  gap: 12px;
  margin-top: 18px;
}

/* cancel and save buttons */
.btn-cancel {
  background: #c8ced6;
  color: #063354;
  border-radius: 8px;
  padding: 8px 18px;
  border: none;
  box-shadow: none;
}
.btn-cancel:hover { background: #b4bbc4; }

.btn-save {
  background: #063354;
  color: #fff;
  border-radius: 8px;
  padding: 8px 18px;
  border: none;
  box-shadow: 0 4px 20px rgba(6,51,84,0.12);
}
.btn-save:hover { background: #052b48; }

/* small input sizes like in your screenshot (for short inline inputs) */
.form-section .small-input {
  width: 160px;      /* adjust as needed */
  display: inline-block;
}

/* table-like spacing (optional) */
.form-section .row > .col-md-4,
.form-section .row > .col-md-6 {
  padding-top: 6px;
}

/* responsive tweaks */
@media (max-width: 767px) {
  .form-inline-row { flex-direction: column; align-items: stretch; }
  .form-inline-row .label-inline { min-width: 0; }
  .form-section input, .form-section select { font-size: 15px; }
}

/* small helper to ensure unstyled form widgets are still improved */
input:not([class]), select:not([class]), textarea:not([class]) {
  /* only apply basic styling if no bootstrap class present */
  border-radius: 6px;
  padding: 7px 9px;
  border: 1px solid #d4e0ea;
}

/*Sahilarni ko'rish tuglamari*/
.pagination .page-link {
  color: #003566;
  border-radius: 6px;
  margin: 0 3px;
  font-weight: 500;
}

.pagination .page-item.active .page-link {
  background-color: #003566;
  border-color: #003566;
  color: white;
}

.pagination .page-item.disabled .page-link {
  color: #aaa;
  background-color: #f5f5f5;
}


/* === Jadval asosiy dizayni === */
.table {
  border-collapse: collapse;
  width: 100%;
  background-color: #fff;
  table-layout: fixed; /* Ustun kengligini boshqarish uchun */
}

/* Jadval sarlavhalari */
.table th {
  background-color: #111;
  color: #fff;
  font-weight: 600;
  padding: 10px 12px;
  font-size: 15px;
  text-align: left; /* chapga tekislash */
  white-space: nowrap;
}

/* Jadval hujayralari */
.table td {
  padding: 10px 12px;
  border-bottom: 1px solid #e0e0e0;
  text-align: left; /* hamma matn chapga tekis */
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* === Ustunlar bo‘yicha maxsus kenglik === */
.table td:nth-child(1), .table th:nth-child(1) {  /* ID */
  width: 50px;
  text-align: center;
}

.table td:nth-child(2), .table th:nth-child(2) {  /* Familya Ism Otasining ismi */
  white-space: normal; /* bu yerda matn to‘liq chiqadi */
  word-break: break-word;
  width: 280px;
}

.table td:nth-child(3), .table th:nth-child(3) {  /* Fakultet */
  white-space: normal;
  word-break: break-word;
  width: 180px;
}

.table td:nth-child(6), .table th:nth-child(6) {  /* Dela raqami */
  white-space: normal;
  word-break: break-word;
  width: 120px;
  text-align: left;
}

/* === Amallar ustuni (butunlay to'liq ko'rinsin) === */
.table td:last-child,
.table th:last-child {
  width: 150px;              /* kengroq joy */
  min-width: 150px;          /* siqilmasligi uchun */
  white-space: nowrap;       /* tugmalar yonma-yon chiqadi */
  text-align: center;        /* markazda joylashadi */
  vertical-align: middle;
  overflow: visible;         /* qirqilmasin */
}

.table td:last-child .btn {
  display: inline-block;
  width: 35px;
  height: 35px;
  padding: 4px;
  font-size: 15px;
  border-radius: 6px;
  margin: 0 2px;
}


/* Hover effekti */
.table tbody tr:hover {
  background-color: #f5f7fb;
  transition: 0.2s;
}

/* Jadval scroll uchun */
.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Tugmalar */
.btn-outline-info, .btn-outline-primary, .btn-outline-danger {
  border-radius: 6px;
  padding: 4px 8px;
  font-size: 14px;
}
.btn-outline-info:hover {
  background-color: #0dcaf0;
  color: white;
}
.btn-outline-primary:hover {
  background-color: #0d6efd;
  color: white;
}
.btn-outline-danger:hover {
  background-color: #dc3545;
  color: white;
}







/* Jadval asosiy stillari */
.table {
    font-size: 0.85rem;
    table-layout: auto; /* ← auto ga o'zgardi, fixed dan */
    width: 100%;
    border: none !important;
}

/* Header (sarlavha) stillari */
.table thead th {
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
    vertical-align: middle;
    padding: 12px 8px;
    text-align: center;
    border: none !important;
}

/* Body (ma'lumotlar) stillari */
.table tbody td {
    vertical-align: middle;
    padding: 10px 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border: 1px solid #c2c0c0 !important;
}

/* Mutaxassislik uchun wrap */
.table td:nth-child(6) {
    white-space: normal !important;
    word-wrap: break-word;
    max-width: 250px; /* Maksimal kenglik */
}

/* ⭐ USTUNLAR KENGLIGI */

/* 1. ID - markazda, kichik */
.table th:nth-child(1),
.table td:nth-child(1) {
    width: 40px;
    text-align: center;
}

/* 2. FIO - chapda, keng */
.table th:nth-child(2),
.table td:nth-child(2) {
    width: auto;
    min-width: 200px;
    text-align: left;
}

/* 3. Fakultet - chapda */
.table th:nth-child(3),
.table td:nth-child(3) {
    width: 150px;
    text-align: center;
}

/* 4. Ta'lim turi - chapda */
.table th:nth-child(4),
.table td:nth-child(4) {
    width: 120px;
    text-align: center;
}

/* 5. To'lov shakli - chapda */
.table th:nth-child(5),
.table td:nth-child(5) {
    width: 140px;
    text-align: center;
}

/* 6. Mutaxassislik - chapda, keng */
.table th:nth-child(6),
.table td:nth-child(6) {
    width: auto;
    min-width: 200px;
    text-align: center;
}

/* 7. Dela raqami - chapda */
.table th:nth-child(7),
.table td:nth-child(7) {
    width: 100px;
    text-align: center;
}

/* 8. Amallar - o'ngda */
.table th:nth-child(8),
.table td:nth-child(8) {
    width: 130px;
    text-align: right;
    white-space: nowrap;
}

/* ⭐ TUGMALARNI KICHRAYTIRISH */
.btn-xs {
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    line-height: 1.2;
    margin-left: 2px;
}

.btn-xs i {
    font-size: 0.85rem;
}

/* Hover effekt - chiziqsiz */
.table tbody tr:hover {
    background-color: #f8f9fa;
}

/* Qatorlar orasidagi chiziqni olib tashlash */
.table tbody tr {
    border-top: none !important;
    border-bottom: 1px solid #dee2e6;
}

.table tbody tr:last-child {
    border-bottom: none;
}









/*!*Home page*!*/
/** {*/
/*    margin: 0;*/
/*    padding: 0;*/
/*    box-sizing: border-box;*/
/*}*/

/*body {*/
/*    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;*/
/*    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
/*    min-height: 100vh;*/
/*    padding: 20px;*/
/*}*/

/*.container {*/
/*    max-width: 1200px;*/
/*    margin: 0 auto;*/
/*    background: white;*/
/*    border-radius: 20px;*/
/*    padding: 40px;*/
/*    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);*/
/*}*/

/*h1 {*/
/*    text-align: center;*/
/*    color: #667eea;*/
/*    margin-bottom: 40px;*/
/*    font-size: 2.5em;*/
/*}*/

/*.items-grid {*/
/*    display: grid;*/
/*    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));*/
/*    gap: 20px;*/
/*    margin-bottom: 40px;*/
/*}*/

/*.item-card {*/
/*    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
/*    padding: 20px;*/
/*    border-radius: 15px;*/
/*    color: white;*/
/*    transition: transform 0.3s ease, box-shadow 0.3s ease;*/
/*    cursor: pointer;*/
/*}*/

/*.item-card:hover {*/
/*    transform: translateY(-5px);*/
/*    box-shadow: 0 10px 30px rgba(102, 126, 234, 0.4);*/
/*}*/

/*.item-card h3 {*/
/*    margin-bottom: 10px;*/
/*    font-size: 1.3em;*/
/*}*/

/*.item-card p {*/
/*    opacity: 0.9;*/
/*    line-height: 1.6;*/
/*}*/

/*!* Pagination stillar *!*/
/*.pagination {*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    align-items: center;*/
/*    gap: 10px;*/
/*    margin-top: 40px;*/
/*    flex-wrap: wrap;*/
/*}*/

/*.pagination a,*/
/*.pagination span {*/
/*    padding: 12px 20px;*/
/*    border-radius: 10px;*/
/*    text-decoration: none;*/
/*    transition: all 0.3s ease;*/
/*    font-weight: 600;*/
/*}*/

/*.pagination a {*/
/*    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
/*    color: white;*/
/*}*/

/*.pagination a:hover {*/
/*    transform: translateY(-2px);*/
/*    box-shadow: 0 5px 15px rgba(102, 126, 234, 0.4);*/
/*}*/

/*.pagination .current {*/
/*    background: #2d3748;*/
/*    color: white;*/
/*    font-size: 1.1em;*/
/*}*/

/*.pagination .disabled {*/
/*    background: #e2e8f0;*/
/*    color: #a0aec0;*/
/*    cursor: not-allowed;*/
/*}*/

/*.page-numbers {*/
/*    display: flex;*/
/*    gap: 5px;*/
/*}*/

/*.page-numbers a {*/
/*    min-width: 45px;*/
/*    text-align: center;*/
/*}*/

/*.page-numbers .active {*/
/*    background: #2d3748;*/
/*    color: white;*/
/*}*/

/*.info-text {*/
/*    text-align: center;*/
/*    color: #718096;*/
/*    margin-top: 20px;*/
/*    font-size: 0.95em;*/
/*}*/

/*@media (max-width: 768px) {*/
/*    .container {*/
/*        padding: 20px;*/
/*    }*/

/*    h1 {*/
/*        font-size: 1.8em;*/
/*    }*/

/*    .items-grid {*/
/*        grid-template-columns: 1fr;*/
/*    }*/

/*    .pagination {*/
/*        font-size: 0.9em;*/
/*    }*/

/*    .pagination a,*/
/*    .pagination span {*/
/*        padding: 10px 15px;*/
/*    }*/
/*}*/