/* ===================================================
BEDRIVE FULL MODERN UI PACK
Desktop + Mobile Compatible
=================================================== */

/* ==============================
GLOBAL
============================== */

body{
background:linear-gradient(135deg,#0f172a,#1e293b,#334155) !important;
background-attachment:fixed;
font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}

/* ==============================
TOP NAVBAR
============================== */

header,
.navbar,
[data-testid="toolbar"]{

background:rgba(255,255,255,0.15) !important;
backdrop-filter:blur(18px);
border-bottom:1px solid rgba(255,255,255,0.2);

}

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

aside{

background:rgba(255,255,255,0.12) !important;
backdrop-filter:blur(18px);
border-right:1px solid rgba(255,255,255,0.2);

}

/* sidebar menu */

aside a{

border-radius:10px;
margin:4px 8px;
padding:8px 12px;
transition:all .2s ease;

}

/* hover */

aside a:hover{

background:rgba(255,255,255,0.25) !important;
transform:translateX(2px);

}

/* ==============================
FILE GRID
============================== */

[data-testid="file-grid"]{

gap:20px !important;
padding:20px !important;

}

/* ==============================
FILE CARD
============================== */

.file-entry,
.file-card{

background:rgba(255,255,255,0.15) !important;
backdrop-filter:blur(16px);
border-radius:16px;
border:1px solid rgba(255,255,255,0.2);
box-shadow:0 10px 30px rgba(0,0,0,0.15);
transition:all .2s ease;

}

/* hover */

.file-entry:hover{

transform:translateY(-4px);
box-shadow:0 18px 45px rgba(0,0,0,0.25);

}

/* folder preview */

.file-entry img{

width:90px !important;
height:90px !important;
object-fit:contain;

}

/* file name */

.file-entry span{

font-weight:500;

}

/* ==============================
BUTTONS
============================== */

button{

border-radius:10px !important;
transition:all .2s ease;

}

/* primary button */

button.bg-primary{

background:linear-gradient(135deg,#3b82f6,#6366f1) !important;
border:none !important;
box-shadow:0 6px 18px rgba(59,130,246,0.35);

}

/* hover */

button:hover{

transform:translateY(-1px);

}

/* ==============================
INPUT
============================== */

input,
select{

border-radius:8px !important;

}

/* ==============================
MODAL / DROPDOWN
============================== */

.menu,
.dropdown,
.context-menu{

background:rgba(255,255,255,0.25) !important;
backdrop-filter:blur(20px);
border-radius:14px;
border:1px solid rgba(255,255,255,0.3);

}

/* menu item */

.menu button,
.dropdown button{

border-radius:8px;
padding:8px 12px;

}

/* hover */

.menu button:hover{

background:rgba(255,255,255,0.25);

}

/* ==============================
TABLE
============================== */

table{

background:white !important;
border-radius:10px;
overflow:hidden;

}

/* ==============================
SCROLLBAR
============================== */

::-webkit-scrollbar{
width:10px;
}

::-webkit-scrollbar-track{
background:transparent;
}

::-webkit-scrollbar-thumb{
background:rgba(255,255,255,0.3);
border-radius:10px;
}

/* ===================================================
MOBILE UI FIX
=================================================== */

@media (max-width:768px){

/* background */

body{
background:linear-gradient(135deg,#0f172a,#1e293b,#334155) !important;
}

/* mobile header fix */

header,
.navbar,
[data-testid="toolbar"]{

min-height:64px !important;
height:64px !important;
padding:10px 16px !important;
display:flex !important;
align-items:center !important;

background:rgba(255,255,255,0.15) !important;
backdrop-filter:blur(18px);

}

/* header logo */

header img{

height:28px !important;

}

/* header icons */

header svg{

width:22px !important;
height:22px !important;

}

/* header buttons */

header button{

padding:6px !important;

}

/* mobile grid */

[data-testid="file-grid"]{

gap:14px !important;
padding:14px !important;

}

/* mobile file card */

.file-entry{

background:rgba(255,255,255,0.15) !important;
backdrop-filter:blur(16px);
border-radius:18px;
border:1px solid rgba(255,255,255,0.2);

}

/* mobile folder icon */

.file-entry img{

width:70px !important;
height:70px !important;

}

/* tap animation */

.file-entry:active{

transform:scale(0.97);

}

/* floating upload button */

button[aria-label="Upload"],
button[data-testid="upload-button"]{

position:fixed;
bottom:20px;
right:20px;
width:56px;
height:56px;
border-radius:50%;
background:linear-gradient(135deg,#3b82f6,#6366f1);
box-shadow:0 10px 30px rgba(0,0,0,0.25);

}

}