/* Custom fixes for layout issues */

/* Ensure body and html don't overflow */
html, body {
    overflow-x: hidden;
}

/* Fix dashboard wrapper to prevent overflow */
.dashboard-main-wrapper {
    max-width: calc(100vw - 252px);
    overflow-x: hidden;
}

/* Responsive fixes */
@media screen and (max-width: 1199px) {
    .dashboard-main-wrapper {
        max-width: 100vw;
    }
}

/* Fix container-fluid to prevent overflow */
.container-fluid {
    max-width: 100%;
    overflow-x: hidden;
    padding-left: 15px;
    padding-right: 15px;
}

/* Fix welcome card to stay within bounds */
.welcome-card {
    max-width: 100%;
    overflow: hidden;
}

/* Fix table responsiveness */
.table-responsive {
    overflow-x: auto;
    max-width: 100%;
}

/* Fix charts container */
.chart-container {
    max-width: 100%;
    overflow: hidden;
}

/* Fix row margins */
.row {
    margin-left: 0;
    margin-right: 0;
}

/* Fix stat widgets */
.stat-widget {
    max-width: 100%;
    overflow: hidden;
}

/* Fix cards */
.card {
    max-width: 100%;
    overflow: hidden;
}

/* Fix navbar */
.top-navbar {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

/* Fix dashboard body */
.dashboard-body {
    max-width: 100%;
    overflow-x: hidden;
}

/* Ensure Phosphor icons display properly for v1.4.2 */
.ph {
    font-family: "Phosphor" !important;
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    line-height: 1 !important;
    speak: never !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block !important;
}

/* Fix sidebar icons specifically */
.sidebar-menu__link .ph,
.stat-icon .ph,
.activity-icon .ph {
    display: inline-block !important;
    font-size: 14px !important; /* slightly smaller */
    font-weight: 300 !important; /* light weight */
}

/* Force icon visibility with correct font family */
.ph:before {
    font-family: "Phosphor" !important;
    font-weight: 300 !important; /* ensure thin glyphs */
}

/* Additional Phosphor icon fixes */
[class^="ph-"]:before,
[class*=" ph-"]:before {
    font-family: "Phosphor" !important;
    font-style: normal !important;
    font-weight: 300 !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none !important;
    display: inline-flex !important;
}

/* Specific icon classes fixes */
.ph-x:before { content: "\e937"; }
.ph-gauge:before { content: "\e621"; }
.ph-buildings:before { content: "\e563"; }
.ph-bed:before { content: "\e555"; }
.ph-student:before { content: "\e8b5"; }
.ph-clipboard-text:before { content: "\e5a3"; }
.ph-calendar-check:before { content: "\e569"; }
.ph-users:before { content: "\e930"; }
.ph-ticket:before { content: "\e8ee"; }
.ph-user:before { content: "\e928"; }
.ph-settings:before { content: "\e621"; }
.ph-sign-out:before { content: "\e896"; }
.ph-bell:before { content: "\e556"; }
.ph-gear:before { content: "\e621"; }
.ph-house:before { content: "\e64a"; }
.ph-list:before { content: "\e6b9"; }

/* Sidebar dropdown caret icon placement and fallback */
.sidebar-menu__item.has-dropdown .sidebar-menu__link { position: relative; }
.sidebar-menu__item.has-dropdown .menu-caret { display: none; }

/* Override theme caret that uses Phosphor private glyphs to use Unicode arrows */
.sidebar-menu__item.has-dropdown .sidebar-menu__link::before {
  content: "\25BC" !important; /* ▼ */
  font-family: inherit !important;
  position: absolute;
  inset-inline-end: 20px;
  inset-block-start: 50%;
  transform: translateY(-50%);
  color: var(--gray-400, #9aa2ac) !important;
  font-size: 14px;
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  border: 0 !important;
}

/* Remove arrows from menu items without dropdown */
.sidebar-menu__item:not(.has-dropdown) .sidebar-menu__link::before {
  content: none !important;
  display: none !important;
}

/* Ensure space for caret so it doesn't overlap text */
.sidebar-menu__item.has-dropdown .sidebar-menu__link {
  padding-right: 28px !important;
}
.sidebar-menu__item.open > .sidebar-menu__link::before,
.sidebar-menu__item.active > .sidebar-menu__link::before {
  content: "\25B2" !important; /* ▲ */
}

/* Force button visibility */
.btn {
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
    color: inherit !important;
}

.btn-outline-primary {
    color: #0d6efd !important;
    border-color: #0d6efd !important;
    background-color: transparent !important;
}

.btn-outline-primary:hover {
    color: #fff !important;
    background-color: #0d6efd !important;
    border-color: #0d6efd !important;
}

.btn-outline-danger {
    color: #dc3545 !important;
    border-color: #dc3545 !important;
    background-color: transparent !important;
}

.btn-outline-danger:hover {
    color: #fff !important;
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
}

.btn-outline-success {
    color: #198754 !important;
    border-color: #198754 !important;
    background-color: transparent !important;
}

.btn-outline-success:hover {
    color: #fff !important;
    background-color: #198754 !important;
    border-color: #198754 !important;
}

.btn-outline-warning {
    color: #ffc107 !important;
    border-color: #ffc107 !important;
    background-color: transparent !important;
}

.btn-outline-warning:hover {
    color: #000 !important;
    background-color: #ffc107 !important;
    border-color: #ffc107 !important;
}

.btn-outline-info {
    color: #0dcaf0 !important;
    border-color: #0dcaf0 !important;
    background-color: transparent !important;
}

.btn-outline-info:hover {
    color: #000 !important;
    background-color: #0dcaf0 !important;
    border-color: #0dcaf0 !important;
}

.btn-outline-secondary {
    color: #6c757d !important;
    border-color: #6c757d !important;
    background-color: transparent !important;
}

.btn-outline-secondary:hover {
    color: #fff !important;
    background-color: #6c757d !important;
    border-color: #6c757d !important;
}

/* Force table visibility */
.table tbody tr {
    display: table-row !important;
    opacity: 1 !important;
    visibility: visible !important;
    background-color: white !important;
}

.table tbody td {
    display: table-cell !important;
    opacity: 1 !important;
    visibility: visible !important;
    background-color: white !important;
}

.table td, .table th {
    color: #212529 !important;
}

/* Force action button containers to be visible */
.room-actions,
.module-actions,
.card-actions,
.item-actions {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    gap: 0.25rem !important;
}

.room-actions .btn,
.module-actions .btn,
.card-actions .btn,
.item-actions .btn {
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
    margin-right: 0.25rem !important;
}

/* Ensure small buttons are visible */
.btn-sm {
    padding: 0.25rem 0.5rem !important;
    font-size: 0.875rem !important;
    border-radius: 0.2rem !important;
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Universal icon container styles */
.icon-container,
.stats-icon,
.stat-icon,
.activity-icon,
.guideline-icon,
.meal-icon,
.ticket-icon,
.visitor-icon,
.room-icon,
.upload-icon,
.empty-state-icon,
.quick-action-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Ensure all icons are visible */
.ph,
[class*="ph-"] {
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
    font-size: inherit !important;
}

/* Icon container sizing */
.icon-container {
    width: 50px !important;
    height: 50px !important;
    border-radius: 10px !important;
    font-size: 1.5rem !important;
}

.stats-icon,
.stat-icon {
    width: 60px !important;
    height: 60px !important;
    border-radius: 12px !important;
    font-size: 1.8rem !important;
}

.activity-icon {
    width: 40px !important;
    height: 40px !important;
    border-radius: 8px !important;
    font-size: 1.2rem !important;
}

/* Ensure icon colors work */
.icon-container .ph,
.stats-icon .ph,
.stat-icon .ph,
.activity-icon .ph {
    color: white !important;
}

/* Fix for icon containers without background colors */
.icon-container:not([class*="bg-"]) {
    background: rgba(255, 255, 255, 0.2) !important;
}

/* Enhanced sidebar active states */
.sidebar-menu__item.active > .sidebar-menu__link {
    background: linear-gradient(135deg, #184433 0%, #000000 100%);
    color: white !important;
    border-radius: 8px !important;
}

.sidebar-menu__item.active > .sidebar-menu__link .icon {
    color: white !important;
}

.sidebar-menu__item.active > .sidebar-menu__link .text {
    color: white !important;
    font-weight: 600 !important;
}

.sidebar-menu__item.active > .sidebar-menu__link .menu-caret {
    color: white !important;
}

.sidebar-menu__item.active > .sidebar-menu__link .menu-caret i {
    transform: rotate(180deg) !important;
}

.sidebar-menu__item.active .sidebar-submenu {
    display: block !important;
}

.sidebar-submenu__item .sidebar-submenu__link.active {
    background: rgba(102, 126, 234, 0.1) !important;
    color: #667eea !important;
    border-left: 3px solid #667eea !important;
    font-weight: 600 !important;
    border-radius: 0 8px 8px 0 !important;
}

.sidebar-submenu__item .sidebar-submenu__link.active:hover {
    background: rgba(102, 126, 234, 0.15) !important;
}

/* Ensure submenu is visible when parent is active */
.sidebar-menu__item.active .sidebar-submenu {
    max-height: 500px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Hover effects for menu items */
.sidebar-menu__item:not(.active):hover > .sidebar-menu__link {
    background: rgba(102, 126, 234, 0.05) !important;
    border-radius: 8px !important;
}

.sidebar-submenu__item:not(.active):hover .sidebar-submenu__link {
    background: rgba(102, 126, 234, 0.05) !important;
    border-radius: 0 8px 8px 0 !important;
}

/* Fix for edit/pencil icons - ensure visibility without duplicating content */
.ph-pencil,
.ph-edit,
.ph-edit-simple,
.ph-pencil-simple,
.ph-write {
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Override inline styles for outline buttons */
.btn-outline-primary,
.btn-outline-danger,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-info,
.btn-outline-secondary {
    background: transparent !important;
    border: 1px solid !important;
    color: inherit !important;
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Specific outline button colors */
.btn-outline-primary {
    color: #0d6efd !important;
    border-color: #0d6efd !important;
}

.btn-outline-danger {
    color: #dc3545 !important;
    border-color: #dc3545 !important;
}

.btn-outline-success {
    color: #198754 !important;
    border-color: #198754 !important;
}

.btn-outline-warning {
    color: #ffc107 !important;
    border-color: #ffc107 !important;
}

.btn-outline-info {
    color: #0dcaf0 !important;
    border-color: #0dcaf0 !important;
}

.btn-outline-secondary {
    color: #6c757d !important;
    border-color: #6c757d !important;
}

/* Force button visibility with higher specificity */
.room-actions .btn,
.module-actions .btn,
.card-actions .btn,
.item-actions .btn,
.actions .btn {
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
    background: transparent !important;
    border: 1px solid !important;
    color: inherit !important;
}