/*-
 * #%L
 * BroadleafCommerce Open Admin Platform
 * %%
 * Copyright (C) 2009 - 2025 Broadleaf Commerce
 * %%
 * Licensed under the Broadleaf Fair Use License Agreement, Version 1.0
 * (the "Fair Use License" located  at http://license.broadleafcommerce.org/fair_use_license-1.0.txt)
 * unless the restrictions on use therein are violated and require payment to Broadleaf in which case
 * the Broadleaf End User License Agreement (EULA), Version 1.1
 * (the "Commercial License" located at http://license.broadleafcommerce.org/commercial_license-1.1.txt)
 * shall apply.
 * 
 * Alternatively, the Commercial License may be replaced with a mutually agreed upon license (the "Custom License")
 * between you and Broadleaf Commerce. You may not use this file except in compliance with the applicable license.
 * #L%
 */
/* Off canvas layout CSS/JS provided by or adapted from work by Jason Weaver and Luke Wroblewski Requires globals.css grid.css */
body.off-canvas { padding: 0; margin: 0; }

.container { width: 100%; }

.row { overflow: visible; }

.row .row { overflow: visible; }

.paneled .container { overflow: hidden; }

.paneled .row { width: 100%; }

[role="main"]:before { content: " "; position: absolute; z-index: -1; top: 0; left: -100%; width: 100%; height: 100%; }

[role="complementary"], [role="main"] { width: 100%; padding: 0 8px; display: block; position: relative; z-index: 1; -webkit-transition: 0.25s all ease-in; -moz-transition: 0.25s all ease-in; -o-transition: 0.25s all ease-in; transition: 0.25s all ease-in; }

.paneled [role="main"] { padding: 0; }

.page-panel { width: 100%; padding: 0 15px; -webkit-transition: 0.3s margin ease-in-out; -moz-transition: 0.3s margin ease-in-out; -o-transition: 0.3s margin ease-in-out; transition: 0.3s margin ease-in-out; background: #fff; }

#switchPanels { margin: 0 -15px; }

.hide-extras [role="complementary"] { display: block; }

[role="navigation"]#topMenu { -webkit-transition: 0.25s all ease-in; -moz-transition: 0.25s all ease-in; -o-transition: 0.25s all ease-in; transition: 0.25s all ease-in; }

[role="navigation"]#topMenu ul { margin-top: 0; }

[role="complementary"] { margin-left: 0; width: 20%; float: left; z-index: 2; padding: 0 8px; }

[role="main"] { width: 80%; margin-left: 0; float: right; z-index: 1; position: relative; padding: 0 15px; }

.paneled [role="main"] { background: #fff; width: 500%; overflow: hidden; float: none; position: relative; left: 0; -webkit-transition: 0.15s all ease-in; -moz-transition: 0.15s all ease-in; -o-transition: 0.15s all ease-in; transition: 0.15s all ease-in; }

.page-panel { min-height: 400px; float: left; margin: 0; width: 20%; }

.active [role="complementary"] { margin-left: 0; }

.active [role="main"] { margin-right: -80%; }

.active-menu [role="navigation"]#topMenu { margin-top: 0 !important; }

[role="navigation"]#topMenu { display: none; }
