/* ============================================
   Onix Computación - FileBrowser
   Tema: Hielo dominante (azul dragón + acentos fuego naranja)
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@400;500;600;700&display=swap');

:root {
  --onix-hielo: #4ab0e0;
  --onix-hielo-tenue: #8fc5e8;
  --onix-fuego: #ff7a1a;
  --onix-fuego-tenue: #e0a066;
  --onix-fondo: #050d14;
  --onix-panel: #0a1a26;
  --onix-borde: #1a3a52;
  --onix-texto: #4ab0e0;
  --onix-texto-tenue: #8fc5e8;

  --icon-blue: #4ab0e0 !important;
  --icon-yellow: #ff7a1a !important;
  --icon-white: #4ab0e0 !important;
  --icon-red: #ff3131 !important;
  --icon-green: #4ab0e0 !important;
}

body,
#app {
  font-family: 'Chakra Petch', 'Segoe UI', sans-serif !important;
  background-color: var(--onix-fondo) !important;
  color: var(--onix-texto) !important;
}

header,
#sidebar,
.sidebar {
  background-color: var(--onix-panel) !important;
  border-color: var(--onix-borde) !important;
  border-right: 1px solid var(--onix-borde) !important;
}

#logo,
.logo,
header .name {
  color: var(--onix-hielo) !important;
  font-weight: 800 !important;
  letter-spacing: 1px;
}

a, .action, #sidebar a {
  color: var(--onix-texto-tenue) !important;
}

a:hover, .action:hover, #sidebar a:hover {
  color: var(--onix-fuego) !important;
  background-color: rgba(255, 122, 26, 0.1) !important;
}

button.primary,
.button--flat.primary,
a.button.primary,
#sidebar .action.active {
  background-color: var(--onix-hielo) !important;
  color: #051a26 !important;
  border: 1px solid var(--onix-hielo) !important;
}

#listing.mosaic .item,
#listing.list .item,
#listing .item {
  background-color: var(--onix-panel) !important;
  border: 1px solid var(--onix-borde) !important;
}

#listing.mosaic .item:hover,
#listing.list .item:hover,
#listing .item:hover,
#listing .item.selected {
  background-color: rgba(255, 122, 26, 0.1) !important;
  border: 1px solid var(--onix-fuego) !important;
}

.file-icons [data-dir="true"] i,
.file-icons i,
.item i.material-icons {
  color: var(--onix-hielo) !important;
}

.dropdown-menu,
.context-menu,
.popup-wrapper .popup {
  background-color: var(--onix-panel) !important;
  border: 1px solid var(--onix-hielo) !important;
}

.dropdown-menu li:hover,
.context-menu li:hover {
  background-color: rgba(255, 122, 26, 0.12) !important;
  color: var(--onix-fuego) !important;
}

#search,
.search-input {
  background-color: var(--onix-panel) !important;
  border: 1px solid var(--onix-borde) !important;
  color: var(--onix-hielo) !important;
  font-family: 'Chakra Petch', sans-serif !important;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: var(--onix-fondo);
}
::-webkit-scrollbar-thumb {
  background: var(--onix-hielo);
}

.breadcrumbs,
div.breadcrumbs,
nav .breadcrumbs {
  background-color: var(--onix-panel) !important;
  border-color: var(--onix-borde) !important;
}

.breadcrumbs a,
.breadcrumbs i {
  color: var(--onix-hielo) !important;
}

.credits,
.credits * {
  color: var(--onix-texto-tenue) !important;
}

.credits::after {
  content: "Onix Computación · 11 3758-7979";
  display: block;
  font-size: 10px;
  color: var(--onix-texto-tenue);
  margin-top: 6px;
  font-family: 'Chakra Petch', sans-serif;
}

.vue-simple-progress {
  background: rgba(74, 176, 224, 0.12) !important;
  height: 10px !important;
  border-radius: 4px !important;
}

.vue-simple-progress-bar {
  background: var(--onix-fuego) !important;
  height: 10px !important;
}

#login {
  background: var(--onix-fondo) !important;
}

#login input.input,
#login input.input--block {
  background: var(--onix-panel) !important;
  border: 1px solid var(--onix-borde) !important;
  color: var(--onix-hielo) !important;
}

#login input.button,
#login input[type="submit"] {
  background: var(--onix-hielo) !important;
  color: #051a26 !important;
  border: 1px solid var(--onix-hielo) !important;
}

#login::after {
  content: "Tel: 4912-3630  |  Cel/WhatsApp: 11 3758-7979  |  Ventana 3879, Nueva Pompeya, CABA  |  onix.nelson@gmail.com";
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  color: var(--onix-texto-tenue);
  background: var(--onix-panel);
  border-top: 1px solid var(--onix-borde);
  padding: 14px 12px;
  z-index: 999;
}

#login input.input,
#login input.input--block {
  text-align: center !important;
}

#login form p {
  text-align: center !important;
}