/* 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: #FFFFFF; --color-table-title-bg: #ffffff; --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: ##47454b !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; }