/* Here, the content of the common custom CSS defined into Home - Setup - Display - CSS*/
/* Main menu container styling */
.tmenudiv {
padding: 2px 0 !important;
}

/* Remove styling */
.tmenu > .tmenucenter,
.tmenu > .tmenucenter > a,
.tmenu > .tmenucenter > a > div,
.tmenu > .tmenucenter > a > div > span,
.tmenusel > .tmenucenter,
.tmenusel > .tmenucenter > a,
.tmenusel > .tmenucenter > a > div,
.tmenusel > .tmenucenter > a > div > span,
.tmenuimage,
.mainmenu,
.menuhidermenuhider > .tmenucenter,
.menuhidermenuhider > .tmenucenter > a,
.menuhider > .tmenucenter > a > div,
.menuhider > .tmenucenter > a > div > span {
position: relative ;
left: 0 ;
right: 0 ;
padding: 0 ;
margin: 0 ;
display: flex ;
justify-content: center ;
align-items: center ;
text-align: center ;
left: 0 ;
right: 0 ;
}

li.tmenusel::after,
li.tmenu:hover::after {
display: none ;
}

/* Menu items - general styling */
.tmenu > .tmenucenter {
border: 1px solid rgba(0, 0, 0, 0.1) ;
border-radius: 6px ;
height: 50px ;
background: rgba(255, 255, 255, 0.2) ;
transition: all 0.2s ease ;
margin:0 2px ;
}

.tmenucenter {
height: 50px ;
padding: 5px ; /* Add minimal padding */
display: flex ;
flex-direction: column ; /* Stack icon and text vertically */
justify-content: center ; /* Center vertically */
align-items: center ; /* Center horizontally */
}

/* Hover state for menu items */
.tmenu:not(.nohover):hover > .tmenucenter {
border-color: rgba(255, 255, 255, 0.3) ;
background: rgba(255, 255, 255, 0.5) ;
/*box-shadow: 0 1px 3px rgba(0,0,0,0.1) ;*/
}

/* Active menu item */
.tmenusel > .tmenucenter {
/*border: 1px solid #2a8fbd ;*/
border: 1px solid #ffffff ;
border-radius: 6px ;
padding: 0px ;
}

/* Menu icons size */
.topmenuimage {
font-size: 1.5em ;
}

/* Logo and menu hider */
.tmenucompanylogo > .tmenucenter,
.menuhider > .tmenucenter {
border: none ;
background: transparent ;
}

/* Dropdown user menu - ensure it stays on top */
.login_block_user .dropdown-menu {
z-index: 1001 ;
}

@media (max-width: 1330px) {
/* remove text */
.tmenulabel .mainmenuaspan {
display: none ;
}

/* icon size */
.tmenuimage {
font-size: 1.3em ;
}

/* menu size*/
.tmenu > .tmenucenter,
.tmenusel > .tmenucenter,
.tmenucenter {
display: flex ;
flex-direction: column ; /* Stack icon and text vertically */
justify-content: center ; /* Center vertically */
align-items: center ; /* Center horizontally */
height: 44px ;
width: 44px ;
max-height: 44px ;
margin: 0 ;
padding: 0 ;
}

.tmenu > .tmenucenter > a > div {
min-width: 44px ;
}

/* unselected menu border*/
.tmenu > .tmenucenter {
border: 1px solid rgba(0, 0, 0, 0.1) ;
border-radius: 6px ;
background: rgba(255, 255, 255, 0.2) ;
transition: all 0.2s ease ;
margin: 0 2px ;
}

.tmenucompanylogo > .tmenucenter {
border: none ;
background: transparent ;
}
}
/* Responsive adjustments */
@media (max-width: 889px) {
.tmenu > .tmenucenter {
border: 1px solid rgba(0, 0, 0, 0.1) ;
border-radius: 6px ;
min-height: 10px ;
padding: 0px ;
background: rgba(255, 255, 255, 0.2) ;
transition: all 0.2s ease ;
margin: 0 ;
}

.tmenu > .tmenucenter,
.tmenusel > .tmenucenter,
.tmenucenter {
display: flex ;
flex-direction: column ;
justify-content: center ;
align-items: center ;
min-height: 34px ;
max-height: 34px ;
min-width: 34px ;
max-width: 34px ;
padding: 0 ;
margin: 0 ;
}

.tmenuimage {
font-size: 1.1em ;
}
.tmenulabel .mainmenuaspan {
display: none ;
}
.tmenucompanylogo > .tmenucenter,
.menuhider > .tmenucenter {
border: none ;
background: transparent ;
}
#mainmenutd_menu .tmenuimage,
#mainmenutd_menu .mainmenu {
position: static ;
transform: none ;
}

}
/* ============================
TEMA PERSONALIZADO DOLIBARR
Basado en logo azul tecnológico
============================ */

/* === COLORES BASE === */
:root {
--color-menu-top: #0D1A2B;
--color-menu-left: #E9ECEF;
--color-background: #FFFFFF;
--color-titlebar: #0F4C75;
--color-table-title-bg: #F2F5F7;
--color-table-title-text: #1B263B;
--color-table-title-link: #0077B6;
--color-table-row-odd: #FFFFFF;
--color-table-row-even: #F8FAFB;
--color-link: #00A8E8;
--color-row-hover: #E0F2FF;
--color-row-selected: #CFE0F5;
--color-button-bg: #0E7490;
--color-button-text: #FFFFFF;
}

/* === MENÚ SUPERIOR === */
div#id-top {
background-color: var(--color-menu-top) !important;
color: #FFFFFF !important;
}

/* === MENÚ IZQUIERDO === */
div#leftmenu, .side-nav, .vmenu {
background-color: var(--color-menu-left) !important;
}

/* === FONDO GENERAL === */
body {
background-color: var(--color-background) !important;
color: #1B263B;
}

/* === PÁGINA DE TÍTULO === */
div.titre, .titlearea, .arearef {
background-color: var(--color-titlebar) !important;
color: #FFFFFF !important;
border-radius: 4px;
padding: 6px 12px;
}

/* === TABLAS === */
table.liste_titre {
background-color: var(--color-table-title-bg) !important;
color: var(--color-table-title-text) !important;
}

table.liste_titre a {
color: var(--color-table-title-link) !important;
}

table.liste tr:nth-child(odd) {
background-color: var(--color-table-row-odd) !important;
}

table.liste tr:nth-child(even) {
background-color: var(--color-table-row-even) !important;
}

/* === EFECTOS DE INTERACCIÓN === */
tr:hover {
background-color: var(--color-row-hover) !important;
}

tr.selected, tr.highlighted {
background-color: var(--color-row-selected) !important;
}

/* === ENLACES === */
a {
color: var(--color-link);
text-decoration: none;
}

a:hover {
color: #005F99;
text-decoration: underline;
}

/* === BOTONES === */
.button, input[type=submit], input[type=button], .butAction {
background-color: var(--color-button-bg) !important;
color: var(--color-button-text) !important;
border: none;
border-radius: 6px;
padding: 8px 14px;
transition: background-color 0.2s ease;
}

.button:hover, .butAction:hover {
background-color: #0C5F77 !important;
}

/* === DETALLES ADICIONALES === */
#id-top a, #id-top .login_block {
color: #FFFFFF !important;
}

.vmenu a:hover {
background-color: #DDE7F0 !important;
}