var index = {
  root: {
    borderWidth: '1px',
    borderColor: '{content.border.color}',
    borderRadius: '{content.border.radius}',
    transitionDuration: '{transition.duration}'
  },
  navButton: {
    background: 'rgba(255, 255, 255, 0.1)',
    hoverBackground: 'rgba(255, 255, 255, 0.2)',
    color: '{surface.100}',
    hoverColor: '{surface.0}',
    size: '3rem',
    gutter: '0',
    prev: {
      borderRadius: '0 12px 12px 0'
    },
    next: {
      borderRadius: '12px 0 0 12px'
    },
    focusRing: {
      width: '{focus.ring.width}',
      style: '{focus.ring.style}',
      color: '{focus.ring.color}',
      offset: '{focus.ring.offset}',
      shadow: '{focus.ring.shadow}'
    }
  },
  navIcon: {
    size: '1.5rem'
  },
  thumbnailsContent: {
    padding: '1rem 0.25rem'
  },
  thumbnailNavButton: {
    size: '2rem',
    borderRadius: '{content.border.radius}',
    gutter: '0.5rem',
    focusRing: {
      width: '{focus.ring.width}',
      style: '{focus.ring.style}',
      color: '{focus.ring.color}',
      offset: '{focus.ring.offset}',
      shadow: '{focus.ring.shadow}'
    }
  },
  thumbnailNavButtonIcon: {
    size: '1rem'
  },
  caption: {
    background: 'rgba(0, 0, 0, 0.5)',
    color: '{surface.100}',
    padding: '1rem'
  },
  indicatorList: {
    gap: '0.5rem',
    padding: '1rem'
  },
  indicatorButton: {
    width: '1rem',
    height: '1rem',
    activeBackground: '{primary.color}',
    borderRadius: '50%',
    focusRing: {
      width: '{focus.ring.width}',
      style: '{focus.ring.style}',
      color: '{focus.ring.color}',
      offset: '{focus.ring.offset}',
      shadow: '{focus.ring.shadow}'
    }
  },
  insetIndicatorList: {
    background: 'rgba(0, 0, 0, 0.5)'
  },
  insetIndicatorButton: {
    background: 'rgba(255, 255, 255, 0.4)',
    hoverBackground: 'rgba(255, 255, 255, 0.6)',
    activeBackground: 'rgba(255, 255, 255, 0.9)'
  },
  closeButton: {
    size: '3rem',
    gutter: '0.5rem',
    background: 'rgba(255, 255, 255, 0.1)',
    hoverBackground: 'rgba(255, 255, 255, 0.2)',
    color: '{surface.50}',
    hoverColor: '{surface.0}',
    borderRadius: '50%',
    focusRing: {
      width: '{focus.ring.width}',
      style: '{focus.ring.style}',
      color: '{focus.ring.color}',
      offset: '{focus.ring.offset}',
      shadow: '{focus.ring.shadow}'
    }
  },
  closeButtonIcon: {
    size: '1.5rem'
  },
  colorScheme: {
    light: {
      thumbnailsContent: {
        background: '{surface.50}'
      },
      thumbnailNavButton: {
        hoverBackground: '{surface.100}',
        color: '{surface.600}',
        hoverColor: '{surface.700}'
      },
      indicatorButton: {
        background: '{surface.200}',
        hoverBackground: '{surface.300}'
      }
    },
    dark: {
      thumbnailsContent: {
        background: '{surface.800}'
      },
      thumbnailNavButton: {
        hoverBackground: '{surface.700}',
        color: '{surface.400}',
        hoverColor: '{surface.0}'
      },
      indicatorButton: {
        background: '{surface.700}',
        hoverBackground: '{surface.600}'
      }
    }
  }
};

export { index as default };
//# sourceMappingURL=index.mjs.map
